:root{--bg:#0c0c22;--surface:#17162f;--surface-raised:#211e3b;--ink:#f4f1ff;--muted:#a29ab8;--line:#ffffff16;--pink:#ff4da6;--cyan:#46dfeb;--gold:#ffd166;--green:#a8e79d;--shadow:0 12px 40px #0005;--sky:linear-gradient(180deg,#191334 0%,#503068 50%,#ad5788 100%);--grid:#ff62ba35;--font:'Space Grotesk',Arial,sans-serif;--mono:'IBM Plex Mono',monospace;--dendy:var(--pink);--sega:var(--cyan);--snes:var(--green);--psx:var(--gold);--gba:var(--green);--n64:var(--pink);--gameboy:var(--green);--arcade:var(--gold)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);letter-spacing:0}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}button{color:inherit}a{color:inherit;text-decoration:none}.shell{max-width:1440px;margin:auto}.topbar{height:90px;padding:0 48px;display:flex;align-items:center;gap:40px;border-bottom:1px solid var(--line);position:relative;z-index:4;background:var(--bg)}.brand{font-size:23px;font-weight:700;white-space:nowrap;line-height:1}.brand span{color:var(--pink)}.brand small{display:block;font:9px var(--mono);color:var(--muted);margin-top:9px}.brand-icon{color:var(--cyan);font-size:21px;margin-right:9px}.nav{display:flex;gap:27px;font-size:12px;color:var(--muted);align-items:center}.nav button{background:none;border:none;padding:14px 0;border-bottom:2px solid transparent;font-size:12px;color:var(--muted)}.nav button.active{color:var(--ink);border-color:var(--pink)}.header-end{margin-left:auto;display:flex;gap:14px;align-items:center}.online{font:10px var(--mono);color:var(--green)}.online:before{content:'●';margin-right:7px}.icon-button{background:var(--surface);border:1px solid var(--line);width:36px;height:36px;border-radius:6px;display:grid;place-items:center}.primary{background:var(--gold);color:var(--bg);font-weight:700;border:0;padding:12px 20px;border-radius:5px;font-size:12px;display:inline-flex;gap:9px;align-items:center}.outlined{background:transparent;border:1px solid var(--line);padding:11px 17px;border-radius:5px;font-size:12px}.eyebrow{font:10px var(--mono);color:var(--cyan);margin:0 0 17px}.scene{height:415px;position:relative;overflow:hidden;background:var(--sky);border-bottom:1px solid var(--line)}.scene:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,var(--bg) 0%,transparent 70%);pointer-events:none}.scene-copy{position:absolute;top:57px;left:48px;z-index:2;pointer-events:none}.scene-copy h1{font-size:52px;line-height:1.12;font-weight:600;margin:0 0 15px;letter-spacing:0}.scene-copy h1 em{font-style:normal;color:var(--pink)}.scene-copy p{color:var(--muted);font-size:13px;line-height:1.7;margin:0 0 23px;max-width:270px}.scene-copy button{pointer-events:auto}.city-wrap{position:absolute;inset:0 0 0 33%}.city-wrap canvas{width:100%;height:100%;display:block;touch-action:none;cursor:grab}.city-wrap canvas.drag{cursor:grabbing}.scene-label{position:absolute;right:28px;top:23px;z-index:2;display:flex;align-items:center;gap:8px;font:9px var(--mono);color:var(--muted)}.scene-label:before{content:'●';color:var(--pink)}.zoom{position:absolute;right:24px;bottom:25px;display:flex;gap:6px;z-index:3}.zoom button{background:var(--surface);border:1px solid var(--line);width:32px;height:32px;border-radius:4px;font-size:18px}.districts{position:absolute;left:48px;bottom:24px;display:flex;gap:9px;z-index:3}.districts button{padding:8px 14px;border:1px solid var(--line);background:var(--surface);border-radius:4px;font:10px var(--mono);color:var(--muted)}.districts button.active{border-color:var(--pink);color:var(--pink)}.catalog{padding:32px 48px 45px;position:relative;z-index:2}.catalog-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}.catalog-heading h2{font-size:24px;font-weight:500;margin:0}.catalog-heading h2 span{font:10px var(--mono);color:var(--muted);margin-left:12px}.section-note{font:10px var(--mono);color:var(--muted);display:flex;gap:12px}.tools{display:flex;gap:12px;align-items:center;margin-bottom:25px}.search{position:relative;flex:1;max-width:400px}.search span{position:absolute;left:14px;top:12px;color:var(--muted);font-size:19px;line-height:1}.search input{width:100%;height:41px;padding:0 16px 0 40px;background:var(--surface);border:1px solid var(--line);border-radius:5px;color:var(--ink);font-size:12px}.search input::placeholder{color:var(--muted)}select{height:41px;background:var(--surface);color:var(--ink);padding:0 30px 0 12px;border:1px solid var(--line);border-radius:5px;font-size:11px;max-width:170px}.sort{display:flex;gap:5px;margin-left:auto}.sort button{height:36px;font:10px var(--mono);color:var(--muted);border:1px solid var(--line);background:transparent;padding:0 12px;border-radius:4px}.sort button.active{color:var(--gold);background:var(--surface);border-color:var(--gold)}.game-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:19px}.game{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:7px;overflow:hidden;transition:transform .18s,border-color .18s}.game:hover{transform:translateY(-4px);border-color:var(--cyan)}.cover{width:100%;display:block;aspect-ratio:1.5;image-rendering:pixelated;border:0;padding:0;background:var(--surface-raised);position:relative;text-align:left;overflow:hidden}.cover canvas{width:100%;height:100%;display:block;image-rendering:pixelated}.cover-title{position:absolute;inset:20% 9% auto;font:700 24px var(--mono);line-height:1.1;color:var(--ink);text-shadow:2px 2px var(--bg),-1px -1px var(--bg)}.cover-title small{display:block;font:9px var(--mono);margin-top:8px;color:var(--gold)}.cover-badge{position:absolute;top:10px;left:10px;border:1px solid var(--line);background:var(--bg);padding:4px 7px;font:8px var(--mono);color:var(--muted)}.game-info{padding:15px 16px 13px}.game-title{font-size:14px;margin:0 0 9px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.game-meta{display:flex;align-items:center;justify-content:space-between;font:9px var(--mono);color:var(--muted)}.platform-text{color:var(--cyan)}.game-foot{margin-top:16px;display:flex;align-items:center;justify-content:space-between}.game-foot button{background:var(--surface-raised);border:1px solid var(--line);border-radius:4px;padding:7px 10px;font-size:11px;color:var(--muted)}.game-foot button.liked{color:var(--pink);border-color:var(--pink)}.game-foot .open-game{color:var(--ink);font-size:10px}.game-foot .open-game:hover{color:var(--cyan)}.count-foot{margin-top:25px;display:flex;align-items:center;justify-content:space-between;font:9px var(--mono);color:var(--muted)}.footer{border-top:1px solid var(--line);margin:0 48px;padding:22px 0 26px;display:flex;justify-content:space-between;font:9px var(--mono);color:var(--muted)}.footer strong{color:var(--pink)}.empty{grid-column:1/-1;padding:50px;text-align:center;color:var(--muted)}#tip{position:fixed;z-index:20;display:none;pointer-events:none;background:var(--surface);border:1px solid var(--cyan);padding:9px 12px;font:12px var(--mono);border-radius:4px}#tip small{display:block;font-size:9px;margin-top:5px;color:var(--muted)}dialog{padding:0;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:8px;width:min(470px,calc(100% - 32px));box-shadow:var(--shadow)}dialog::backdrop{background:color-mix(in srgb,var(--bg) 85%,transparent)}.modal-cover{height:200px;position:relative}.modal-cover canvas{width:100%;height:100%;image-rendering:pixelated}.modal-content{padding:27px}.modal-content h2{font-size:25px;margin:12px 0}.modal-content p{font-size:13px;color:var(--muted);line-height:1.7}.modal-actions{display:flex;gap:10px;margin-top:24px}.close-modal{position:absolute;right:12px;top:12px;background:var(--bg);border:1px solid var(--line);color:var(--ink);border-radius:4px;width:32px;height:32px;font-size:20px}.status{border-top:1px solid var(--line);padding-top:15px;color:var(--gold)!important}.mobile-name{display:none}.layout-note{display:none}.row-head{display:none}
/* 02: the city is the primary spatial browser; the catalog is a dock. */
body[data-variant="2"]{--bg:#080f19;--surface:#101c2b;--surface-raised:#17283c;--pink:#48ecdc;--cyan:#82bdff}.v2 .shell{max-width:none}.v2 .topbar{height:76px;padding:0 32px}.v2 .workspace{display:grid;grid-template-columns:minmax(0,1fr) 460px;min-height:calc(100vh - 76px)}.v2 .scene{height:100%;min-height:740px;border-right:1px solid var(--line);border-bottom:0}.v2 .scene:after{background:linear-gradient(180deg,var(--bg),transparent 45%)}.v2 .city-wrap{inset:120px 0 0}.v2 .scene-copy{left:32px;top:32px}.v2 .scene-copy h1{font-size:38px}.v2 .scene-copy p{display:none}.v2 .scene-copy .primary{display:none}.v2 .scene-label{top:30px}.v2 .districts{left:28px;bottom:25px;flex-wrap:wrap;max-width:70%}.v2 .catalog{padding:30px 24px;max-height:calc(100vh - 76px);overflow:auto;background:var(--bg)}.v2 .catalog-heading{align-items:flex-start}.v2 .catalog-heading h2{font-size:23px}.v2 .section-note{display:none}.v2 .tools{flex-wrap:wrap;gap:8px}.v2 .search{flex-basis:100%;max-width:none}.v2 .sort{margin-left:auto}.v2 .game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.v2 .cover-title{font-size:18px}.v2 .game-info{padding:12px}.v2 .game-title{font-size:12px}.v2 .game-foot{margin-top:12px}.v2 .footer{display:none}
/* 03: sunset catalog, with the city expanded only on demand. */
body[data-variant="3"]{--bg:#31204f;--surface:#543773;--surface-raised:#69478a;--muted:#d5bfe9;--line:#ebcaff28;--pink:#ff5bad;--sky:linear-gradient(#44245d,#a14e95,#f4aa84)}.v3 .topbar{background:transparent}.v3 .scene{height:210px;background:var(--sky)}.v3 .scene:after{background:linear-gradient(90deg,var(--bg),transparent 75%)}.v3 .scene-copy{top:34px}.v3 .scene-copy h1{font-size:38px}.v3 .scene-copy p,.v3 .scene-copy .primary{display:none}.v3 .city-wrap{inset:-20px 0 -60px 45%}.v3 .districts{bottom:20px}.v3 .catalog{padding-top:30px}.v3 .game-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.v3 .cover{aspect-ratio:.83}.v3 .cover-title{top:18%;font-size:28px}.v3 .game{background:color-mix(in srgb,var(--surface) 90%,transparent)}.v3 .game-info{padding:18px}.v3 .game-foot{margin-top:20px}.v3 .footer{margin-top:5px}
/* 04: arcade machine composition with a marquee and horizontal cartridges. */
body[data-variant="4"]{--bg:#151316;--surface:#222025;--surface-raised:#302a32;--pink:#ff6176;--cyan:#ffc461;--gold:#caff72;--muted:#a9a4aa;--sky:linear-gradient(#1a1420,#4d283b)}.v4 .topbar{border-bottom:3px solid var(--pink)}.v4 .brand{font-size:26px}.v4 .scene{height:260px;margin:28px 48px 0;border:1px solid var(--line)}.v4 .scene-copy{left:28px;top:30px}.v4 .scene-copy h1{font:700 40px var(--mono)}.v4 .scene-copy p{display:none}.v4 .scene-copy .primary{padding:9px 14px}.v4 .city-wrap{inset:-80px -20px -80px 38%}.v4 .districts{left:28px;bottom:16px}.v4 .game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.v4 .game{display:grid;grid-template-columns:160px minmax(0,1fr);border-radius:4px}.v4 .cover{aspect-ratio:1;height:100%}.v4 .cover-title{font-size:17px}.v4 .cover-badge{display:none}.v4 .game-info{padding:22px 20px}.v4 .game-title{font-size:16px}.v4 .game-foot{margin-top:30px}.v4 .catalog-heading h2{font:700 22px var(--mono)}
/* 05: a green phosphor console, city viewport and dense library. */
body[data-variant="5"]{--bg:#0b1511;--surface:#101f18;--surface-raised:#172d20;--ink:#d6edce;--muted:#7b9c80;--pink:#b9ed8d;--cyan:#b9ed8d;--gold:#edd68e;--green:#b9ed8d;--line:#9abd8d24;--font:'IBM Plex Mono',monospace;--sky:linear-gradient(#0b1511,#153221)}.v5 .topbar{height:80px}.v5 .brand{font-size:20px}.v5 .workspace{display:grid;grid-template-columns:42% minmax(0,1fr);min-height:760px}.v5 .scene{height:100%;border-right:1px solid var(--line)}.v5 .scene:after{background:linear-gradient(180deg,var(--bg),transparent 50%)}.v5 .scene-copy{left:30px;top:32px}.v5 .scene-copy h1{font-size:29px}.v5 .scene-copy p{font-size:11px}.v5 .scene-copy .primary{display:none}.v5 .city-wrap{inset:130px -80px 30px;filter:grayscale(1) sepia(.5) hue-rotate(40deg)}.v5 .districts{left:25px;bottom:22px;flex-wrap:wrap;max-width:75%}.v5 .catalog{padding:32px 28px}.v5 .catalog-heading h2{font-size:20px}.v5 .section-note{display:none}.v5 .tools{flex-wrap:wrap}.v5 .search{max-width:none;flex-basis:100%}.v5 .game-grid{display:block}.v5 .game{display:grid;grid-template-columns:58px minmax(0,1fr);border-radius:0;border:0;border-bottom:1px solid var(--line);background:none;padding:12px 0;gap:16px}.v5 .game:hover{transform:none;background:var(--surface)}.v5 .cover{aspect-ratio:1;align-self:center;border-radius:2px}.v5 .cover-title,.v5 .cover-badge{display:none}.v5 .game-info{padding:0;position:relative;padding-right:90px}.v5 .game-title{font-size:12px;padding-top:8px}.v5 .game-meta{font-size:9px;justify-content:flex-start;gap:18px;padding-bottom:5px}.v5 .game-foot{position:absolute;right:0;top:10px;margin:0;gap:6px}.v5 .game-foot button{padding:7px;font-size:9px}.v5 .footer{margin:0 28px}.v5 .row-head{display:block;font:9px var(--mono);color:var(--muted);padding:10px 0;border-block:1px solid var(--line);margin-bottom:5px}
@media(min-width:1500px){.v1 .scene{height:460px}.v1 .city-wrap{inset:0 0 0 35%}}
@media(max-width:1000px){.topbar{padding:0 25px;gap:25px}.nav{gap:16px}.online{display:none}.scene-copy{left:25px}.districts{left:25px}.catalog{padding:28px 25px}.footer{margin:0 25px}.game-grid{gap:12px}.cover-title{font-size:19px}.v2 .workspace{grid-template-columns:minmax(0,1fr) 380px}.v2 .scene-copy h1{font-size:27px}.v4 .scene{margin:22px 25px 0}.v4 .game{grid-template-columns:120px minmax(0,1fr)}.v4 .game-title{font-size:13px}.v4 .game-info{padding:16px 12px}.v4 .game-foot{margin-top:20px}.v5 .workspace{grid-template-columns:36% minmax(0,1fr)}.v5 .scene-copy{left:20px}.v5 .scene-copy h1{font-size:23px}.v5 .catalog{padding:25px 20px}}
@media(max-width:680px){.topbar,.v2 .topbar,.v5 .topbar{height:74px;padding:0 18px;gap:12px}.brand,.v4 .brand{font-size:18px}.brand small{font-size:7px}.brand-icon{font-size:17px;margin-right:4px}.nav{display:none}.header-end{gap:8px}.header-end .primary{font-size:9px;padding:10px}.icon-button{width:31px;height:31px}.scene,.v1 .scene{height:375px}.scene-copy{left:20px;top:28px}.scene-copy h1{font-size:33px}.scene-copy p{font-size:11px;max-width:205px}.scene-copy .primary{font-size:10px;padding:10px 15px}.city-wrap{inset:125px -95px 0 -35px}.scene:after{background:linear-gradient(180deg,var(--bg) 0%,transparent 85%)}.scene-label{right:18px;top:22px;font-size:7px}.districts{left:18px;bottom:17px;gap:5px;max-width:calc(100% - 65px);flex-wrap:wrap}.districts button{font-size:8px;padding:7px 9px}.zoom{right:15px;bottom:17px;flex-direction:column}.zoom button{width:27px;height:27px}.catalog,.v2 .catalog,.v5 .catalog{padding:25px 18px}.catalog-heading{margin-bottom:18px}.catalog-heading h2{font-size:21px}.catalog-heading h2 span{font-size:8px;margin-left:7px}.section-note{display:none}.tools{gap:8px;flex-wrap:wrap;margin-bottom:20px}.search{max-width:none;flex-basis:100%}.search input{height:40px}.tools select{height:35px;font-size:10px;max-width:150px}.sort{margin-left:auto}.sort button{height:35px;padding:0 9px;font-size:9px}.game-grid,.v3 .game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.cover-title{font-size:16px;inset:24% 9% auto}.cover-title small{font-size:6px}.cover-badge{font-size:6px;padding:3px 5px;top:7px;left:7px}.game-info{padding:12px 10px}.game-title{font-size:11px}.game-meta{font-size:7px}.game-foot{margin-top:13px}.game-foot button{font-size:9px;padding:6px 7px}.game-foot .open-game{font-size:8px}.count-foot{font-size:7px}.footer,.v5 .footer{margin:0 18px;gap:15px;font-size:7px;line-height:1.8}.v2 .workspace,.v5 .workspace{display:block;min-height:0}.v2 .scene{min-height:0;height:360px;border-right:0;border-bottom:1px solid var(--line)}.v2 .city-wrap{inset:70px -30px 0}.v2 .scene-copy{top:25px;left:18px}.v2 .scene-copy h1{font-size:26px}.v2 .scene-label{top:25px}.v2 .catalog{max-height:none;overflow:visible}.v2 .districts{left:18px;bottom:18px;max-width:75%}.v2 .game-info{padding:12px 10px}.v3 .scene{height:220px}.v3 .scene-copy{top:25px;left:18px}.v3 .scene-copy h1{font-size:29px}.v3 .city-wrap{inset:25px -65px -50px 25%}.v3 .cover-title{font-size:22px}.v3 .game-info{padding:14px 10px}.v3 .game-foot{margin-top:18px}.v4 .scene{height:250px;margin:18px 18px 0}.v4 .scene-copy{top:25px;left:17px}.v4 .scene-copy h1{font-size:27px}.v4 .city-wrap{inset:10px -80px -50px 25%}.v4 .districts{left:15px;bottom:13px}.v4 .game-grid{grid-template-columns:1fr;gap:12px}.v4 .game{grid-template-columns:115px minmax(0,1fr)}.v4 .game-info{padding:17px 14px}.v4 .game-title{font-size:13px}.v4 .game-foot{margin-top:23px}.v4 .catalog-heading h2{font-size:19px}.v5 .scene{height:330px;border-right:0}.v5 .scene-copy{top:25px;left:18px}.v5 .scene-copy h1{font-size:26px}.v5 .scene-copy p{display:none}.v5 .city-wrap{inset:60px -50px 20px}.v5 .districts{left:18px}.v5 .game{gap:11px;grid-template-columns:45px minmax(0,1fr)}.v5 .game-info{padding-right:77px}.v5 .game-title{font-size:10px}.v5 .game-meta{font-size:7px;gap:12px}.v5 .game-foot button{font-size:8px;padding:6px}.v5 .catalog-heading h2{font-size:18px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.catalog-heading h2 #heading{font:inherit;color:var(--ink);margin:0}
:root{--art-night:#171b42;--art-mountain:#483566;--art-forest:#173f46;--art-water:#218eab;--art-sky:#529bb9;--art-pink:#e5659a;--art-grass:#77ba80;--city-0:#0e0f33;--city-1:#151b38;--city-2:#141a45;--city-3:#161c38;--city-4:#19203c;--city-5:#181f3e;--city-6:#1b223d;--city-7:#212849;--city-8:#232a4e;--city-9:#293256;--city-10:#303f6f;--city-11:#343d65;--city-12:#39436a;--city-13:#424b75;--city-14:#49507f;--city-15:#4d5a88;--city-16:#5b65a0;--city-17:#552;--city-18:#5a64a8;--city-19:#5df2c9;--city-20:#7682c2;--city-21:#7dffa2;--city-22:#8f9bd8;--city-23:#8fd6ff;--city-24:#9df2ff;--city-25:#aab4e8;--city-26:#c9a2ff;--city-27:#c9ff5d;--city-28:#d9d2b4;--city-29:#f2ecd4;--city-30:#ff5d5d;--city-31:#ff5d5d33;--city-32:#ff5da2;--city-33:#ff9d5c;--city-34:#ff9db0;--city-35:#ffd23f;--city-36:#ffd9e9;--city-37:#fff;--city-38:#fff6d8;}
:root{--hud:color-mix(in srgb,var(--surface) 88%,transparent);--hud-border:color-mix(in srgb,var(--cyan) 22%,transparent);--hud-shadow:0 12px 35px color-mix(in srgb,var(--bg) 70%,transparent)}
body{height:100dvh;overflow:hidden}.city-full{position:fixed;inset:0;width:100%;height:100%;touch-action:none;cursor:grab}.city-full.drag{cursor:grabbing}.hub-header{position:fixed;top:24px;left:28px;right:28px;z-index:3;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center}.brand{min-width:0;font-size:25px;text-shadow:var(--shadow)}.hub-actions{display:flex;align-items:center;gap:9px}.hub-actions button{font-size:11px;background:var(--hud);backdrop-filter:blur(16px);border:1px solid var(--hud-border)}.hub-actions .primary{background:var(--gold)}.demo-chip{font:9px var(--mono);color:var(--muted);margin-right:12px}.ticker{position:fixed;left:28px;right:28px;top:91px;height:36px;z-index:3;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:18px;padding:0 13px;border:1px solid var(--hud-border);background:var(--hud);backdrop-filter:blur(16px);border-radius:4px;font-size:11px}.ticker-label{font:9px var(--mono);color:var(--pink)}.ticker-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;border:0;background:none;font-size:11px;padding:6px 0}.ticker-next{border:0;background:none;color:var(--cyan);font-size:17px}.city-title{position:fixed;top:164px;left:34px;z-index:2;pointer-events:none}.city-title .eyebrow{font-size:9px;margin-bottom:10px}.city-title h1{font-size:39px;font-weight:500;margin:0;line-height:1.15}.city-title h1 span{color:var(--pink)}.city-title p{color:var(--muted);font:10px var(--mono);margin-top:15px}.hud-stack{position:fixed;right:28px;top:160px;width:215px;z-index:3;display:grid;gap:10px}.hud-tile{background:var(--hud);border:1px solid var(--hud-border);border-radius:6px;box-shadow:var(--hud-shadow);backdrop-filter:blur(14px);padding:15px;display:block;width:100%;text-align:left}.hud-tile:hover{border-color:var(--cyan)}.tile-top{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;font:9px var(--mono);color:var(--muted);margin-bottom:11px}.tile-top span:first-child{min-width:0}.tile-top b{color:var(--cyan);font-weight:500;flex-shrink:0}.tile-title{display:block;font-size:16px;margin-bottom:8px}.tile-meta{font:9px var(--mono);color:var(--muted);display:block;line-height:1.7}.daily-art{height:85px;position:relative;border-radius:3px;overflow:hidden;margin-bottom:13px}.daily-art canvas{width:100%;height:100%;image-rendering:pixelated}.daily-art span{position:absolute;bottom:12px;left:10px;font:700 17px var(--mono);text-shadow:2px 2px var(--bg)}.tile-top .gold{color:var(--gold)}.player-mini{display:grid;grid-template-columns:25px minmax(0,1fr);gap:9px;align-items:center;margin-top:9px}.avatar{width:25px;height:25px;background:var(--surface-raised);border:1px solid var(--line);display:grid;place-items:center;color:var(--pink);font:10px var(--mono);border-radius:4px;flex-shrink:0}.player-mini strong{display:block;font-size:10px;font-weight:500}.player-mini small{display:block;color:var(--muted);font-size:8px;margin-top:3px}.mini-content{min-width:0}.mini-content strong,.mini-content small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.live-dot{color:var(--green)}.dock{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);z-index:3;background:var(--hud);backdrop-filter:blur(16px);border:1px solid var(--hud-border);border-radius:7px;padding:6px;display:flex;gap:5px}.dock button{border:0;background:transparent;color:var(--muted);padding:11px 16px;display:flex;align-items:center;gap:9px;font-size:11px;border-radius:4px}.dock button:hover{background:var(--surface-raised);color:var(--ink)}.dock .dock-catalog{background:var(--pink);color:var(--bg);font-weight:600}.dock-icon{font-size:17px}.zoom{position:fixed;left:28px;bottom:29px;right:auto;z-index:3}.zoom button{background:var(--hud)}.coordinates{position:fixed;bottom:31px;right:28px;color:var(--muted);font:8px var(--mono);text-align:right;line-height:1.9;pointer-events:none}.catalog-window{width:min(920px,calc(100% - 48px));max-height:84dvh;overflow:auto}.window-header{position:sticky;top:0;z-index:4;background:var(--surface);padding:19px 25px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}.window-header h2{margin:0;font-size:18px;font-weight:500;min-width:0}.window-header button{width:30px;height:30px;font-size:19px;border:1px solid var(--line);background:var(--surface-raised);border-radius:4px}.catalog{padding:24px;max-height:none;overflow:visible}.game-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.catalog-heading h2{font-size:20px}.hub-window{width:min(560px,calc(100% - 32px));max-height:82dvh;overflow:auto}.window-body{padding:24px}.demo-label{font:9px var(--mono);color:var(--gold);margin-bottom:20px;display:block}.ranking{width:100%;border-collapse:collapse;font-size:12px}.ranking th{text-align:left;font:9px var(--mono);color:var(--muted);padding:10px 6px;border-bottom:1px solid var(--line)}.ranking td{padding:15px 6px;border-bottom:1px solid var(--line)}.ranking td:last-child{color:var(--gold);text-align:right;font-family:var(--mono)}.ranking th:last-child{text-align:right}.ranking td:first-child{color:var(--cyan);width:40px}.ranking-filter{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;margin-bottom:15px}.ranking-filter select{max-width:none;width:100%}.tournament{padding:18px 0;border-bottom:1px solid var(--line)}.tournament:first-of-type{padding-top:0}.tournament h3{font-size:19px;margin:10px 0}.tournament p{font-size:11px;color:var(--muted);line-height:1.8}.tournament .eyebrow{margin:0;color:var(--gold)}.tournament button{margin-top:7px}.joined-message{color:var(--green)!important}.player-row{display:grid;grid-template-columns:35px minmax(0,1fr) auto;gap:13px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}.player-row .avatar{width:35px;height:35px}.player-row strong{font-size:12px;display:block}.player-row small{font-size:10px;color:var(--muted);display:block;margin-top:5px}.player-row button{padding:8px 10px;font-size:10px}.announcement-row{padding:16px 0;border-bottom:1px solid var(--line)}.announcement-row h3{font-size:15px;margin:0 0 8px}.announcement-row p{font-size:12px;color:var(--muted);line-height:1.8;margin:0}dialog::backdrop{background:color-mix(in srgb,var(--bg) 48%,transparent);backdrop-filter:blur(5px)}#tip{z-index:4}.modal-actions{flex-wrap:wrap}
@media(max-width:950px){.hud-stack{width:185px;right:20px}.hub-header{left:20px;right:20px}.hub-actions .outlined{padding:10px}.demo-chip{display:none}.city-title{left:25px}.city-title h1{font-size:31px}.dock button{padding:11px 12px}.coordinates{display:none}}
@media(max-width:680px){.hub-header{top:17px;left:16px;right:16px;gap:8px}.brand{font-size:20px}.brand small{font-size:7px}.hub-actions{gap:6px}.hub-actions .outlined{width:33px;height:33px;padding:0;font-size:15px}.hub-actions .outlined .desktop-label{display:none}.hub-actions .primary{font-size:9px;padding:10px}.ticker{top:75px;left:16px;right:16px;height:33px;gap:9px;padding:0 9px}.ticker-label{font-size:8px}.ticker-text{font-size:9px}.city-title{left:19px;top:132px}.city-title h1{font-size:27px}.city-title .eyebrow{font-size:8px}.city-title p{display:none}.hud-stack{top:auto;left:16px;right:16px;bottom:85px;width:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.hud-tile{padding:10px 7px;min-width:0;height:65px}.tile-top{margin-bottom:7px;font-size:7px;gap:3px}.tile-top b{font-size:10px}.tile-title{font-size:10px;line-height:1.4;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tile-meta,.daily-art,.player-mini{display:none}.hud-tile.players-tile .tile-title{color:var(--green)}.dock{bottom:19px;width:calc(100% - 32px);justify-content:space-between;padding:5px;gap:3px}.dock button{padding:9px 7px;font-size:9px;gap:5px;flex:1;justify-content:center}.dock-icon{font-size:14px}.zoom{left:auto;right:16px;bottom:166px;flex-direction:column;gap:5px}.zoom button{width:29px;height:29px}.catalog-window{width:calc(100% - 20px);max-height:86dvh}.catalog{padding:18px 12px}.game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.catalog-heading h2{font-size:17px}.window-header{padding:14px 17px}.window-header h2{font-size:16px}.window-body{padding:20px 17px}.ranking{font-size:11px}.ranking-filter{grid-template-columns:minmax(0,1fr) auto}.player-row{grid-template-columns:30px minmax(0,1fr) auto;gap:10px}.player-row button{font-size:9px;padding:7px}.player-row strong{font-size:11px}.player-row small{font-size:9px}.scene-copy{display:none}}
@media(max-height:650px) and (min-width:681px){.hud-stack{top:140px;grid-template-columns:repeat(2,160px);width:330px;gap:8px}.daily-art{display:none}.hud-tile{padding:11px}.player-mini{display:none}.city-title{top:148px}.city-title h1{font-size:29px}}
.filters{display:grid;gap:10px;margin:-10px 0 22px}.filter-row{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.filter-row>span{font:9px var(--mono);color:var(--muted);width:92px;flex-shrink:0}.chip{height:28px;padding:0 10px;font:10px var(--mono);color:var(--muted);border:1px solid var(--line);background:transparent;border-radius:4px}.chip.active{color:var(--bg);background:var(--cyan);border-color:var(--cyan)}.chip:disabled{opacity:.3;cursor:default}.letters .chip{min-width:28px;padding:0 6px}.pop-meter{color:var(--gold);font:9px var(--mono);letter-spacing:1px}.profile-head{display:grid;grid-template-columns:60px minmax(0,1fr);gap:16px;align-items:center;margin-bottom:20px}.profile-head .avatar{width:60px;height:60px;font-size:20px}.profile-head h3{margin:0 0 6px;font-size:20px}.profile-head small{color:var(--muted);font:10px var(--mono)}.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:20px}.stat{border:1px solid var(--line);border-radius:5px;padding:12px;background:var(--surface-raised)}.stat b{display:block;font-size:22px;color:var(--gold);font-weight:500}.stat small{font:9px var(--mono);color:var(--muted)}.badges{display:flex;gap:6px;flex-wrap:wrap}.badges span{font:9px var(--mono);border:1px solid var(--line);padding:6px 8px;border-radius:4px}.build-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}.build-row strong{display:block;font-size:13px}.build-row small{display:block;color:var(--muted);font:9px var(--mono);margin-top:5px}.build-row button{padding:8px 11px;font-size:10px}.build-note{font:10px var(--mono);color:var(--muted);line-height:1.8;margin-top:18px}.build-note code{color:var(--cyan)}@media(max-width:680px){.filter-row>span{width:100%}.stats{grid-template-columns:repeat(3,minmax(0,1fr))}.hub-actions .grow-btn .desktop-label{display:none}}
.hub-actions .hub-online{display:inline-flex;align-items:center;gap:5px;color:var(--green);padding:10px 12px;border-radius:4px;white-space:nowrap}.hub-online:before{margin-right:2px}.hub-online small{font:8px var(--mono);color:var(--muted)}@media(max-width:680px){.hub-actions .hub-online{font-size:9px;padding:9px 7px;gap:3px}.hub-online small{display:none}.dock button{flex-direction:column;gap:4px;font-size:8px;padding:7px 3px}.dock{gap:0}}
:root{--bg:oklch(.245 .045 300);--surface:oklch(.30 .05 300);--surface-raised:oklch(.355 .055 300);--muted:oklch(.76 .035 300);--line:oklch(.85 .03 300 / .16)}
.dock .dock-link{color:var(--muted);padding:11px 16px;display:flex;align-items:center;gap:9px;font-size:11px;border-radius:4px;text-decoration:none}.dock .dock-link:hover{background:var(--surface-raised);color:var(--ink)}
.dock .dock-catalog{background:var(--pink);color:var(--bg);font-weight:600}.dock .dock-duo{background:linear-gradient(90deg,#ff4fa3,#4fd1ff);color:#140a26;font-weight:700;font-size:13px;padding:13px 22px;transform:translateY(-6px) scale(1.08);border-radius:8px}.dock .dock-duo:hover{transform:translateY(-9px) scale(1.12);color:#140a26}
.hub-cat,.sfx-btn{text-decoration:none;color:inherit;display:inline-flex;align-items:center;gap:6px}
@media(max-width:760px){.dock .dock-link{padding:9px 7px;font-size:9px;gap:5px;flex:1;justify-content:center;min-width:0}.dock .dock-duo{font-size:10px}}
@keyframes gcIn{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
@keyframes gcPop{0%{transform:scale(.9);opacity:0}70%{transform:scale(1.03)}100%{transform:scale(1);opacity:1}}
@keyframes gcGlow{0%,100%{box-shadow:0 0 0 0 rgba(255,79,163,.55),0 0 22px rgba(255,79,163,.45)}50%{box-shadow:0 0 0 7px rgba(255,79,163,0),0 0 38px rgba(79,209,255,.6)}}
@keyframes gcShine{from{background-position:-200% 0}to{background-position:200% 0}}
button,a,.card{transition:transform .18s cubic-bezier(.3,1.6,.5,1),background .2s,color .2s,box-shadow .2s}
button:hover,.card:hover{transform:translateY(-2px)}button:active,.card:active{transform:translateY(1px) scale(.97)}
dialog[open]{animation:gcPop .32s cubic-bezier(.2,1.4,.4,1)}
.duo-btn{animation:gcGlow 2.2s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* =====================================================================
   ПРИЛОЖЕНИЕ v15 — общие компоненты сайта (терминал, тосты, ачивки,
   баг-диалог, обложки, live-кнопки, чип профиля), приведённые к
   палитре Аркада-Сити. Подключается после CSS дизайна.
   ===================================================================== */

/* гвард hidden: у диалогов/плит display перебивает атрибут */
[hidden]{display:none!important}

/* обёртка страницы: app.js прячет её при запуске терминала */
.os{display:contents}

/* псевдонимы переменных для общих блоков (терминал/баг/тосты) */
:root{
  --red:#ff6a9e;
  --cy:var(--cyan);
  --am:var(--gold);
  --gr:var(--green);
  --stroke:var(--line);
  --dim:var(--muted);
  --ink2:var(--ink);
  --line-soft:var(--line);
  --panel:var(--surface);
  --px:'Share Tech Mono',monospace;
  --vh:'Space Grotesk',Arial,sans-serif;
}

/* ---------- кнопки общих блоков ---------- */
.btnplay{
  background:var(--gold);color:var(--bg);border:0;border-radius:6px;
  font-weight:700;font-size:12px;letter-spacing:.08em;
  padding:11px 18px;cursor:pointer;
  box-shadow:0 4px 18px color-mix(in srgb,var(--gold) 35%,transparent);
}
.btnplay:hover{filter:brightness(1.08)}
.btnplay--sm{padding:9px 14px;font-size:11px}
.btnghost{
  background:transparent;border:1px solid var(--line);color:var(--muted);
  border-radius:6px;font-weight:600;font-size:11px;padding:9px 14px;cursor:pointer;
}
.btnghost:hover{color:var(--ink);border-color:var(--cyan)}

/* =====================================================================
   RETRO TERMINAL (экран загрузки игры) — зелёный CRT
   ===================================================================== */
.ret-02,
.ret-02 *,
.ret-02 *::before,
.ret-02 *::after{box-sizing:border-box;margin:0;padding:0}
.ret-02 ::selection{background:#00ff9c;color:#02110a}
.ret-02 ::-moz-selection{background:#00ff9c;color:#02110a}
.ret-02{
  --bg:#030806;--green:#27ff9c;--dim:#13895a;--amber:#ffb000;--cyan:#21e6ff;
  --scan:rgba(0,0,0,.28);
  font-family:'Share Tech Mono',monospace;
  background:radial-gradient(120% 120% at 50% 0%,#06170f,#020604 70%);
  color:var(--green);
  min-height:100vh;position:fixed;inset:0;z-index:100;overflow:hidden;
  padding:clamp(14px,3vw,40px);
}
.ret-02__crt{
  position:relative;height:calc(100vh - clamp(28px,6vw,80px));
  border-radius:26px;padding:clamp(16px,3vw,38px);
  background:linear-gradient(180deg,rgba(39,255,156,.04),transparent),var(--bg);
  box-shadow:inset 0 0 120px rgba(39,255,156,.12),inset 0 0 30px rgba(0,0,0,.9),
    0 0 0 3px #0b1f16,0 0 0 9px #050d09,0 30px 80px rgba(0,0,0,.8);
  overflow:hidden;
}
.ret-02__crt::before{
  content:'';position:absolute;inset:0;pointer-events:none;z-index:8;
  background:repeating-linear-gradient(0deg,transparent 0 2px,var(--scan) 2px 4px);
  mix-blend-mode:multiply;animation:ret-02-roll 8s linear infinite;
}
@keyframes ret-02-roll{to{background-position:0 200px}}
.ret-02__crt::after{
  content:'';position:absolute;inset:0;pointer-events:none;z-index:9;border-radius:26px;
  background:radial-gradient(120% 120% at 50% 50%,transparent 55%,rgba(0,0,0,.55) 100%);
  box-shadow:inset 0 0 90px rgba(0,0,0,.7);
}
.ret-02__glow{
  position:absolute;inset:0;z-index:7;pointer-events:none;
  animation:ret-02-flick 5s infinite;mix-blend-mode:screen;
  background:linear-gradient(180deg,rgba(39,255,156,.03),transparent);
}
@keyframes ret-02-flick{0%,96%,100%{opacity:1}97%{opacity:.72}98%{opacity:.94}}
.ret-02__scr{
  position:relative;z-index:6;height:100%;overflow-y:auto;
  font-size:clamp(13px,1.6vw,16px);line-height:1.7;
  text-shadow:0 0 6px rgba(39,255,156,.6);
}
.ret-02__head{
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;
  border-bottom:1px dashed var(--dim);padding-bottom:10px;margin-bottom:14px;color:var(--dim);
}
.ret-02__head b{font-family:'Orbitron',sans-serif;color:var(--green);letter-spacing:.2em;font-weight:900;font-size:1.1em}
.ret-02__l{display:block;white-space:pre-wrap;word-break:break-word;opacity:0;transform:translateY(2px);animation:ret-02-type .01s forwards}
.ret-02__l:nth-child(1){animation-delay:.1s}
.ret-02__l:nth-child(2){animation-delay:.35s}
.ret-02__l:nth-child(3){animation-delay:.6s}
.ret-02__l:nth-child(4){animation-delay:.85s}
.ret-02__l:nth-child(5){animation-delay:1.15s}
.ret-02__l:nth-child(6){animation-delay:1.5s}
.ret-02__l:nth-child(7){animation-delay:1.8s}
.ret-02__l:nth-child(8){animation-delay:2.1s}
.ret-02__l:nth-child(9){animation-delay:2.45s}
.ret-02__l:nth-child(10){animation-delay:2.8s}
.ret-02__l:nth-child(11){animation-delay:3.1s}
@keyframes ret-02-type{to{opacity:1;transform:none}}
.ret-02 .amb{color:var(--amber);text-shadow:0 0 6px rgba(255,176,0,.6)}
.ret-02 .cy{color:var(--cyan);text-shadow:0 0 6px rgba(33,230,255,.6)}
.ret-02 .dim{color:var(--dim);text-shadow:none}
.ret-02__ok{color:#02110a;background:var(--green);padding:0 6px;border-radius:3px}
.ret-02__bar{display:inline-block;color:var(--green)}
.ret-02__ascii{color:var(--dim);font-size:clamp(8px,1.2vw,12px);line-height:1.15;white-space:pre;margin:6px 0 10px}
.ret-02__prompt{display:flex;align-items:center;gap:8px;margin-top:14px;border-top:1px dashed var(--dim);padding-top:12px}
.ret-02__prompt b{color:var(--amber)}
.ret-02__cursor{width:10px;height:1.1em;background:var(--green);box-shadow:0 0 8px var(--green);animation:ret-02-blink 1s steps(2) infinite}
@keyframes ret-02-blink{50%{opacity:0}}

/* =====================================================================
   МОДАЛКИ СЕКРЕТОВ / РЕКОРДОВ (.overlay)
   ===================================================================== */
.overlay{
  position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;
  background:rgba(7,7,26,.66);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);padding:16px;
}
.overlay.open{display:flex}
.overlay .modal{
  width:min(480px,100%);max-height:min(78vh,640px);overflow:auto;
  background:var(--surface);border:1px solid var(--line);border-radius:14px;
  box-shadow:var(--shadow);padding:18px 20px;
}
.modal__head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.modal__title{font-family:var(--px);font-size:12px;color:#fff;letter-spacing:.14em;text-shadow:0 0 12px rgba(255,77,166,.55)}
.modal__x{background:none;border:0;color:var(--muted);font-size:1.5rem;line-height:1;cursor:pointer}
.modal__x:hover{color:var(--pink)}
.modal__game{font-family:var(--mono);font-size:13px;color:var(--cyan);margin-bottom:12px}
.modal__note{font-size:.78rem;color:var(--muted);margin-top:10px;line-height:1.5}
.cheat{
  border:1px dashed var(--line);border-radius:10px;padding:10px 12px;margin-bottom:8px;
  font-size:.9rem;line-height:1.5;background:rgba(255,255,255,.04);
}
.cheat b{color:var(--gold)}
.rec-row{display:flex;align-items:center;gap:12px;padding:8px 12px;border-radius:10px;background:rgba(255,255,255,.05);margin-bottom:6px;font-size:.92rem}
.rec-row--top{background:linear-gradient(120deg,rgba(255,209,102,.16),rgba(255,77,166,.08));border:1px solid rgba(255,209,102,.35)}
.rec-row__rank{min-width:34px;text-align:center;font-weight:700}
.rec-row__name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.rec-row__time{color:var(--cyan);font-family:var(--mono);font-size:.85rem}

/* =====================================================================
   ТОСТЫ + АЧИВКИ (низ-лево: низ-право занят зумом/координатами)
   ===================================================================== */
.toasts{
  position:fixed;left:28px;bottom:28px;z-index:300;display:flex;flex-direction:column;gap:10px;
  pointer-events:none;max-width:min(340px,calc(100vw - 56px));
}
.toast{
  background:color-mix(in srgb,var(--surface) 94%,transparent);
  border:1px solid var(--line);border-left:3px solid var(--cyan);border-radius:10px;
  padding:11px 14px;font-size:.9rem;font-weight:600;max-width:320px;
  box-shadow:var(--shadow);animation:tin .25s ease;pointer-events:auto;
}
.toast.out{opacity:0;transform:translateX(-20px);transition:.3s}
@keyframes tin{from{opacity:0;transform:translateX(-16px)}}
.ach{
  display:flex;align-items:center;gap:12px;
  border:1px solid rgba(255,209,102,.5);border-radius:14px;
  background:linear-gradient(120deg,rgba(34,24,6,.96),rgba(18,12,34,.96));
  box-shadow:0 0 26px rgba(255,209,102,.25),0 14px 34px rgba(0,0,0,.55);
  padding:11px 15px;animation:achin .45s cubic-bezier(.2,.9,.3,1.3);pointer-events:auto;
}
@keyframes achin{from{opacity:0;transform:translateX(-40px) scale(.9)}}
.ach.out{transition:opacity .3s,transform .3s;opacity:0;transform:translateX(-24px)}
.ach__icon{font-size:1.5rem;filter:drop-shadow(0 0 10px rgba(255,209,102,.8));flex:none}
.ach__body{display:flex;flex-direction:column;gap:2px;min-width:0}
.ach__label{font-family:var(--px);font-size:.6rem;text-transform:uppercase;letter-spacing:.3em;color:var(--gold);opacity:.85}
.ach__title{font-family:'Orbitron',sans-serif;font-size:.8rem;font-weight:700;letter-spacing:.08em;color:#fff;text-shadow:0 0 10px rgba(255,209,102,.5)}
.ach__desc{font-size:.78rem;color:var(--muted)}

/* =====================================================================
   БАГ-ДИАЛОГ
   ===================================================================== */
.bugd{
  border:1px solid rgba(255,106,158,.35);border-radius:16px;
  background:rgba(12,12,34,.97);color:var(--ink);padding:0;
  width:min(480px,calc(100vw - 28px));
  box-shadow:0 0 44px rgba(255,106,158,.18),0 30px 70px rgba(0,0,0,.7);
}
dialog.bugd::backdrop{background:rgba(5,5,18,.7);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.bugd__form{padding:18px;display:flex;flex-direction:column;gap:13px}
.bugd__head{display:flex;align-items:center;justify-content:space-between}
.bugd__title{font-family:'Orbitron',sans-serif;font-size:.8rem;font-weight:700;letter-spacing:.2em;color:var(--red);text-shadow:0 0 12px rgba(255,106,158,.6)}
.bugd__x{background:none;border:1px solid var(--line);color:var(--muted);width:32px;height:32px;border-radius:9px;font-size:1rem;cursor:pointer}
.bugd__x:hover{color:var(--red);border-color:rgba(255,106,158,.5)}
.bugd__sevs{display:flex;gap:7px}
.bugd__sevs label{flex:1;cursor:pointer}
.bugd__sevs input{display:none}
.bugd__sevs span{
  display:block;text-align:center;font-size:.74rem;font-weight:700;padding:9px 4px;
  border-radius:9px;border:1px solid var(--line);background:rgba(255,255,255,.03);
  transition:border-color .15s,background .15s,box-shadow .15s;
}
.bugd__sevs label:nth-child(1) input:checked + span{border-color:var(--cyan);background:rgba(70,223,235,.12);box-shadow:0 0 12px rgba(70,223,235,.3)}
.bugd__sevs label:nth-child(2) input:checked + span{border-color:var(--gold);background:rgba(255,209,102,.12);box-shadow:0 0 12px rgba(255,209,102,.3)}
.bugd__sevs label:nth-child(3) input:checked + span{border-color:var(--red);background:rgba(255,106,158,.12);box-shadow:0 0 12px rgba(255,106,158,.3)}
.bugd__text,.bugd__nick{
  width:100%;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:11px;
  color:var(--ink);font-family:var(--font);font-size:.95rem;font-weight:600;
  padding:11px 13px;resize:vertical;outline:none;
}
.bugd__text:focus,.bugd__nick:focus{border-color:rgba(255,106,158,.55);box-shadow:0 0 12px rgba(255,106,158,.15)}
.bugd__hint{color:var(--muted);font-size:.76rem;line-height:1.5}
.bugd__actions{display:flex;justify-content:flex-end;gap:9px}
.bugd__result{border-radius:10px;padding:10px 13px;font-size:.85rem;background:rgba(168,231,157,.08);border:1px solid rgba(168,231,157,.35);color:var(--green)}
.bugd__result--err{background:rgba(255,106,158,.08);border-color:rgba(255,106,158,.4);color:var(--red)}

/* =====================================================================
   ОБЛОЖКИ РЕАЛЬНЫХ ИГР (вместо/поверх пиксель-арта)
   ===================================================================== */
.cover img,.modal-cover img,.daily-art img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
}
.cover img{image-rendering:auto}
.daily-art img{object-position:top center}

/* бейдж ачивок в карточке каталога */
.game-meta .ach-chip{
  color:var(--gold);font-weight:700;letter-spacing:.04em;
  display:inline-flex;align-items:center;gap:3px;
}
.ach-chip--off{opacity:.35}

/* кнопки-ссылки ВОЙТИ / СМОТРЕТЬ в живой ленте */
.player-row a{
  padding:8px 10px;font-size:10px;border:1px solid var(--line);border-radius:4px;
  color:var(--muted);white-space:nowrap;display:inline-flex;gap:5px;align-items:center;
}
.player-row a:hover{color:var(--ink);border-color:var(--cyan)}
.player-row a.join-live{border-color:color-mix(in srgb,var(--green) 45%,transparent);color:var(--green)}
.player-row a.join-live:hover{background:rgba(168,231,157,.08)}
.player-row .live-dot{margin-left:6px}
.mini-live{display:flex;gap:3px;align-items:center;justify-content:space-between}
.tour-empty{color:var(--muted);font-size:12px;line-height:1.6}

/* =====================================================================
   ЧИП ПРОФИЛЯ В ШАПКЕ
   ===================================================================== */
.hub-profchip{
  display:inline-flex;align-items:center;gap:7px;padding:7px 12px!important;
  font-family:var(--mono);font-size:11px;line-height:1;
}
.pc-av{width:22px;height:22px;border-radius:5px;overflow:hidden;display:grid;place-items:center;background:var(--surface-raised);border:1px solid var(--line)}
.pc-av svg{width:100%;height:100%;display:block}
.pc-star{color:var(--gold)}
.pc-num{font-weight:700;min-width:2ch}
.pc-num.bump{animation:pcBump .5s cubic-bezier(.2,.9,.3,1.4)}
@keyframes pcBump{40%{transform:scale(1.35);color:var(--gold)}}
.hub-profchip:hover{border-color:var(--cyan)}

/* =====================================================================
   KONAMI
   ===================================================================== */
.konami{animation:konamistrobe 1.2s linear infinite}
@keyframes konamistrobe{0%{filter:hue-rotate(0deg) saturate(1.4)}100%{filter:hue-rotate(360deg) saturate(1.4)}}

/* =====================================================================
   АДАПТИВ ПРИЛОЖЕНИЯ
   ===================================================================== */
@media (max-width:950px){
  .toasts{left:16px;bottom:16px;max-width:calc(100vw - 32px)}
  .hub-profchip .pc-star,.hub-profchip .pc-num{display:none}
  .hub-profchip{padding:7px 8px!important}
}
@media (max-width:680px){
  .hub-profchip span.pc-av{width:20px;height:20px}
  .overlay .modal{padding:14px}
}
@media (prefers-reduced-motion:reduce){
  .ret-02__crt::before,.ret-02__glow,.ret-02__cursor,.ret-02__l{animation:none!important;opacity:1!important;transform:none!important}
  .toast,.ach{animation:none}
  .konami{animation:none}
}

/* =====================================================================
   v16: ЧАТ-ПЛИТКА, МИНИ-КАРТА, CRT, ДЕНЬ/НОЧЬ, ПРОФ-ХОВЕР
   ===================================================================== */

/* ---- док: ссылки как кнопки ---- */
.dock a{border:0;background:transparent;color:var(--muted);padding:11px 16px;display:flex;align-items:center;gap:9px;font-size:11px;border-radius:4px;text-decoration:none}
.dock a:hover{background:var(--surface-raised);color:var(--ink)}
.dock .dock-duo{color:var(--cyan)}
.dock .dock-duo:hover{color:var(--ink)}

/* ---- v17: кнопки дока одного размера (ширина и высота), профиль с аватаром ---- */
.dock .dock-link{display:flex;align-items:center;justify-content:center;gap:9px;padding:10px 16px;font-size:11px;border-radius:4px;min-height:38px;min-width:136px;box-sizing:border-box}
.dock .dock-duo{background:linear-gradient(90deg,rgba(255,79,163,.16),rgba(79,209,255,.16));border:1px solid rgba(79,209,255,.35);transform:none;font-weight:600}
.dock .dock-duo:hover{transform:none;color:var(--ink)}
.dock .dock-profile .dock-av{width:22px;height:22px;border-radius:5px;border:1px solid var(--line);background:var(--surface-raised);overflow:hidden;flex-shrink:0}
.dock .dock-profile .dock-av svg{width:100%;height:100%;display:block}
.dock .dock-profile:hover{border-color:var(--pink);color:var(--ink)}
/* мобайл: без фикс. ширины (правило после десктопного, чтобы победить) */
@media(max-width:760px){.dock .dock-link{min-width:0;padding:9px 7px;font-size:9px;gap:5px;flex:1;justify-content:center}}

/* ---- v17: ⋯ меню в шапке (день/ночь, звуки, CRT, баг) ---- */
.hub-menu{position:relative}
.hub-menu__pop{position:absolute;top:calc(100% + 8px);right:0;min-width:190px;background:var(--surface);border:1px solid var(--hud-border);border-radius:8px;box-shadow:var(--shadow);padding:6px;display:none;z-index:30}
.hub-menu.open .hub-menu__pop{display:block}
.hub-menu__pop button{display:flex;align-items:center;gap:10px;width:100%;background:transparent;border:0;color:var(--muted);font-size:11px;padding:10px 12px;border-radius:6px;text-align:left;font-family:var(--font)}
.hub-menu__pop button:hover{background:var(--surface-raised);color:var(--ink)}
.hub-menu__pop button[aria-pressed="true"]{color:var(--cyan)}

/* ---- v17: ряды избранного в модалке ---- */
.fav-row{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);cursor:pointer}
.fav-row:hover .fr-name{color:var(--pink)}
.fav-row .fr-art{width:52px;height:36px;border-radius:4px;overflow:hidden;background:var(--surface-raised);border:1px solid var(--line)}
.fav-row .fr-art img,.fav-row .fr-art canvas{width:100%;height:100%;object-fit:cover;image-rendering:pixelated;display:block}
.fav-row .fr-name{font-size:12px;display:block}
.fav-row small{display:block;color:var(--muted);font:9px var(--mono);margin-top:4px}
.fav-row .fr-go{padding:8px 12px;font-size:10px;border:1px solid var(--line);border-radius:4px;background:var(--surface-raised);color:var(--ink)}

/* ---- чат-плитка ---- */
.chat-tile{cursor:default}
.chat-tile small{display:block;font:8px var(--mono);color:var(--muted);margin-top:8px}
.chat-log{height:120px;overflow:auto;font-size:11px;line-height:1.6;padding-right:4px}
.chat-log p{margin:5px 0;overflow-wrap:anywhere}
.chat-log b{color:var(--cyan)}
.chat-empty{color:var(--muted)}
.chat-form{display:grid;grid-template-columns:minmax(0,1fr) 30px;gap:6px}
.chat-form input{width:100%;min-width:0;background:var(--surface-raised);border:1px solid var(--line);color:var(--ink);padding:8px;border-radius:4px;font-size:10px}
.chat-form input:focus{border-color:var(--cyan);outline:none}
.chat-form button{background:var(--pink);border:0;border-radius:4px;color:var(--bg);font-size:13px}
.chat-msg{margin:6px 0}
.chat-msg__head{display:flex;gap:8px;align-items:baseline;font:9px var(--mono)}
.chat-msg__name{color:var(--cyan);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:110px}
.chat-msg__name--self{color:var(--pink)}
.chat-msg__time{color:var(--muted);flex-shrink:0}
.chat-msg__text{font-size:10px;color:var(--ink);overflow-wrap:anywhere;margin-top:2px}

/* ---- мини-карта ---- */
#minimap{position:fixed;left:28px;bottom:76px;z-index:3;width:200px;height:100px;background:var(--hud);border:1px solid var(--hud-border);border-radius:6px;backdrop-filter:blur(14px);cursor:pointer;touch-action:none;image-rendering:pixelated}

/* ---- CRT-эффект: стили переехали в pagefx.css (6 стилей из админки) ---- */

/* ---- кнопка чата на мобиле ---- */
.mobile-chat-trigger{display:none}

/* ---- карточка профиля — открывается кнопкой «Профиль» в доке ---- */
.prof-pop{position:fixed;bottom:92px;right:28px;z-index:30;width:270px;background:var(--hud);backdrop-filter:blur(16px);border:1px solid var(--hud-border);border-radius:8px;box-shadow:var(--hud-shadow);padding:14px;animation:profPop .22s cubic-bezier(.2,1.4,.4,1)}
@keyframes profPop{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
.prof-pop__head{display:grid;grid-template-columns:44px minmax(0,1fr) auto auto;gap:8px;align-items:center;padding-bottom:11px;border-bottom:1px solid var(--line)}
.prof-pop__ava{width:44px;height:44px;padding:6px}
.prof-pop__id strong{display:block;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prof-pop__id small{display:block;font:8px var(--mono);color:var(--muted);margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prof-pop__auth{font:600 9px var(--mono);border:1px solid var(--line);background:var(--surface-raised);color:var(--ink);border-radius:4px;padding:7px 9px;white-space:nowrap}
.prof-pop__auth:hover{border-color:var(--pink);color:var(--pink)}
.prof-pop__auth.out{border-color:rgba(255,92,92,.4);color:#ff7d7d}
.prof-pop__close{width:26px;height:26px;padding:0;border:1px solid var(--line);background:var(--surface-raised);color:var(--muted);border-radius:4px;font:600 11px var(--mono);line-height:1;display:grid;place-items:center}
.prof-pop__close:hover{border-color:var(--pink);color:var(--pink)}
.prof-pop__rank{padding:11px 0;border-bottom:1px solid var(--line)}
.prof-pop__rank b{font:11px var(--mono);color:var(--gold)}
.prof-pop__bar{height:5px;border-radius:3px;background:var(--surface-raised);overflow:hidden;margin:7px 0}
.prof-pop__bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--pink),var(--cyan));transition:width .6s ease}
.prof-pop__rank small{font:8px var(--mono);color:var(--muted)}
.prof-pop__stats{list-style:none;margin:10px 0 4px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.prof-pop__stats li{font-size:10px;color:var(--muted);background:var(--surface-raised);border:1px solid var(--line);border-radius:4px;padding:6px 4px;text-align:center}
.prof-pop__stats b{display:block;font-size:12px;color:var(--ink);font-family:var(--mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prof-pop__stats span{font:7px var(--mono)}
.prof-pop__go{display:block;margin-top:10px;text-align:center;font:600 10px var(--mono);background:var(--pink);color:var(--bg);border-radius:4px;padding:10px;text-decoration:none}
.prof-pop__go:hover{background:var(--cyan)}

/* ---- мобайл ---- */
@media(max-width:680px){
  .mobile-chat-trigger{display:inline-flex}
  #minimap{display:none}
  .chat-tile{display:none}
  .chat-open .hud-stack{display:block;position:fixed;top:120px;bottom:auto;left:16px;right:16px;max-height:calc(100dvh - 210px);overflow:auto;width:auto}
  .chat-open .hud-stack>button{display:none}
  .chat-open .chat-tile{display:block;height:auto;padding:16px}
  .chat-open .chat-log{height:170px}
  .chat-open .tile-top{font-size:11px}
  .chat-open .chat-tile small{display:none}
  .prof-pop{top:auto;bottom:84px;right:16px;left:16px;width:auto}
  .dock a{padding:9px 7px;font-size:9px;gap:5px;flex:1;justify-content:center}
  .zoom{right:16px;bottom:166px}
  .coordinates{display:none}
}
@media (prefers-reduced-motion:reduce){
  .prof-pop{animation:none}
}