@font-face{font-family:VT323;src:url("../fonts/VT323-Regular.ttf") format("truetype");font-display:swap}
:root{--bg:#242424;--panel:#303030;--panel2:#383838;--text:#fff;--muted:#bcbcbc;--orange:#f7931a;--border:#555}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#161616;color:var(--text);font-family:VT323,monospace;font-size:20px}
a{color:#ffad43;text-decoration:none}a:hover{text-decoration:underline}
.background-squares{position:fixed;inset:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));grid-auto-rows:64px;z-index:0;overflow:hidden;background:#111}
.background-squares .square{position:relative;min-width:64px;min-height:64px}
.background-squares .square::after{content:"";position:absolute;inset:0;background:rgba(20,20,20,.76)}
.content-area{position:relative;z-index:1;width:min(1180px,94vw);min-height:100vh;margin:0 auto;background:rgba(36,36,36,.97);box-shadow:0 0 40px #000}
.pp-header{background:#343a40;border-bottom:1px solid #4d4d4d;padding:16px 22px 10px}
.pp-logo{display:flex;justify-content:center;align-items:center;font-size:clamp(2.6rem,8vw,4.4rem);font-weight:bold;line-height:1;color:#fff;text-decoration:none;white-space:nowrap}
.pp-logo:hover{text-decoration:none}
.letter{display:inline-block;margin-right:.08em;animation:ppColour 2s infinite alternate}
.letter:nth-child(2){animation-delay:.1s}.letter:nth-child(3){animation-delay:.2s}.letter:nth-child(4){animation-delay:.3s}.letter:nth-child(5){animation-delay:.4s}.letter:nth-child(6){animation-delay:.5s}.letter:nth-child(7){animation-delay:.6s}.letter:nth-child(8){animation-delay:.7s}.letter:nth-child(9){animation-delay:.8s}.letter:nth-child(10){animation-delay:.9s}
@keyframes ppColour{0%{color:#ff4848}25%{color:#f7931a}50%{color:#ffe84b}75%{color:#4bd777}100%{color:#4a8cff}}
.pp-nav{display:flex;align-items:center;justify-content:center;gap:4px;flex-wrap:wrap;margin-top:12px}
.pp-nav>a,.pp-menu>button{font:inherit;color:#fff;background:transparent;border:0;padding:8px 12px;cursor:pointer}
.pp-nav>a:hover,.pp-menu>button:hover,.pp-nav .active{background:#474d52;text-decoration:none}
.pp-menu{position:relative}.pp-menu-items{display:none;position:absolute;left:0;top:100%;min-width:220px;background:#343a40;border:1px solid #555;z-index:30;box-shadow:0 12px 25px #0008}
.pp-menu:hover .pp-menu-items,.pp-menu:focus-within .pp-menu-items{display:block}
.pp-menu-items a{display:block;padding:9px 12px;color:#fff}.pp-menu-items a:hover{background:#474d52;text-decoration:none}
.pp-main{padding:42px clamp(18px,4vw,50px) 60px;min-height:65vh}
.pp-footer{padding:24px;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;border-top:1px solid #454545;color:var(--muted);background:#1f1f1f}
.pp-footer nav{display:flex;gap:16px;flex-wrap:wrap}
.pp-footer a{color:#ddd}
.eyebrow{color:var(--orange);letter-spacing:.08em;margin:0 0 8px;text-transform:uppercase}
.pp-hero{max-width:850px;margin:0 auto 42px;text-align:center}.pp-hero h1{font-size:clamp(2.6rem,7vw,5rem);margin:.1em 0}.pp-hero p{font-size:1.25rem;color:#ddd;line-height:1.35}
.pp-sections{display:grid;gap:34px}.pp-section h2{text-align:center;font-size:2.3rem;margin:0 0 20px}
.pp-card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}
.pp-card{display:flex;flex-direction:column;min-height:220px;padding:22px;border:1px solid #515151;background:#303030;box-shadow:5px 5px 0 #111;color:#fff}
.pp-card:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 #111;text-decoration:none}
.pp-card .icon{font-size:2.5rem}.pp-card h3{font-size:2rem;margin:10px 0 5px}.pp-card p{color:#d3d3d3;line-height:1.25;flex:1;margin:.2em 0 1em}.pp-card .meta{display:flex;gap:8px;flex-wrap:wrap}
.pp-pill{display:inline-block;padding:3px 8px;border:1px solid #666;background:#222;text-transform:uppercase;font-size:.85rem;color:#ddd}
.pp-pill.enabled{border-color:#3d8f58;color:#73e596}.pp-pill.development{border-color:#b17720;color:#ffc45e}.pp-pill.maintenance{border-color:#8d5da0;color:#da9aff}
.pp-panel{background:#303030;border:1px solid #515151;padding:24px;margin-bottom:24px}.pp-centre{text-align:center;max-width:760px;margin:20px auto}
.pp-button,.pp-button-secondary{display:inline-block;border:0;padding:11px 18px;font:inherit;cursor:pointer;text-align:center}
.pp-button{background:darkorange;color:#fff}.pp-button:hover{background:orange;color:#111;text-decoration:none}.pp-button-secondary{background:#494949;color:#fff}
.pp-notice{padding:14px 16px;border-left:4px solid var(--orange);background:#352d23;margin:0 0 24px}
.board-title{text-align:center;font-size:2rem;margin:0 0 24px}
.board-status{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:center;margin:0 auto 24px;max-width:760px;text-align:center}
.board-status select{font:inherit;background:#fff;border:1px solid #aaa;padding:4px 8px}
.pixel-grid{display:grid;grid-template-columns:repeat(32,minmax(0,1fr));grid-template-rows:repeat(32,minmax(0,1fr));gap:1px;width:min(600px,92vw);aspect-ratio:1;margin:0 auto 14px;background:#fff;overflow:hidden}
.pixel-grid .cell{box-sizing:border-box;width:100%;height:100%;min-width:0;min-height:0;margin:0;padding:0;border:1px solid #fff;border-radius:0;appearance:none;background:#ddd;position:relative}
.styled-table{width:100%;border-collapse:collapse;background:#2e2e2e}.styled-table th,.styled-table td{padding:9px 12px;border-bottom:1px solid #505050;text-align:left}.styled-table th{color:#ffb14b}
.project-note{max-width:800px;margin:0 auto 22px;color:#d4d4d4;line-height:1.3}
.two-col{display:grid;grid-template-columns:minmax(0,2fr) minmax(240px,1fr);gap:24px}
.code-sample{display:block;background:#151515;border:1px solid #555;padding:16px;white-space:pre-wrap;overflow:auto;color:#9ee7ac}
@media(max-width:760px){
 .content-area{width:100%;box-shadow:none}.pp-header{padding-inline:8px}.pp-nav{gap:0}.pp-nav>a,.pp-menu>button{padding:7px 8px;font-size:.95rem}
 .pp-main{padding:28px 14px 45px}.board-status{grid-template-columns:1fr;font-size:1.05rem}.pixel-grid{width:96vw;max-width:620px}
 .two-col{grid-template-columns:1fr}.pp-footer{font-size:.9rem}.pp-menu-items{position:fixed;left:8px;right:8px;top:auto;min-width:0}
}