:root{--bg:#060810;--panel:#0d111b;--panel2:#111723;--line:#252d3c;--text:#f7f8fb;--muted:#9ca7b7;--pink:#e80077;--orange:#ff8a16;--green:#2ee683;--purple:#a85cff;--danger:#ff4d68;--r:22px;--shadow:0 24px 80px rgba(0,0,0,.38)}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--bg)}body{margin:0;background:radial-gradient(900px 500px at 58% 8%,rgba(80,49,255,.13),transparent 60%),radial-gradient(700px 550px at 80% 28%,rgba(232,0,119,.08),transparent 60%),var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.5;min-height:100vh}button,input,textarea{font:inherit}button,a{touch-action:manipulation}a{color:inherit;text-decoration:none}button{color:inherit}.site-header{height:72px;max-width:1500px;margin:auto;display:flex;align-items:center;padding:0 26px;border-bottom:1px solid rgba(255,255,255,.08);position:relative;z-index:30}.brand{font-size:29px;font-weight:950;letter-spacing:-1.5px;white-space:nowrap}.brand b{font-weight:950;background:linear-gradient(110deg,var(--pink),#ff475f 50%,var(--orange));-webkit-background-clip:text;background-clip:text;color:transparent}.brand.small{font-size:22px}.site-header nav{display:flex;gap:36px;margin:auto;color:#cbd1db}.site-header nav a:hover{color:#fff}.header-pull{min-width:160px}.menu-button{display:none;margin-left:auto;background:transparent;border:0;font-size:27px}.btn{border:1px solid var(--line);min-height:46px;padding:0 18px;border-radius:12px;background:#111622;cursor:pointer;font-weight:800;letter-spacing:.03em;display:inline-flex;align-items:center;justify-content:center;gap:10px;transition:transform .16s ease,border-color .16s ease,filter .16s ease}.btn:hover{transform:translateY(-1px);border-color:#465167}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{border:0;background:linear-gradient(100deg,var(--pink),#ff4258 52%,var(--orange));box-shadow:0 10px 35px rgba(232,0,119,.18)}.btn-free{border-color:rgba(46,230,131,.48);background:rgba(46,230,131,.09);color:#68f2a5}.btn-ghost{background:transparent}.btn-big{min-height:58px;width:100%;font-size:15px}.mode-banner,.announcement{max-width:1440px;margin:12px auto 0;padding:10px 18px;border-radius:12px;background:rgba(255,160,0,.12);border:1px solid rgba(255,160,0,.3);color:#ffd58d;text-align:center}.mode-banner.pause{background:rgba(255,77,104,.1);border-color:rgba(255,77,104,.3);color:#ff9aaa}.announcement{background:rgba(168,92,255,.11);border-color:rgba(168,92,255,.3);color:#d6b6ff}.hero{max-width:1440px;margin:0 auto;padding:34px 26px 10px;display:grid;grid-template-columns:minmax(290px,.82fr) minmax(430px,1.35fr) minmax(230px,.65fr);gap:32px;align-items:center;min-height:680px}.eyebrow,.card-kicker{font-size:12px;font-weight:900;letter-spacing:.11em;color:#c178ff;margin:0 0 10px}.hero h1{font-size:clamp(44px,4.5vw,76px);line-height:.98;letter-spacing:-.055em;margin:0 0 22px}.hero h1 span{background:linear-gradient(100deg,#ff0080,#ff4f58,#ff9a11);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-sub{font-size:17px;color:#c0c7d2;max-width:520px}.status-row{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0 14px}.chip{border:1px solid var(--line);border-radius:10px;padding:9px 12px;font-size:12px;color:#cbd2dd;background:rgba(255,255,255,.025)}.chip.good{color:#5df29b;border-color:rgba(46,230,131,.26);background:rgba(46,230,131,.06)}.chip.good i,.pulse{display:inline-block;width:8px;height:8px;border-radius:99px;background:var(--green);margin-right:6px;box-shadow:0 0 0 0 rgba(46,230,131,.55);animation:pulse 2s infinite}@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(46,230,131,0)}100%{box-shadow:0 0 0 0 rgba(46,230,131,0)}}.hero-stats{display:flex;flex-wrap:wrap;gap:8px;color:#cbd1db;font-size:14px}.price-card{margin-top:24px;border:1px solid var(--line);border-radius:18px;padding:18px;background:linear-gradient(145deg,rgba(17,23,35,.96),rgba(8,12,19,.92));box-shadow:var(--shadow)}.price-card>div:first-child{display:flex;align-items:flex-end;gap:12px}.price-card small{display:block;color:var(--muted);letter-spacing:.08em}.price-card strong{font-size:50px;line-height:1}.price-rules{display:flex;gap:14px;color:#aeb7c5;font-size:13px;margin:12px 0}.price-rules b{color:var(--green)}.free-progress{font-size:12px;color:#d2d7df;margin:17px 0}.progress{height:7px;border-radius:99px;background:#252b36;margin-top:8px;overflow:hidden}.progress i{display:block;height:100%;background:linear-gradient(90deg,#13bd65,#56ef9b);border-radius:99px}.tower-column{position:relative;min-width:0}.tower-headline{text-align:center;color:var(--green);font-size:12px;letter-spacing:.1em;margin-bottom:8px}.tower-stage{height:590px;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;perspective:1000px;isolation:isolate}.tower-glow{position:absolute;width:78%;height:70%;border-radius:50%;background:radial-gradient(circle,rgba(110,76,255,.17),rgba(232,0,119,.05) 45%,transparent 72%);filter:blur(28px);z-index:-1}.founder{position:absolute;top:12px;border:1px solid rgba(255,183,38,.35);color:#ffc75e;background:rgba(255,168,25,.08);padding:7px 12px;border-radius:99px;font-size:11px;letter-spacing:.08em}.tower{width:min(430px,92%);height:485px;display:flex;flex-direction:column;justify-content:flex-end;filter:drop-shadow(0 25px 25px rgba(0,0,0,.38));transform:rotateX(-2deg);transform-style:preserve-3d}.tower-row{height:27px;display:flex;justify-content:center;gap:3px;position:relative;transform-style:preserve-3d;margin-top:-1px}.tower-row.odd{transform:translateX(3px)}.brik,.brik-hole{width:31.5%;height:25px;border-radius:5px;display:block}.brik{position:relative;border:1px solid rgba(255,255,255,.19);background:linear-gradient(180deg,#33405c,#1b2438);box-shadow:inset 0 2px 2px rgba(255,255,255,.14),inset 0 -4px 8px rgba(0,0,0,.28),0 4px 7px rgba(0,0,0,.28);cursor:pointer;padding:0;transform-style:preserve-3d;transition:transform .16s ease,filter .16s ease,box-shadow .16s ease}.tower-row:nth-child(6n+1) .brik{background:linear-gradient(180deg,#244be5,#1231a0)}.tower-row:nth-child(6n+2) .brik{background:linear-gradient(180deg,#b018bd,#6a0d7e)}.tower-row:nth-child(6n+3) .brik{background:linear-gradient(180deg,#e82f79,#9d124c)}.tower-row:nth-child(6n+4) .brik{background:linear-gradient(180deg,#ee641e,#9b2c0a)}.tower-row:nth-child(6n+5) .brik{background:linear-gradient(180deg,#f4a415,#ad6500)}.tower-row:nth-child(6n) .brik{background:linear-gradient(180deg,#218a58,#0f5736)}.brik::after{content:"";position:absolute;left:5px;right:5px;top:2px;height:32%;border-radius:3px;background:linear-gradient(180deg,rgba(255,255,255,.14),transparent);pointer-events:none}.brik-face{display:flex;align-items:center;justify-content:center;gap:5px;font-size:8px;letter-spacing:.08em;text-shadow:0 1px 2px rgba(0,0,0,.6);height:100%}.brik-face b{font-size:9px}.brik-face small{opacity:.62}.brik:hover,.brik:focus-visible,.brik.selected{transform:translateZ(18px) scale(1.06);z-index:5;filter:brightness(1.22);outline:none;box-shadow:0 0 0 2px #ffa21a,0 0 26px rgba(255,138,22,.55),inset 0 2px 2px rgba(255,255,255,.2)}.brik.reserved{opacity:.48;cursor:wait}.brik-hole{background:transparent;border:1px dashed rgba(255,255,255,.06)}.tower-base{width:min(510px,100%);height:32px;background:linear-gradient(180deg,#273047,#0b0f18);border:1px solid #38445c;border-radius:50%;box-shadow:0 16px 38px rgba(0,0,0,.6);transform:translateY(-4px)}.tower-base span{display:block;height:13px;width:85%;margin:5px auto;border-radius:50%;border:1px solid rgba(120,142,183,.35)}.touch-hint{font-size:10px;color:#9ca5b4;letter-spacing:.14em;margin-top:7px}.survivors{min-height:66px;display:flex;justify-content:center;align-items:center;gap:7px;flex-wrap:wrap;margin-top:-8px}.survivor{--c:#7c3aed;--tc:#fff;min-width:74px;max-width:120px;padding:8px 9px;border-radius:7px;background:linear-gradient(180deg,color-mix(in srgb,var(--c),white 12%),var(--c));color:var(--tc);box-shadow:0 8px 18px rgba(0,0,0,.25);transform:rotate(var(--rot,0deg));font-size:10px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.survivor:nth-child(2n){--rot:2deg}.survivor:nth-child(3n){--rot:-2deg}.survivor small{opacity:.7;margin-left:4px}.live-column{display:grid;gap:14px}.live-card,.panel{border:1px solid var(--line);border-radius:18px;background:linear-gradient(150deg,rgba(16,22,34,.9),rgba(8,12,18,.9));padding:20px}.live-card strong{display:block;font-size:21px;margin:4px 0}.live-card b{color:#bf75ff}.live-card p{color:#aeb8c6;font-size:13px}.live-card code{display:block;max-width:100%;overflow:hidden;color:#7de7a7;background:#070b12;border-radius:8px;padding:9px;font-size:11px}.live-card a{display:inline-block;margin-top:12px;color:#c68dff;font-size:12px}.free-live{border-color:rgba(46,230,131,.25);background:rgba(46,230,131,.04)}.social-strip{max-width:1440px;margin:10px auto 0;padding:0 26px;display:flex;gap:10px}.reaction{min-height:46px;border-radius:12px;border:1px solid var(--line);background:#0d121d;color:#cbd2dd;padding:0 16px;cursor:pointer;font-weight:800}.reaction.like{color:#ff7cad}.sections-grid{max-width:1440px;margin:22px auto;padding:0 26px 30px;display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:14px}.panel{min-height:230px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.steps>div{text-align:center;padding:12px 8px}.steps i{display:grid;place-items:center;margin:0 auto 8px;width:29px;height:29px;border:1px solid #a85cff;border-radius:99px;color:#c38aff;font-style:normal}.steps b,.steps span{display:block}.steps span{font-size:12px;color:#9fa9b8;margin-top:6px}.panel-link{display:block;border-top:1px solid var(--line);margin:14px -20px -20px;padding:14px 20px;color:#c7ced8;font-size:12px}.records>div{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.06);font-size:13px}.records b{color:#58ea94}.collapse-card strong{display:block;font-size:27px;color:var(--c,#ff4d8d);margin:12px 0}.collapse-card span{color:#9ca6b5;font-size:13px}.seo-copy{max-width:900px;margin:30px auto 70px;padding:0 26px;color:#9ca6b4}.seo-copy h2{color:#f5f7fb;font-size:31px;letter-spacing:-.03em}.site-footer{max-width:1440px;margin:0 auto;border-top:1px solid var(--line);padding:32px 26px 50px;display:grid;grid-template-columns:1fr auto;gap:24px;color:#949dab}.site-footer p{margin:8px 0;font-size:12px}.footer-links{display:flex;flex-wrap:wrap;gap:18px;font-size:12px}.fine{grid-column:1/-1}.modal[hidden],.event-overlay[hidden]{display:none}.modal{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:16px}.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(8px)}.modal-sheet{position:relative;width:min(520px,100%);max-height:min(86vh,780px);overflow:auto;border:1px solid #30394b;border-radius:22px;background:#0c111b;padding:24px;box-shadow:0 30px 100px #000}.modal-sheet.wide{width:min(760px,100%)}.modal-x{position:absolute;right:13px;top:11px;width:40px;height:40px;border-radius:99px;border:1px solid var(--line);background:#141b29;font-size:24px;cursor:pointer}.modal h2{font-size:30px;letter-spacing:-.03em;margin:3px 0 8px}.modal p{color:#aab4c2}.modal-actions{display:grid;gap:10px;margin-top:20px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.modal label{display:grid;gap:7px;color:#c6cdd7;font-size:12px;font-weight:800}.modal input,.modal textarea{width:100%;border:1px solid #30394b;background:#090d14;color:#fff;border-radius:11px;min-height:46px;padding:10px 12px;outline:none}.modal input:focus,.modal textarea:focus{border-color:#a85cff;box-shadow:0 0 0 3px rgba(168,92,255,.12)}.modal input[type=color]{padding:4px;height:47px}.modal input[type=file]{padding:8px}.modal label small{color:#7f8a9a;font-weight:500}.purchase-note{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0;color:#98a2b2;font-size:11px}.purchase-note b{color:#ffcf75}.form-error{color:#ff8597!important;min-height:20px}.event-overlay{position:fixed;inset:0;z-index:100;background:radial-gradient(circle at 50% 30%,rgba(168,92,255,.22),transparent 35%),rgba(3,5,10,.95);display:grid;place-items:center;text-align:center;padding:24px}.event-content{max-width:620px}.event-content h2{font-size:clamp(46px,10vw,96px);line-height:.9;letter-spacing:-.06em;margin:12px 0;background:linear-gradient(100deg,#fff,#ff5b7c,#ff9b17);-webkit-background-clip:text;background-clip:text;color:transparent}.event-content .btn{margin:8px}.brik.pulling{animation:pullOut .95s cubic-bezier(.25,.7,.25,1) forwards}@keyframes pullOut{0%{transform:translateZ(10px)}65%{transform:translateX(95px) translateZ(60px) rotateZ(3deg)}100%{transform:translateX(260px) translateY(50px) rotateZ(18deg);opacity:0}}.tower.collapsing .brik{animation:fall 1.5s cubic-bezier(.34,.04,.74,.25) forwards;animation-delay:calc(var(--fall-i,1)*22ms)}@keyframes fall{to{transform:translate(var(--fall-x,70px),520px) rotate(var(--fall-r,90deg));opacity:.05}}.content-page{max-width:1050px;margin:50px auto 90px;padding:0 26px}.content-page h1{font-size:clamp(40px,7vw,72px);letter-spacing:-.05em}.content-page h2{margin-top:42px}.content-page p,.content-page li{color:#b5bdc9}.content-page table{width:100%;border-collapse:collapse}.content-page th,.content-page td{padding:12px;border-bottom:1px solid var(--line);text-align:left}.archive-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.archive-card{border:1px solid var(--line);border-radius:18px;padding:18px;background:var(--panel)}
@media(max-width:1080px){.hero{grid-template-columns:1fr 1.15fr}.live-column{grid-column:1/-1;grid-template-columns:repeat(3,1fr)}.sections-grid{grid-template-columns:1fr 1fr}.collapse-card{grid-column:1/-1}.tower-stage{height:560px}}
@media(max-width:760px){.site-header{height:64px;padding:0 16px}.brand{font-size:25px}.site-header nav,.header-pull{display:none}.menu-button{display:block}.hero{display:flex;flex-direction:column;padding:26px 16px 10px;gap:4px;align-items:stretch}.hero-copy{display:contents}.eyebrow{order:1}.hero h1{order:2;font-size:50px;margin-bottom:14px}.hero-sub{order:3;font-size:15px}.status-row{order:4;margin:12px 0 8px}.hero-stats{order:5}.tower-column{order:6;margin-top:8px}.tower-headline{margin:8px 0 0}.tower-stage{height:510px}.tower{width:94%;height:425px}.tower-row{height:24px}.brik,.brik-hole{height:23px;border-radius:5px}.brik-face b{font-size:8px}.touch-hint{margin-top:3px}.survivors{margin-top:-4px}.price-card{order:7;margin-top:14px}.live-column{order:8;display:grid;grid-template-columns:1fr 1fr;margin-top:14px}.live-column .live-card:last-child:nth-child(odd){grid-column:1/-1}.social-strip{padding:0 16px;overflow:auto}.reaction{white-space:nowrap}.sections-grid{display:block;padding:0 16px}.panel{margin-bottom:12px}.steps{gap:2px}.site-footer{display:block;padding:30px 16px 90px}.footer-links{margin:24px 0}.form-grid{grid-template-columns:1fr}.modal{align-items:end;padding:0}.modal-sheet,.modal-sheet.wide{width:100%;border-radius:22px 22px 0 0;max-height:91vh;padding:22px 18px calc(24px + env(safe-area-inset-bottom))}.archive-grid{grid-template-columns:1fr}.content-page{padding:0 18px}.mode-banner,.announcement{margin:8px 12px 0}.price-card strong{font-size:46px}}
@media(max-width:430px){.hero h1{font-size:45px}.tower-stage{height:470px}.tower{height:392px}.tower-row{height:22px}.brik,.brik-hole{height:21px}.live-column{grid-template-columns:1fr}.price-rules{flex-direction:column;gap:2px}.steps span{font-size:11px}.reaction{padding:0 13px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,20px);background:#151c29;border:1px solid #33405a;color:#fff;padding:11px 16px;border-radius:12px;z-index:130;opacity:0;pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}.toast.bad{border-color:#7b3040;color:#ff9aaa}
.mobile-menu{position:fixed;z-index:70;top:64px;left:12px;right:12px;padding:12px;border:1px solid var(--line);border-radius:16px;background:rgba(10,14,22,.98);box-shadow:0 24px 80px rgba(0,0,0,.55);display:grid;gap:8px}.mobile-menu[hidden]{display:none}.mobile-menu a{padding:12px 10px;border-radius:10px;color:#d5dbe4}.mobile-menu a:hover{background:#151b28}.logo-preview{display:none;min-height:88px;border:1px dashed #313b50;border-radius:14px;background:#080c13;padding:12px;place-items:center;margin:2px 0 14px}.logo-preview.show{display:grid}.logo-preview img{max-width:180px;max-height:84px;object-fit:contain}.file-note{font-size:11px;color:#8792a3}.badge{display:inline-flex;margin-left:6px;border-radius:999px;padding:2px 7px;font-size:9px;text-transform:uppercase}.badge.bad{background:rgba(255,77,104,.12);color:#ff8fa0}.danger{border-color:#7d3445!important;color:#ff91a1!important}.admin-table-wrap{overflow:auto}.inline-form{display:inline-block;margin:3px 3px 0 0}.mini-form{min-width:220px;display:grid;gap:7px;margin:8px 0}.mini-form label{display:grid;gap:4px;font-size:10px}.mini-form input{min-height:38px;background:#080c13;border:1px solid #30394b;border-radius:8px;color:#fff;padding:6px}.feedback-list{display:grid;gap:10px}.feedback-list article{border:1px solid #273144;border-radius:12px;padding:12px;background:#090e16}.feedback-list time{font-size:10px;color:#7f8998}.feedback-list p{white-space:pre-wrap;margin:6px 0 0;color:#d5dbe4}
@media(min-width:761px){.mobile-menu{display:none!important}}

.social-links{display:flex;flex-wrap:wrap;gap:.65rem;margin:1rem 0}.social-links a{padding:.55rem .8rem;border:1px solid var(--line);border-radius:999px;color:var(--muted);text-decoration:none}.social-links a:hover{color:var(--text);border-color:#7c3aed}

/* ========================================================================== */
/* BRIK V1.1 — fixed-camera 3D block tower                                   */
/* True 3×1 stack: three identical blocks per level, alternating 90 degrees.  */
/* No drag/rotation: the camera/view is intentionally fixed for touch UX.     */
/* ========================================================================== */
.tower-column{overflow:visible}
.tower-stage{height:650px;overflow:visible;perspective:1400px;perspective-origin:50% 46%;justify-content:flex-start;padding-top:10px}
.tower-stage .tower-glow{width:88%;height:78%;top:8%;background:radial-gradient(circle,rgba(97,62,255,.21),rgba(232,0,119,.075) 42%,transparent 70%);filter:blur(36px)}
.tower-viewport{position:relative;width:100%;height:585px;display:block;perspective:1400px;perspective-origin:50% 46%;isolation:isolate;overflow:visible;touch-action:manipulation}
#tower.tower{position:absolute;left:50%;bottom:55px;width:0;height:0;display:block;filter:drop-shadow(0 34px 30px rgba(0,0,0,.52));transform-style:preserve-3d;transform-origin:50% 100%;transform:rotateX(-7deg) rotateY(-24deg) scale(.86);will-change:transform}
#tower .brik{--brick-l:312px;--brick-l2:156px;--brick-d:104px;--brick-d2:52px;--brick-h:34px;--brick-h2:17px;position:absolute;left:0;bottom:0;width:var(--brick-l);height:var(--brick-h);margin-left:calc(-1 * var(--brick-l2));padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;cursor:pointer;transform-style:preserve-3d;transform:translate3d(var(--x),var(--y),var(--z)) rotateY(var(--ry));transform-origin:50% 50%;transition:filter .16s ease,translate .18s ease;will-change:transform,translate,opacity;outline:none}
#tower .brik::after{display:none}
#tower .brik-face{position:absolute;display:flex;align-items:center;justify-content:center;gap:7px;margin:0;padding:0;color:rgba(15,16,23,.67);font-size:11px;font-weight:900;letter-spacing:.055em;text-shadow:0 1px rgba(255,255,255,.18);background:linear-gradient(180deg,color-mix(in srgb,var(--brik-color),white 18%),var(--brik-color) 46%,color-mix(in srgb,var(--brik-color),black 12%));border:1px solid rgba(255,255,255,.24);box-shadow:inset 0 3px 5px rgba(255,255,255,.22),inset 0 -7px 12px rgba(0,0,0,.16);backface-visibility:visible;overflow:hidden;pointer-events:auto;transition:filter .16s ease,border-color .16s ease,box-shadow .16s ease}
#tower .brik-face::before{content:"";position:absolute;left:7%;right:7%;top:8%;height:25%;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.25),rgba(255,255,255,0));opacity:.7;pointer-events:none}
#tower .brik-front,#tower .brik-back{left:0;top:0;width:var(--brick-l);height:var(--brick-h);border-radius:9px}
#tower .brik-front{transform:translateZ(var(--brick-d2))}
#tower .brik-back{transform:rotateY(180deg) translateZ(var(--brick-d2));filter:brightness(.76)}
#tower .brik-left,#tower .brik-right{left:calc(50% - var(--brick-d2));top:0;width:var(--brick-d);height:var(--brick-h);border-radius:7px;letter-spacing:.02em}
#tower .brik-right{transform:rotateY(90deg) translateZ(var(--brick-l2));filter:brightness(.88)}
#tower .brik-left{transform:rotateY(-90deg) translateZ(var(--brick-l2));filter:brightness(.72)}
#tower .brik-top,#tower .brik-bottom{left:0;top:calc(50% - var(--brick-d2));width:var(--brick-l);height:var(--brick-d);border-radius:9px}
#tower .brik-top{transform:rotateX(90deg) translateZ(var(--brick-h2));filter:brightness(1.12)}
#tower .brik-bottom{transform:rotateX(-90deg) translateZ(var(--brick-h2));filter:brightness(.63)}
#tower .brik-front b,#tower .brik-back b{font-size:11px;letter-spacing:.09em}
#tower .brik-front small,#tower .brik-back small{font-size:9px;opacity:.65}
#tower .brik-left small,#tower .brik-right small{font-size:9px;opacity:.68}
#tower .brik:hover,#tower .brik:focus-visible,#tower .brik.selected{translate:0 0 11px;z-index:20;filter:brightness(1.14)}
#tower .brik:hover .brik-face,#tower .brik:focus-visible .brik-face,#tower .brik.selected .brik-face{border-color:rgba(255,183,65,.94);box-shadow:0 0 0 2px rgba(255,157,21,.46),0 0 30px rgba(255,126,20,.58),inset 0 3px 5px rgba(255,255,255,.3),inset 0 -7px 12px rgba(0,0,0,.12)}
#tower .brik.selected .brik-front::after{content:"SELECTED";position:absolute;right:10px;top:50%;transform:translateY(-50%);padding:3px 6px;border-radius:999px;background:rgba(9,10,15,.62);color:#fff;font-size:7px;letter-spacing:.12em;text-shadow:none}
#tower .brik.reserved{opacity:.42;cursor:wait;filter:saturate(.45)}
#tower .brik.reserved .brik-face{border-color:rgba(255,255,255,.11)}
.tower-base{position:absolute;z-index:-1;left:50%;bottom:28px;width:min(455px,88%);height:58px;transform:translateX(-50%);border:1px solid #3a4458;border-radius:50%;background:linear-gradient(180deg,#273047 0%,#111725 38%,#090d16 100%);box-shadow:0 26px 54px rgba(0,0,0,.67),inset 0 5px 8px rgba(255,255,255,.065)}
.tower-base span{position:absolute;left:8%;right:8%;top:8px;height:28px;width:auto;margin:0;border:1px solid rgba(133,151,188,.31);border-radius:50%;background:radial-gradient(ellipse,rgba(87,69,205,.13),transparent 65%)}
.tower-base i{position:absolute;left:18%;right:18%;bottom:5px;height:8px;border-radius:50%;background:rgba(0,0,0,.45);filter:blur(5px)}
.tower-stage .touch-hint{margin:2px 0 0;font-size:10px;letter-spacing:.16em;color:#a9b1bf;text-align:center}
.tower-stage .touch-hint::before{content:"☝";margin-right:7px;color:#fff}
.tower-stage .founder{z-index:25;top:4px}
/* Pulled BRIKs look like small glossy plastic pieces, not flat badges. */
.survivors{position:relative;z-index:8;min-height:72px;margin-top:-9px;gap:9px}
.survivor{position:relative;min-width:86px;max-width:132px;padding:10px 11px;border:1px solid rgba(255,255,255,.2);border-radius:8px;background:linear-gradient(180deg,color-mix(in srgb,var(--c),white 19%),var(--c) 52%,color-mix(in srgb,var(--c),black 13%));box-shadow:inset 0 2px 3px rgba(255,255,255,.18),inset 0 -5px 8px rgba(0,0,0,.14),0 11px 22px rgba(0,0,0,.31)}
.survivor::before{content:"";position:absolute;left:8px;right:8px;top:3px;height:26%;border-radius:99px;background:linear-gradient(180deg,rgba(255,255,255,.22),transparent)}
/* Keep the existing server-authoritative outcome, but animate the actual 3D piece. */
#tower .brik.pulling{animation:pullOut3d .95s cubic-bezier(.22,.7,.22,1) forwards}
@keyframes pullOut3d{0%{translate:0 0 0;rotate:0deg;opacity:1}62%{translate:120px 3px 115px;rotate:0deg}100%{translate:330px 72px 180px;rotate:16deg;opacity:0}}
#tower.collapsing .brik{animation:fall3d 1.45s cubic-bezier(.28,.02,.71,.26) forwards;animation-delay:calc(var(--fall-i,1)*20ms)}
@keyframes fall3d{35%{translate:18px 16px 35px;rotate:3deg}100%{translate:var(--fall-x,70px) 560px 180px;rotate:var(--fall-r,90deg);opacity:.04}}
@media(max-width:1080px){.tower-stage{height:620px}.tower-viewport{height:555px}#tower.tower{transform:rotateX(-7deg) rotateY(-24deg) scale(.80);bottom:50px}.tower-base{bottom:25px}}
@media(max-width:760px){.tower-stage{height:520px;padding-top:0;perspective:1100px}.tower-viewport{height:465px;perspective:1100px}#tower.tower{transform:rotateX(-7deg) rotateY(-24deg) scale(.68);bottom:43px}.tower-base{width:min(390px,92%);height:48px;bottom:20px}.tower-base span{height:23px}.tower-stage .touch-hint{margin-top:-2px}.survivors{min-height:64px;margin-top:-13px}.survivor{min-width:74px;padding:8px 9px}}
@media(max-width:430px){.tower-stage{height:474px}.tower-viewport{height:426px}#tower.tower{transform:rotateX(-7deg) rotateY(-24deg) scale(.61);bottom:39px}.tower-base{width:94%;height:44px;bottom:18px}.tower-stage .touch-hint{font-size:9px}.survivors{margin-top:-15px}}
@media(prefers-reduced-motion:reduce){#tower .brik{transition:none!important}}

/* BRIK V1.2 fixed-camera canvas renderer. The logical buttons remain in the DOM
   for state/accessibility/fallback, while the visible tower is drawn on canvas. */
.tower-viewport{position:relative;overflow:visible}
.tower-canvas{position:absolute;inset:0;z-index:4;display:block;width:100%;height:100%;touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
#tower.tower{position:absolute!important;left:0!important;top:0!important;bottom:auto!important;width:1px!important;height:1px!important;margin:0!important;padding:0!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;transform:none!important;filter:none!important;opacity:.001!important;pointer-events:none!important}
#tower.tower .brik{position:absolute!important;width:1px!important;height:1px!important;margin:0!important;padding:0!important;transform:none!important;translate:none!important;animation:none!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;box-shadow:none!important;border:0!important}
.tower-viewport>.tower-base{display:none!important}
.tower-pointer-label{position:absolute;z-index:8;pointer-events:none;border:1px solid rgba(255,177,55,.8);border-radius:10px;padding:7px 10px;background:rgba(8,11,18,.86);box-shadow:0 0 26px rgba(255,132,24,.28);font-size:11px;font-weight:900;letter-spacing:.05em}
.tower-stage .touch-hint{position:relative;z-index:7}
@media(max-width:760px){.tower-canvas{touch-action:manipulation}}

/* V1.2 — on wide screens, pulled BRIKs orbit the fixed tower like physical pieces.
   On touch layouts they fall back to the compact horizontal survivor row. */
@media(min-width:1081px){
  .tower-column>.survivors{position:absolute;z-index:9;inset:62px -58px 78px -58px;min-height:0;margin:0;display:block;pointer-events:none}
  .tower-column>.survivors .survivor{position:absolute;display:flex;align-items:center;justify-content:center;min-width:104px;max-width:142px;height:45px;padding:0 12px;border-radius:9px;pointer-events:auto;transform:perspective(520px) rotateX(-5deg) rotateY(var(--sy,0deg)) rotateZ(var(--sr,0deg));transition:transform .16s ease,filter .16s ease;box-shadow:inset 0 3px 4px rgba(255,255,255,.22),inset 0 -7px 12px rgba(0,0,0,.18),0 16px 28px rgba(0,0,0,.34)}
  .tower-column>.survivors .survivor:hover{filter:brightness(1.15);transform:perspective(520px) rotateX(-5deg) rotateY(var(--sy,0deg)) rotateZ(var(--sr,0deg)) translateY(-3px)}
  .tower-column>.survivors .survivor:nth-child(1){left:-12px;bottom:34px;--sy:13deg;--sr:-3deg}
  .tower-column>.survivors .survivor:nth-child(2){right:-22px;bottom:18px;--sy:-16deg;--sr:3deg}
  .tower-column>.survivors .survivor:nth-child(3){right:-40px;top:168px;--sy:-18deg;--sr:-2deg}
  .tower-column>.survivors .survivor:nth-child(4){left:-34px;top:206px;--sy:16deg;--sr:2deg}
  .tower-column>.survivors .survivor:nth-child(5){right:4px;top:64px;--sy:-13deg;--sr:4deg}
  .tower-column>.survivors .survivor:nth-child(6){left:12px;top:92px;--sy:12deg;--sr:-4deg}
}
