@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600;700&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#f1f2f5;background:#0b0c10;font-synthesis:none;font-optical-sizing:auto;--green:#83e27c;--muted:#9b9ea7;--line:#ffffff16;--panel:#14161b}
.load-more{display:block;min-width:190px;margin:20px auto 0;padding:11px 18px}.load-more[hidden]{display:none}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 48% -20%,#18351e 0,transparent 48%),#0b0c10;min-height:100vh}.shell{max-width:1440px;margin:auto;padding:0 42px}.topbar{height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:11px;color:#f7f8f8;text-decoration:none;font:700 14px 'Space Grotesk',sans-serif;letter-spacing:.02em}.brand-mark{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--green);color:#09210c;font:700 17px 'Space Grotesk'}.brand-muted{color:var(--green)}.source-label{display:flex;align-items:center;gap:8px;color:#a2a5ae;font-size:12px}.live-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 10px #83e27c88}
main{padding:42px 0 30px}.hero{display:flex;align-items:end;justify-content:space-between;margin:3px 0 30px}.eyebrow{margin:0 0 13px;color:var(--green);font-size:10px;font-weight:700;letter-spacing:.19em}.hero h1{margin:0;font:600 clamp(38px,5.3vw,66px)/.99 'Space Grotesk',sans-serif;letter-spacing:-.06em}.hero h1 span{color:var(--green)}.subhead{max-width:560px;margin:15px 0 0;color:#a4a7b0;font-size:14px;line-height:1.55}.hero-count{display:grid;text-align:right;gap:4px;padding-bottom:6px}.hero-count strong{font:600 32px 'Space Grotesk'}.hero-count span{color:var(--muted);font-size:11px}
.categories{display:flex;align-items:center;gap:7px;overflow:auto;padding:0 0 14px;border-bottom:1px solid var(--line)}.category{white-space:nowrap;border:1px solid transparent;border-radius:9px;padding:9px 13px;background:transparent;color:#aeb1ba;font:600 12px 'DM Sans';cursor:pointer}.category:hover{color:white;background:#ffffff09}.category.active{color:#b3f2af;background:#24432975;border-color:#83e27c40}.category span{margin-left:5px;color:inherit}.category-spacer{flex:1}.collection-create{color:#a9eaa5}.collection-tabs{display:flex;gap:7px;overflow:auto;padding-top:10px}.collection-tab{display:inline-flex;align-items:center;gap:9px;max-width:220px;padding:7px 10px;border:1px solid #ffffff14;border-radius:8px;background:#121419;color:#9da1aa;font:500 11px 'DM Sans';cursor:pointer}.collection-tab.active{border-color:#83e27c55;background:#18241a;color:#bcf0b8}.collection-tab span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.collection-tab small{color:#777b84}.collection-tab .delete-collection{font-size:15px;color:#7d8189}.collection-tab .delete-collection:hover{color:#ff8b8b}
.filter-panel{margin-top:16px;border:1px solid var(--line);background:#13151a;border-radius:13px;padding:12px}.filter-main{display:grid;grid-template-columns:minmax(245px,1fr) 145px 145px 185px auto;gap:8px}.search{display:flex;align-items:center;gap:9px;min-width:0;border:1px solid #ffffff19;background:#0d0e12;border-radius:9px;padding:0 12px;color:var(--green)}.search span{font-size:22px}.search input{border:0!important;padding-left:0!important}.filter-panel input,.filter-panel select,.dialog-label input{width:100%;min-width:0;border:1px solid #ffffff19;background:#0d0e12;border-radius:9px;padding:10px 11px;color:#eaebef;font:inherit;font-size:12px;outline:none}.filter-panel select:focus,.search:focus-within,.dialog-label input:focus{border-color:#83e27c80}.button{border:1px solid #ffffff20;background:#181a20;color:#ebedf0;border-radius:9px;padding:9px 13px;font:600 11px 'DM Sans';cursor:pointer}.button:hover{border-color:#85e381}.button.primary{background:var(--green);color:#102214;border:0;font-weight:700}.quiet{background:transparent}.filter-toggle{white-space:nowrap}.advanced{display:none;grid-template-columns:repeat(3,minmax(150px,1fr)) auto auto auto;gap:8px;padding-top:9px}.advanced.open{display:grid}.check{display:flex;align-items:center;justify-content:center;gap:8px;color:#b8bbc2;font-size:11px;white-space:nowrap;padding:0 7px}.check input{width:15px;height:15px;accent-color:var(--green)}
.result-line{display:flex;align-items:center;justify-content:space-between;min-height:53px;color:var(--muted);font-size:12px}.result-line p{margin:0}.refresh{border:0;background:transparent;color:#a9eaa5;font:600 11px 'DM Sans';cursor:pointer}.refresh:disabled{opacity:.5;cursor:wait}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:17px}.project-card{overflow:hidden;min-width:0;border:1px solid #ffffff12;border-radius:12px;background:#15171c;transition:transform .18s,border-color .18s,box-shadow .18s;cursor:pointer}.project-card:hover{transform:translateY(-3px);border-color:#ffffff35;box-shadow:0 16px 35px #0005}.project-art{position:relative;display:flex;flex-direction:column;justify-content:space-between;aspect-ratio:2/2.08;overflow:hidden;padding:14px;background:radial-gradient(circle at 80% 20%,#417a4663,transparent 39%),linear-gradient(145deg,#1e3022,#121318 77%);isolation:isolate}.project-art::before,.project-art::after{position:absolute;z-index:-1;content:'';border:1px solid #ffffff12;border-radius:50%}.project-art::before{width:190px;height:190px;right:-57px;top:-55px}.project-art::after{width:145px;height:145px;right:-34px;top:-32px}.art-top,.art-bottom{display:flex;align-items:center;justify-content:space-between;gap:6px}.system-mark{color:#ffffff96;font:700 11px 'Space Grotesk';letter-spacing:.08em}.art-type{padding:4px 7px;border:1px solid #ffffff2a;border-radius:20px;background:#0b0c1070;color:#d6e6d5;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.art-title{max-width:100%;margin:auto 0 18px;font:600 clamp(19px,2vw,26px)/1.08 'Space Grotesk';letter-spacing:-.04em;text-wrap:balance;text-shadow:0 3px 18px #000a}.art-index{color:#ffffff50;font:500 9px 'Space Grotesk';letter-spacing:.12em}.favorite-button{position:absolute;top:10px;right:10px;z-index:2;display:grid;place-items:center;width:31px;height:31px;border:1px solid #fff3;border-radius:50%;background:#111c;color:#d3d6dc;font-size:16px;cursor:pointer;backdrop-filter:blur(8px)}.favorite-button.on{color:#8be484;background:#15291c}.details{padding:11px}.game-title{display:block;min-height:35px;color:#f1f2f4;font:600 13px/1.35 'Space Grotesk';display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.project-name{margin:5px 0 0;color:#92959e;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.badges{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}.badge{padding:4px 7px;border:1px solid #ffffff1b;border-radius:20px;color:#c4c7ce;font-size:9px}.badge.good{border-color:#83e27c55;color:#a7eda1}.badge.warn{border-color:#dba44b66;color:#ffce80}.badge.type-recomp{border-color:#83e27c55;color:#a7eda1}.badge.type-decomp{border-color:#8aa8ff55;color:#b9c8ff}.badge.type-port{border-color:#d6a3ff55;color:#d9b7f2}.empty{grid-column:1/-1;padding:42px;border:1px dashed #ffffff25;border-radius:12px;color:#a2a5ae;text-align:center}.error{color:#ff9898}
footer{margin-top:34px;padding:17px 0;border-top:1px solid var(--line);color:#727680;font-size:10px}footer a{color:#a9eaa5;text-decoration:none}dialog{width:min(440px,calc(100vw - 28px));padding:0;border:1px solid #ffffff22;border-radius:16px;background:#17191f;color:#f2f3f5;box-shadow:0 30px 90px #000a}dialog::backdrop{background:#050608c9;backdrop-filter:blur(5px)}#collectionForm{position:relative;padding:28px}#collectionForm h2{margin:0 0 20px;font:600 24px 'Space Grotesk'}.dialog-close{position:absolute;right:18px;top:15px;border:0;background:transparent;color:#a3a6af;font-size:24px;cursor:pointer}.dialog-label{display:grid;gap:7px;color:#c3c5ca;font-size:11px}.dialog-label input{font-size:13px}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.detail-content{padding:26px}.detail-close{float:right;border:0;background:transparent;color:#aaa;font-size:22px;cursor:pointer}.detail-content h2{margin:0 32px 5px 0;font:600 27px/1.1 'Space Grotesk';letter-spacing:-.04em}.detail-subtitle{margin:0 0 17px;color:#a2a5ae;font-size:12px}.detail-badges{display:flex;flex-wrap:wrap;gap:6px;margin:15px 0}.detail-description{color:#c4c7ce;font-size:13px;line-height:1.65;white-space:pre-line}.detail-meta{display:grid;grid-template-columns:100px 1fr;gap:9px;margin:18px 0;font-size:12px}.detail-meta dt{color:#8b8f98}.detail-meta dd{margin:0;color:#e2e4e8}.detail-link{display:inline-block;margin-top:10px;padding:10px 12px;border:1px solid #83e27c55;border-radius:8px;color:#a9eaa5;text-decoration:none;font-size:12px}.toast-dialog{position:fixed;inset:auto 16px 18px auto;width:auto;max-width:calc(100vw - 32px);border-radius:10px}.toast-dialog p{margin:0;padding:12px 15px;color:#e8ece8;font-size:12px}
@media(max-width:1000px){.shell{padding:0 25px}.filter-main{grid-template-columns:minmax(220px,1fr) 1fr 1fr}.search{grid-column:span 3}.advanced.open{grid-template-columns:repeat(3,minmax(130px,1fr))}.advanced .check{justify-content:flex-start}.grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}}
@media(max-width:600px){.shell{padding:0 14px}.topbar{height:62px}.source-label{font-size:10px}main{padding-top:30px}.hero{align-items:flex-start;margin-bottom:22px}.hero h1{font-size:42px}.subhead{max-width:290px;font-size:12px}.hero-count{padding-top:8px}.hero-count strong{font-size:23px}.hero-count span{max-width:76px;font-size:9px}.categories{margin-right:-14px}.category{padding:8px 10px}.category-spacer{min-width:5px}.filter-main{grid-template-columns:1fr 1fr}.search{grid-column:span 2}.filter-main select:last-of-type{grid-column:span 2}.filter-toggle{grid-column:span 2}.advanced.open{grid-template-columns:1fr 1fr}.advanced .check{grid-column:span 2;justify-content:flex-start;padding:8px}.advanced #resetFilters{grid-column:span 2}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.project-art{padding:10px;aspect-ratio:2/2.2}.art-title{font-size:19px}.details{padding:8px}.game-title{font-size:11px}.project-name{font-size:9px}.badge{font-size:8px;padding:3px 6px}.source-label{gap:5px}}

/* Terminal / Matrix direction */
body{background:radial-gradient(ellipse at 50% -20%,#103b20 0,transparent 48%),#070a08}
.matrix-rain{position:fixed;inset:0;z-index:0;display:flex;justify-content:space-around;overflow:hidden;pointer-events:none;opacity:.16;mask-image:linear-gradient(180deg,transparent,#000 16%,#000 75%,transparent)}
.matrix-rain span{align-self:stretch;min-height:100vh;margin-top:-13vh;color:#57ff75;font:500 clamp(8px,.8vw,11px)/2.2 'IBM Plex Mono',monospace;letter-spacing:.13em;text-shadow:0 0 10px #35ff5b;white-space:nowrap;animation:binary-fall 18s ease-in-out infinite alternate}
.matrix-rain span:nth-child(2n){animation-duration:24s;animation-delay:-8s}.matrix-rain span:nth-child(3n){animation-duration:20s;animation-delay:-13s}.matrix-rain span:nth-child(4n){animation-duration:27s;animation-delay:-5s}
@keyframes binary-fall{from{transform:translateY(-8vh)}to{transform:translateY(8vh)}}
.shell{position:relative;z-index:1}.topbar{border-color:#56ff751c}.brand{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.07em}.brand-mark{border-radius:4px;box-shadow:0 0 20px #56ff7540}.source-label,.subhead,.result-line,footer{font-family:'IBM Plex Mono',monospace}.source-label{font-size:10px;letter-spacing:.02em}.eyebrow{font-family:'IBM Plex Mono',monospace;letter-spacing:.12em}.terminal-prompt{color:#dcffe0;text-shadow:0 0 10px #57ff75;font-size:15px}.hero h1{font-family:'IBM Plex Mono',monospace;font-size:clamp(32px,4.7vw,58px);letter-spacing:-.075em}.hero h1 span{color:#76ff8a;text-shadow:0 0 28px #39ff7040}.hero-count{padding:10px 0 8px 18px;border-left:1px solid #57ff7544}.hero-count strong{font-family:'IBM Plex Mono',monospace;color:#b5ffbd;text-shadow:0 0 18px #57ff7540}.hero-count span{font-family:'IBM Plex Mono',monospace;font-size:9px}
.categories{border-color:#56ff751c}.category{font-family:'IBM Plex Mono',monospace;font-size:10px;border-radius:4px}.category.active{color:#a6ffaf;background:#102719;border-color:#57ff7550;box-shadow:inset 0 0 18px #42ff740d}.collection-tab{font-family:'IBM Plex Mono',monospace;border-radius:4px}.filter-panel{border-color:#56ff7525;border-radius:5px;background:#0c110eeb;box-shadow:0 0 30px #001c09}.filter-panel input,.filter-panel select,.search{border-color:#57ff7525;border-radius:4px;background:#080c09;color:#dcffe0;font-family:'IBM Plex Mono',monospace;font-size:10px}.filter-panel select:focus,.search:focus-within{border-color:#57ff7580;box-shadow:0 0 0 2px #57ff7510}.button{border-radius:4px;font-family:'IBM Plex Mono',monospace}.button.primary{background:#7cff8b;box-shadow:0 0 20px #57ff7528}.filter-toggle,.refresh{font-family:'IBM Plex Mono',monospace}.advanced{border-top:1px solid #57ff7518;margin-top:9px}.result-line{font-size:10px;letter-spacing:.01em}
.binary-line{margin:12px 0 0;color:#76ff8a99;font:500 9px 'IBM Plex Mono',monospace;letter-spacing:.12em;text-shadow:0 0 13px #57ff7524}.binary-line span{color:#dcffe0}
.project-card{border-color:#57ff7524;border-radius:5px;background:#0b100d;box-shadow:0 8px 26px #0005}.project-card:hover{border-color:#57ff7575;box-shadow:0 0 25px #39ff701c,0 16px 35px #0007}.project-art{border-radius:0;background:linear-gradient(145deg,#102718,#08110b 78%)}.project-art::before{inset:0;z-index:0;width:auto;height:auto;border:0;border-radius:0;background:linear-gradient(#57ff7510 1px,transparent 1px),linear-gradient(90deg,#57ff750d 1px,transparent 1px);background-size:24px 24px;opacity:.55}.project-art::after{inset:0;z-index:0;width:auto;height:auto;border:0;border-radius:0;background:repeating-linear-gradient(0deg,transparent 0 4px,#00000020 4px 5px);opacity:.55}.art-top,.art-bottom,.art-title{position:relative;z-index:1}.system-mark,.art-index{font-family:'IBM Plex Mono',monospace}.art-type{border-color:#57ff7540;border-radius:3px;background:#07100bc9;color:#9cffaa;font-family:'IBM Plex Mono',monospace;font-size:8px}.art-title{font-family:'IBM Plex Mono',monospace;color:#d6ffdc;font-size:clamp(17px,1.65vw,22px);text-shadow:0 0 20px #57ff7540,0 3px 18px #000}.favorite-button{border-radius:4px;border-color:#57ff753b;background:#07100bcc;color:#caffd0}.favorite-button.on{background:#12351d;color:#7dff8c}.details{background:linear-gradient(180deg,#0c110e,#090d0a)}.game-title{font-family:'IBM Plex Mono',monospace;font-size:11px;color:#e0ffe4}.project-name{font-family:'IBM Plex Mono',monospace;font-size:9px;color:#809586}.badge{border-color:#57ff7525;border-radius:3px;color:#9cb4a0;font-family:'IBM Plex Mono',monospace;font-size:8px;letter-spacing:.01em}.badge.good,.badge.type-recomp{border-color:#57ff7555;color:#8dff9c}.badge.warn{border-color:#c6a44566;color:#e4cb79}.badge.type-decomp{border-color:#7798a555;color:#b4cfdd}.badge.type-port{border-color:#ab86d455;color:#d0b0ec}.empty{border-color:#57ff7544;border-radius:5px;background:#09100b;color:#a6c2aa;font-family:'IBM Plex Mono',monospace;font-size:12px}.load-more{border-color:#57ff7535;color:#aaffb3}
@media(max-width:600px){.hero h1{font-family:'IBM Plex Mono',monospace;font-size:clamp(25px,7vw,38px);letter-spacing:-.08em}.hero-count{padding-left:9px}.hero-count strong{font-size:20px}.hero-count span{font-size:8px}.binary-line{max-width:330px;overflow:hidden;font-size:7px;white-space:nowrap;letter-spacing:.07em}.matrix-rain{opacity:.1}.matrix-rain span:nth-child(even){display:none}.project-art{border-radius:0}.art-title{font-size:16px}}
@media(prefers-reduced-motion:reduce){.matrix-rain span{animation:none}}

/* Web 1.0: plain, compact game directory */
body{background:#050805;color:#c8d8c8;font-family:Verdana,Arial,sans-serif}
.matrix-rain{opacity:.045;mask-image:linear-gradient(180deg,transparent,#000 8%,#000 90%,transparent)}
.matrix-rain span{font-family:'Courier New',monospace;text-shadow:none;color:#29cc50}
.shell{max-width:1000px;padding:0 18px}
.topbar{height:54px;border-bottom:2px solid #287a35}
.brand{font:700 16px 'Courier New',monospace;color:#baffba;text-decoration:underline}
.brand-mark{width:25px;height:25px;border:1px solid #6bff76;border-radius:0;background:#09200c;color:#7cff88;box-shadow:none;font:700 15px 'Courier New',monospace}
.brand-muted{color:#7cff88}
.source-label{font:11px 'Courier New',monospace;color:#93b493}
.live-dot{width:7px;height:7px;border-radius:0;background:#6bff76;box-shadow:none}
main{padding-top:24px}
.hero{margin:0 0 22px;padding:14px;border:1px solid #287a35;background:#081109}
.eyebrow{font:700 11px 'Courier New',monospace;letter-spacing:.06em;color:#79ff86}
.hero h1{font:700 clamp(30px,5vw,48px)/1.05 'Courier New',monospace;letter-spacing:-.06em;color:#d4ffd5}
.hero h1 span{color:#76ff83;text-decoration:underline;text-decoration-style:dotted;text-shadow:none}
.subhead{font:13px/1.5 Verdana,Arial,sans-serif;color:#b4c4b4}
.binary-line{font:11px 'Courier New',monospace;color:#5aaa67;text-shadow:none}
.hero-count{padding:7px 0 7px 14px;border-left:1px solid #287a35}
.hero-count strong{font:700 27px 'Courier New',monospace;color:#83ff8c;text-shadow:none}
.hero-count span{font:10px 'Courier New',monospace;color:#9cb59c}
.categories{gap:3px;border-bottom:1px solid #287a35}
.category,.collection-tab,.button{border:1px solid #287a35;border-radius:0;font:11px 'Courier New',monospace}
.category{padding:7px 10px;color:#9fc59f}
.category:hover{background:#102313;color:#baffba}
.category.active{border-color:#65e777;background:#143219;color:#baffba;box-shadow:none;text-decoration:underline}
.collection-tab{background:#081109;color:#a9c4a9}
.collection-tab.active{border-color:#65e777;background:#122a16;color:#bdffbd}
.filter-panel{border:1px solid #287a35;border-radius:0;background:#081109;box-shadow:none;padding:8px}
.filter-panel input,.filter-panel select,.search{border:1px solid #356d3b;border-radius:0;background:#030603;color:#d0ecd0;font:11px 'Courier New',monospace}
.filter-panel select:focus,.search:focus-within{border-color:#73ff80;box-shadow:none}
.button{background:#0b160c;color:#b7ddb7}
.button:hover{border-color:#7cff88;background:#132916}
.button.primary{border:1px solid #7cff88;border-radius:0;background:#1a4a22;color:#d1ffd3;box-shadow:none}
.advanced{border-color:#287a35}
.check,.result-line,.refresh{font:11px 'Courier New',monospace;color:#a8c1a8}
.refresh{color:#85ff90;text-decoration:underline}
.grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:9px}
.project-card{border:1px solid #287a35;border-radius:0;background:#070c08;box-shadow:none;transition:none}
.project-card:hover{transform:none;border-color:#8aff91;box-shadow:0 0 0 1px #8aff9140}
.project-art{aspect-ratio:2/1.55;padding:10px;background:#0b1b0e;image-rendering:pixelated}
.project-art::before{background:linear-gradient(#43b95318 1px,transparent 1px),linear-gradient(90deg,#43b95318 1px,transparent 1px);background-size:16px 16px;opacity:.6}
.project-art::after{background:repeating-linear-gradient(0deg,transparent 0 3px,#00000024 3px 4px);opacity:.7}
.art-type,.favorite-button{border:1px solid #3b8c47;border-radius:0;background:#040804;color:#9dffa5;font:10px 'Courier New',monospace}
.favorite-button{width:25px;height:25px;font-size:15px}
.favorite-button.on{background:#17351b;color:#84ff8d}
.system-mark,.art-index{font:10px 'Courier New',monospace;color:#a4cba4}
.art-title{font:700 clamp(16px,1.5vw,20px)/1.1 'Courier New',monospace;letter-spacing:-.04em;color:#ccffd0;text-shadow:1px 1px #000}
.details{padding:9px;background:#070c08}
.game-title{font:700 12px/1.35 Verdana,Arial,sans-serif;color:#d8ead8}
.project-name{font:10px 'Courier New',monospace;color:#91ae91}
.badge{border:1px solid #355d39;border-radius:0;padding:3px 5px;font:9px 'Courier New',monospace;color:#b4c8b4}
.badge.good,.badge.type-recomp{border-color:#418b4a;color:#91ff9a}
.empty{border:1px dashed #398547;border-radius:0;background:#081109;color:#b8d8b8}
footer{border-color:#287a35;font:10px 'Courier New',monospace;color:#819781}
footer a,.detail-link{color:#8aff93;text-decoration:underline}
dialog{border:1px solid #4b9b55;border-radius:0;background:#071008;color:#d8ead8}
dialog::backdrop{background:#000c;backdrop-filter:none}
#collectionForm h2,.detail-content h2{font-family:'Courier New',monospace}
.detail-content h2{color:#caffce}
.detail-description,.detail-meta dd{color:#c2d6c2}
.detail-link{border:1px solid #418b4a;border-radius:0}
.detail-variant{margin:14px 0;padding:14px;border:1px solid #287a35;background:#08110a}
.detail-variant-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.detail-variant-heading h3{margin:5px 0;font:700 16px 'Courier New',monospace;color:#d8ffd9}
.detail-variant-type{color:#89bc90;font:10px 'Courier New',monospace;text-transform:uppercase}
.detail-variant .detail-meta{grid-template-columns:130px 1fr}
#detailDialog{width:min(820px,calc(100vw - 28px));max-height:88vh}
#detailDialog .detail-content{max-height:88vh;overflow:auto;scrollbar-width:thin;scrollbar-color:#398c46 #071008;scrollbar-gutter:stable}
#detailDialog .detail-content::-webkit-scrollbar{width:10px}
#detailDialog .detail-content::-webkit-scrollbar-track{background:#071008;border-left:1px solid #17371d}
#detailDialog .detail-content::-webkit-scrollbar-thumb{border:2px solid #071008;border-radius:8px;background:linear-gradient(180deg,#63d875,#28783a)}
#detailDialog .detail-content::-webkit-scrollbar-thumb:hover{background:#8aff93}
.toast-dialog{border-radius:0}
@media(max-width:600px){.shell{padding:0 9px}.hero{padding:10px}.hero h1{font:700 clamp(25px,7vw,36px)/1.05 'Courier New',monospace}.hero-count{padding-left:8px}.project-art{aspect-ratio:2/1.55}.grid{gap:7px}}
.project-art{isolation:isolate}
.cover-image{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;opacity:.72;image-rendering:auto}
.project-art::before,.project-art::after{z-index:1}
.art-top,.art-bottom,.art-title,.favorite-button{z-index:2}

/* Clear box-art cards */
.grid{grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:12px}
.project-art{display:grid;place-items:center;aspect-ratio:3/4;padding:0;overflow:hidden;background:#050805;image-rendering:auto}
.project-art::before,.project-art::after{display:none}
.cover-image{position:static;inset:auto;display:block;width:100%;height:100%;object-fit:contain;opacity:1;image-rendering:auto}
.cover-placeholder{width:100%;height:100%;display:grid;place-content:center;gap:10px;padding:16px;background:#09120b;color:#a4cba4;text-align:center;font:11px/1.5 'Courier New',monospace}
.details{padding:10px}
.details-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.game-title{min-height:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;font:700 13px/1.35 Verdana,Arial,sans-serif}
.card-favorite{flex:none;padding:4px 6px;border:1px solid #355d39;background:#070c08;color:#b4c8b4;font:9px 'Courier New',monospace;cursor:pointer}
.card-favorite:hover,.card-favorite.on{border-color:#63a96d;color:#a4ffa9}
.badges{margin-top:9px}
.badge{font-size:9px}
@media(max-width:600px){.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.project-art{aspect-ratio:3/4}.details{padding:8px}.details-heading{gap:5px}.game-title{font-size:11px;line-height:1.35}.card-favorite{padding:4px;font-size:8px}.badges{gap:4px}.badge{font-size:8px}}
.advanced.open{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));align-items:center}
.advanced .check{justify-content:flex-start;white-space:normal;min-height:34px}
@media(max-width:600px){.advanced.open{grid-template-columns:1fr 1fr}.advanced .check{grid-column:span 2}}
.infinite-sentinel{padding:18px;text-align:center;color:#83b28a;font:11px 'Courier New',monospace}
.detail-more{font:10px 'Courier New',monospace;color:#9bc99e}
.detail-more summary{cursor:pointer;color:#8aff93;text-decoration:underline;text-underline-offset:2px}
.screenshot-links{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.screenshot-links a{display:inline-block;padding:4px 6px;border:1px solid #355d39;color:#b7e8bb;text-decoration:none}
.filter-main{grid-template-columns:minmax(240px,1.2fr) minmax(165px,.8fr) minmax(170px,.8fr) minmax(185px,.9fr) auto;align-items:end}
.filter-field{display:grid;gap:5px;min-width:0}
.filter-caption{color:#9db69f;font:10px/1.2 'Courier New',monospace}
.filter-main .filter-field select,.filter-main .search{min-height:38px}
.filter-toggle{min-height:38px;align-self:end}
.advanced.open{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));align-items:end}
.advanced .filter-field select{min-height:36px}
.advanced #resetFilters{min-height:36px;align-self:end}
@media(max-width:1000px){.filter-main{grid-template-columns:minmax(220px,1fr) 1fr 1fr}.filter-main .search-field{grid-column:span 3}.filter-main .filter-toggle{grid-column:span 3;justify-self:start}}
@media(max-width:600px){.filter-main{grid-template-columns:1fr 1fr}.filter-main .search-field,.filter-main .filter-toggle{grid-column:span 2}.filter-main .filter-toggle{justify-self:stretch}.advanced.open{grid-template-columns:1fr 1fr}.advanced .filter-field{grid-column:span 2}}
.screenshot-links a:hover{border-color:#8aff93;color:#8aff93}
.detail-variant{margin:8px 0;padding:9px}
.detail-variant-heading{align-items:center;gap:8px}
.detail-variant-heading h3{margin:2px 0;font-size:13px;overflow-wrap:anywhere}
.detail-variant-type{font-size:9px}
.detail-link{flex:none;padding:6px 8px;font-size:10px}
.detail-platforms{margin:4px 0 0;color:#9bb59d;font:10px 'Courier New',monospace}
.detail-more{margin-top:8px}
.detail-more[open]{padding-top:7px;border-top:1px solid #1d4223}
.detail-more .detail-meta{margin-top:8px;font-size:11px}
.detail-more .detail-description{margin:7px 0;font-size:12px;line-height:1.45}
.detail-gallery{margin:10px 0 12px}
.detail-gallery-heading{margin:0 0 6px;color:#8aff93;font:10px 'Courier New',monospace}
.detail-gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:7px}
.detail-gallery-grid a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:130px;padding:5px;overflow:hidden;border:1px solid #287a35;background:#020502;color:#9bc99e;text-decoration:none;font:9px 'Courier New',monospace}
.detail-gallery-grid img{display:block;width:100%;height:110px;object-fit:contain}
.detail-gallery-grid a:hover{border-color:#8aff93}
.detail-gallery-empty{margin:8px 0;color:#77917a;font:10px 'Courier New',monospace}
@media(max-width:600px){.detail-variant{padding:7px}.detail-variant-heading{align-items:flex-start;flex-direction:column}.detail-link{padding:4px 6px}}

/* Subtle Matrix ambience with a small step away from the rigid Web 1.0 look. */
body{zoom:1.1}
body{background:radial-gradient(ellipse at 50% -18%,#102216 0,transparent 44%),radial-gradient(ellipse at 100% 65%,#07120a 0,transparent 38%),#050805}
.matrix-rain{opacity:.075;mask-image:linear-gradient(180deg,transparent,#000 12%,#000 78%,transparent)}
.matrix-rain span{animation-duration:32s;text-shadow:0 0 7px #29cc5030}
.matrix-rain span:nth-child(2n){animation-duration:39s;animation-delay:-12s}
.matrix-rain span:nth-child(3n){animation-duration:35s;animation-delay:-19s}
.matrix-rain span:nth-child(4n){animation-duration:43s;animation-delay:-8s}
.hero,.filter-panel,.project-card,.empty{border-radius:3px}
.project-card{transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.project-card:hover{transform:translateY(-2px);box-shadow:0 8px 22px #0008,0 0 12px #29cc5010}
.button,.category,.collection-tab,.card-favorite,.detail-link{transition:background-color .16s ease,border-color .16s ease,color .16s ease}
@media(prefers-reduced-motion:reduce){.matrix-rain span{animation:none}.project-card,.button,.category,.collection-tab,.card-favorite,.detail-link{transition:none}}

.detail-gallery-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:10px}
.detail-gallery-item{display:grid;place-items:center;min-width:0;min-height:0;padding:0;overflow:hidden;border:1px solid #287a35;background:#020502;cursor:zoom-in}
.detail-gallery-item img{display:block;width:100%;height:clamp(145px,18vw,180px);object-fit:cover;background:transparent}
.detail-gallery-item:hover,.detail-gallery-item:focus-visible{border-color:#8aff93;outline:none}
.image-dialog[open]{position:fixed;inset:0;display:grid;grid-template-columns:64px minmax(0,1fr) 64px;grid-template-rows:56px minmax(0,1fr);align-items:center;gap:10px;width:100vw;max-width:none;height:100vh;height:100dvh;max-height:none;margin:0;padding:16px 20px;border:0;border-radius:0;background:#050608ed;color:#d8dae0}
.image-dialog::backdrop{background:#000d;backdrop-filter:blur(8px)}
.image-dialog .gallery-toolbar{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;font:12px 'Courier New',monospace}
.image-dialog .gallery-close,.image-dialog .gallery-nav{display:grid;place-items:center;border:1px solid #57ff7555;border-radius:4px;background:#071008;color:#d8ead8;cursor:pointer}
.image-dialog .gallery-close{width:40px;height:40px;font:400 27px 'Courier New',monospace}
.image-dialog .gallery-nav{width:48px;height:58px;font:400 36px 'Courier New',monospace}
.image-dialog .gallery-image{grid-column:2;grid-row:2;justify-self:center;max-width:100%;max-height:calc(100dvh - 100px);object-fit:contain;background:transparent}
.image-dialog .gallery-prev{grid-column:1;grid-row:2}.image-dialog .gallery-next{grid-column:3;grid-row:2}
.image-dialog .gallery-close:hover,.image-dialog .gallery-nav:hover{border-color:#8aff93;color:#8aff93}
@media(max-width:600px){.detail-gallery-grid{grid-template-columns:1fr}.detail-gallery-item img{height:160px}.image-dialog[open]{grid-template-columns:38px minmax(0,1fr) 38px;grid-template-rows:44px minmax(0,1fr);gap:4px;padding:8px}.image-dialog .gallery-nav{width:34px;height:48px}.image-dialog .gallery-image{max-height:calc(100dvh - 74px)}}
@supports not (height:100dvh){.image-dialog[open]{height:100vh}.image-dialog .gallery-image{max-height:calc(100vh - 100px)}}
