/* ---------- shared: PREVIEW banner toggle, profile page, tank accents ---------- */
.ribbon{display:flex;align-items:center;gap:10px;pointer-events:auto;padding:4px 6px 4px 12px;padding-top:max(4px,env(safe-area-inset-top))}
.theme-tog{display:inline-flex;background:rgba(0,0,0,.14);border-radius:99px;padding:2px}
.theme-tog button{font:inherit;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:3px 10px;border-radius:99px;color:#3a3200;cursor:pointer}
.theme-tog button.on{background:#111;color:#ffd400}
.ln{display:none}
.holo,.tier-plain,.tx-grid,.tx-row,.tx-gauge,.tx-spark-box{display:none}
.nav .nv{padding:6px 8px}

.profile{position:fixed;inset:0;z-index:60;overflow-y:auto;background:rgba(5,6,11,.97);opacity:0;transform:translateY(16px);transition:opacity .25s,transform .3s var(--spring)}
.profile.open{opacity:1;transform:none}
body.pf-lock{overflow:hidden}
.pf-in{max-width:480px;margin:0 auto;padding:calc(56px + env(safe-area-inset-top)) 16px 40px;display:flex;flex-direction:column;gap:14px}
.pf-top{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;text-align:center}
.pf-top h2{font-family:var(--disp);font-size:20px}
.pf-back{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.07);color:inherit;cursor:pointer;font-size:0}
.pf-back:before{content:"‹";font-size:28px;line-height:1}
.pf-back .ln{display:none!important}
.pf-id{display:flex;align-items:center;gap:14px;padding:16px;border-radius:24px}
.pf-av{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;font:800 22px var(--disp);background:var(--g-gold);color:#111;flex:none}
.pf-id b{display:block;font-size:18px}.pf-id span{color:var(--mut);font-size:13px;word-break:break-all}
.pf-stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1px;border-radius:22px;overflow:hidden;padding:0;background:rgba(255,255,255,.08)!important}
.pf-stats div{background:#10131d;padding:12px 12px 13px}
.pf-stats span{display:block;font-size:11px;color:var(--mut);font-weight:600;text-transform:uppercase;letter-spacing:.06em}
.pf-stats b{display:block;font-size:15px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-group{padding:6px 16px 16px;border-radius:24px}
.pf-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0 10px}
.pf-row b{display:block;font-size:15px}.pf-row span{display:block;font-size:12.5px;color:var(--mut);line-height:1.35}
.pf-group .pf-row+.pf-row{border-top:1px solid var(--line)}
.pf-soon{flex:none;font-size:11px!important;font-weight:800;padding:3px 9px;border-radius:99px;background:rgba(255,255,255,.08)}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:16px;background:rgba(255,255,255,.06);margin-bottom:6px}
.seg button{height:42px;border-radius:12px;font:700 14px var(--font);color:var(--mut);cursor:pointer;transition:all .3s var(--spring)}
.seg button.on{background:var(--g-main);color:#06121c;box-shadow:0 6px 18px rgba(72,171,239,.3)}

/* Playful accents in planted-tank mode */
.tank-fresh{--blue:#3fbf6a;--cyan:#8af5a5;--violet:#2a9d8f;--g-main:linear-gradient(120deg,#c6ff7a 0%,#6fdc6a 35%,#2fb38a 70%,#1f8a8a 100%)}
.tank-fresh .seg button.on{box-shadow:0 6px 18px rgba(63,191,106,.3)}

/* ======================= TECH theme ======================= */
.theme-tech{--x-bg:#04070a;--x-surf:rgba(10,18,24,.78);--x-surf2:rgba(18,30,38,.9);--x-line:rgba(110,220,255,.14);--x-line2:rgba(110,220,255,.28);--x-fg:#e4f3f7;--x-mut:#7d929c;
  --x-acc:#38e3f2;--x-acc2:#48ABEF;--x-glow:rgba(56,227,242,.45);--x-soft:rgba(56,227,242,.12);
  --font:'Space Grotesk',system-ui,sans-serif;--disp:'Space Grotesk',system-ui,sans-serif;--mono:'JetBrains Mono',ui-monospace,Menlo,monospace;--mut:var(--x-mut);--line:var(--x-line)}
.theme-tech.tank-fresh{--x-acc:#5cf08e;--x-acc2:#2fbf71;--x-glow:rgba(92,240,142,.42);--x-soft:rgba(92,240,142,.12);--x-line:rgba(120,255,170,.13);--x-line2:rgba(120,255,170,.28)}
.theme-tech body{background:var(--x-bg);color:var(--x-fg);font-family:var(--font);letter-spacing:-.005em;
  background-image:radial-gradient(120% 60% at 50% -10%,var(--x-soft),transparent 60%),linear-gradient(var(--x-line) 1px,transparent 1px),linear-gradient(90deg,var(--x-line) 1px,transparent 1px);
  background-size:100% 100%,32px 32px,32px 32px;background-attachment:fixed;background-position:0 0,-1px -1px,-1px -1px}
.theme-tech body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background:radial-gradient(90% 70% at 50% 40%,transparent 40%,var(--x-bg) 100%)}
.theme-tech #app,.theme-tech #login{position:relative;z-index:1}
.theme-tech .blobs,.theme-tech #reef,.theme-tech .swimmer,.theme-tech .emo,.theme-tech .tier-pill,.theme-tech .big-emoji,.theme-tech #fx{display:none!important}
.theme-tech .ln{display:block;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.theme-tech .ribbon{background:#0b1216;color:#ffcf40;border:1px solid rgba(255,207,64,.6);border-top:0;font-family:var(--mono);font-weight:600}
.theme-tech .theme-tog{background:rgba(255,255,255,.06)}
.theme-tech .theme-tog button{color:#c9a640;font-family:var(--mono);font-weight:600}
.theme-tech .theme-tog button.on{background:#ffcf40;color:#0b1216}
.theme-tech .card-glass{background:var(--x-surf);border:1px solid var(--x-line);border-radius:16px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),inset 0 0 24px var(--x-soft)}
.theme-tech .grad,.theme-tech .sl-out b,.theme-tech .earn .v,.theme-tech .j-top b{background:none;-webkit-background-clip:initial;background-clip:initial;color:var(--x-acc)}
.theme-tech .kicker{font-family:var(--mono);color:var(--x-acc);letter-spacing:.2em;font-size:11px;font-weight:500;background:none;-webkit-text-fill-color:currentColor}
.theme-tech .lg-title{font-family:var(--disp);font-weight:600;font-size:36px;line-height:1.05;letter-spacing:-.03em}
.theme-tech .lg-sub,.theme-tech .note{color:var(--x-mut)}
.theme-tech .btn{background:var(--x-acc);color:#031014;box-shadow:0 0 0 1px var(--x-acc),0 0 24px var(--x-glow);border-radius:12px;font-weight:600;letter-spacing:.01em;transition:box-shadow .25s,transform .15s}
.theme-tech .btn:hover{box-shadow:0 0 0 1px var(--x-acc),0 0 34px var(--x-glow)}.theme-tech .btn:active{transform:scale(.98)}
.theme-tech .btn:disabled{background:var(--x-surf2);color:var(--x-mut);box-shadow:0 0 0 1px var(--x-line)}
.theme-tech .btn.ghost{background:transparent;color:var(--x-fg);box-shadow:0 0 0 1px var(--x-line2)}
.theme-tech .btn.gold{background:var(--x-acc);color:#031014}
.theme-tech .inp{background:rgba(0,0,0,.35);border:1px solid var(--x-line2);border-radius:12px;font-family:var(--mono);letter-spacing:.06em;color:var(--x-fg)}
.theme-tech .inp:focus{border-color:var(--x-acc);box-shadow:0 0 0 3px var(--x-soft)}
.theme-tech .demo{background:var(--x-surf);border:1px solid var(--x-line);border-radius:14px}
.theme-tech .demo .av,.theme-tech .avatar{background:transparent;color:var(--x-acc);border:1px solid var(--x-line2);border-radius:12px;font-family:var(--mono);font-weight:500;box-shadow:inset 0 0 12px var(--x-soft)}
.theme-tech .demo .pts{font-family:var(--mono);font-weight:500;color:var(--x-acc)}
.theme-tech .hi small{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--x-mut)}
/* hero: masked duotone photo, grid + scanlines, HUD corners */
.theme-tech .hero{height:318px;border-radius:18px 18px 0 0;border:1px solid var(--x-line);border-bottom:0;background:#020507;box-shadow:none}
.theme-tech .tx-grid{display:block;position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px),linear-gradient(var(--x-line) 1px,transparent 1px) 0 0/24px 24px,linear-gradient(90deg,var(--x-line) 1px,transparent 1px) 0 0/24px 24px;-webkit-mask-image:linear-gradient(90deg,#000,transparent 70%);mask-image:linear-gradient(90deg,#000 10%,transparent 75%)}
.theme-tech .hero:before,.theme-tech .hero:after{content:"";position:absolute;width:14px;height:14px;z-index:2;border:1.5px solid var(--x-acc);opacity:.8}
.theme-tech .hero:before{top:10px;left:10px;border-right:0;border-bottom:0}.theme-tech .hero:after{top:10px;right:10px;border-left:0;border-bottom:0}
.theme-tech .hud{background:linear-gradient(90deg,rgba(2,5,7,.92) 0%,rgba(2,5,7,.6) 45%,transparent 70%);padding:22px 20px 18px;display:flex;flex-direction:column;justify-content:flex-end}
.theme-tech .tier-plain{display:block;order:-1;margin-bottom:auto;font:500 11px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--x-acc);padding-left:8px}
.theme-tech .tier-plain:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--x-acc);box-shadow:0 0 10px var(--x-acc);margin:0 8px 1px -8px;animation:xblink 2.4s ease-in-out infinite}
.theme-tech .bal-label{margin-top:0;font:500 10.5px var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--x-mut)}
.theme-tech .bal{font-family:var(--disp);font-weight:500;font-size:64px;letter-spacing:-.045em;line-height:1;font-variant-numeric:tabular-nums}
.theme-tech #pts{background:none;-webkit-background-clip:initial;background-clip:initial;color:var(--x-fg);-webkit-text-fill-color:currentColor;animation:xpulse 3.2s ease-in-out infinite}
.theme-tech #pts.pop{transform:none}.theme-tech #pts.tick{animation:xpulse 3.2s ease-in-out infinite}
.theme-tech .bal .unit{font-family:var(--mono);font-size:13px;font-weight:500;color:var(--x-acc);opacity:1;margin-left:6px}
.theme-tech .bal-val{font-family:var(--mono);color:var(--x-mut);font-size:12.5px;margin-top:2px}.theme-tech .bal-val b{color:var(--x-fg);font-weight:500}
.theme-tech .tx-row{display:flex;align-items:flex-end;gap:10px;margin-top:12px}
.theme-tech .tx-chips{display:flex;flex-wrap:nowrap;overflow:hidden;gap:6px;flex:1;min-width:0}
.chip-x{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:7px;border:1px solid var(--x-line2);background:rgba(2,8,10,.55);font:500 10.5px var(--mono);letter-spacing:.04em;color:var(--x-mut);white-space:nowrap;text-transform:uppercase}
.chip-x b{color:var(--x-fg);font-weight:600}
.chip-x i{width:5px;height:5px;border-radius:50%;background:var(--x-acc);box-shadow:0 0 8px var(--x-acc);animation:xblink 1.8s ease-in-out infinite}
.theme-tech .tx-spark-box{display:block;position:absolute;top:44px;right:18px;z-index:2;width:128px;padding:8px 10px 8px;border-radius:10px;border:1px solid var(--x-line2);background:rgba(2,8,10,.66);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.tx-spark-box span{display:block;font:500 8.5px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--x-mut)}
.tx-spark-box em{display:block;font:500 10.5px var(--mono);font-style:normal;color:var(--x-acc);margin-top:2px}
.theme-tech .tx-spark{display:block;width:100%;height:30px;margin-top:6px;overflow:visible;filter:drop-shadow(0 0 4px var(--x-glow))}
.sp-line{stroke-dasharray:400;stroke-dashoffset:400;animation:xdraw 1.6s .3s cubic-bezier(.2,.7,.2,1) forwards}
.sp-dot{animation:xblink 1.6s ease-in-out infinite}
/* tier: segmented dial below the hero */
.theme-tech .journey{border-radius:0 0 18px 18px;background:var(--x-surf);border:1px solid var(--x-line);border-top:1px solid var(--x-line);padding:16px 16px 16px;box-shadow:inset 0 0 30px var(--x-soft)}
.theme-tech .j-top,.theme-tech .track,.theme-tech .j-foot{display:none}
.theme-tech .tx-gauge{display:grid;grid-template-columns:132px 1fr;gap:16px;align-items:center}
.g-dial{position:relative;width:132px;height:132px}
.g-dial svg{width:100%;height:100%;overflow:visible}
.g-bg{fill:none;stroke:rgba(255,255,255,.08);stroke-width:9}
.g-on{fill:none;stroke:var(--x-acc);stroke-width:9;filter:drop-shadow(0 0 5px var(--x-glow));stroke-dasharray:200;stroke-dashoffset:200;animation:xdraw 1s var(--d,0s) cubic-bezier(.2,.7,.2,1) forwards}
.tk{stroke:rgba(255,255,255,.18);stroke-width:.8}.tk.M{stroke:var(--x-acc);stroke-width:1.2;opacity:.8}
.g-c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.g-c small{font:500 9px var(--mono);letter-spacing:.16em;color:var(--x-mut)}
.g-c b{font:600 19px var(--disp);letter-spacing:-.02em;margin:1px 0}
.g-c span{font:500 11px var(--mono);color:var(--x-acc)}
.g-k{font:500 10px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--x-mut)}
.g-next{font-size:14px;margin:3px 0 10px;color:var(--x-mut);line-height:1.3}.g-next b{color:var(--x-fg);font-family:var(--mono);font-weight:600}
.g-list{list-style:none;display:flex;flex-direction:column;gap:5px}
.g-list li{display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:8px;font:500 11.5px var(--mono);color:var(--x-mut);text-transform:uppercase;letter-spacing:.06em}
.g-list i{width:7px;height:7px;border:1px solid var(--x-line2);border-radius:2px}
.g-list li.got i{background:var(--x-acc);border-color:var(--x-acc);opacity:.6}
.g-list li.cur{color:var(--x-fg)}.g-list li.cur i{background:var(--x-acc);border-color:var(--x-acc);box-shadow:0 0 8px var(--x-acc)}
.g-list em{font-style:normal;opacity:.8}
/* actions */
.theme-tech .act{background:var(--x-surf);border:1px solid var(--x-line);border-radius:14px;font-weight:500;color:var(--x-fg)}
.theme-tech .act i{display:none}
/* inline SVG icon (no font glyph) in a small framed box, replaces the old empty square marker */
.theme-tech .act .ln{flex:none;width:20px;height:20px;padding:8px;box-sizing:content-box;border:1px solid var(--x-line2);border-radius:10px;color:var(--x-acc);filter:drop-shadow(0 0 4px var(--x-glow))}
.theme-tech .act-spin .spin-new{background:var(--x-acc);color:#041014;font-family:var(--mono);font-weight:600;border-radius:6px}
.theme-tech .act:active{transform:scale(.98)}
/* sections */
.theme-tech .sec h2{font-family:var(--disp);font-weight:600;font-size:18px;letter-spacing:-.02em}
.theme-tech .sec h2 small{font-family:var(--mono);color:var(--x-mut);font-weight:500;font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.theme-tech .slider-card{border-radius:16px;padding:18px}
.theme-tech .sl-out b{font-family:var(--mono);font-weight:500;font-size:28px;letter-spacing:-.02em;text-shadow:0 0 18px var(--x-glow)}
.theme-tech .sl-out span,.theme-tech .sl-top span{color:var(--x-mut)}.theme-tech .sl-out span{font-family:var(--mono)}
.theme-tech #slider{height:4px;background:linear-gradient(90deg,var(--x-acc) var(--p,0%),rgba(255,255,255,.1) var(--p,0%));margin:22px 0 20px;border-radius:2px}
.theme-tech #slider::-webkit-slider-thumb{width:20px;height:20px;background:#031014;border:2px solid var(--x-acc);box-shadow:0 0 12px var(--x-glow)}
.theme-tech #slider::-moz-range-thumb{width:20px;height:20px;background:#031014;border:2px solid var(--x-acc)}
/* reward tiles */
.theme-tech .cards{gap:12px}
.scard{position:relative;display:flex;flex-direction:column;background:var(--x-surf);border:1px solid var(--x-line);border-radius:16px;overflow:hidden;animation:xfade .5s ease both;box-shadow:inset 0 0 20px var(--x-soft)}
.sc-img{position:relative;flex:none;aspect-ratio:4/3;background:#020608;border-bottom:1px solid var(--x-line)}
.sc-img:after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 1px,transparent 1px 3px)}
.scard.locked .sc-img{opacity:.5;filter:saturate(.4)}
.sc-badge{position:absolute;top:8px;left:8px;z-index:1;font:600 10px var(--mono);letter-spacing:.06em;padding:3px 7px;border-radius:6px;background:rgba(2,8,10,.7);border:1px solid var(--x-line2);color:var(--x-acc)}
.scard.locked .sc-badge{color:var(--x-mut)}
.sc-body{flex:1;display:flex;flex-direction:column;padding:10px 12px 12px;position:relative}
.sc-title{font-weight:600;font-size:15px;line-height:1.2;min-height:2.4em;letter-spacing:-.01em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sc-sub{font-size:12px;color:var(--x-mut);line-height:1.35;min-height:1.35em;margin-top:2px}
.sc-cost{font:500 11.5px var(--mono);color:var(--x-fg);margin:8px 0 12px;opacity:.8;letter-spacing:.03em}
.sbtn{margin-top:auto;height:40px;border-radius:10px;background:transparent;color:var(--x-acc);border:1px solid var(--x-acc);box-shadow:inset 0 0 14px var(--x-soft),0 0 14px var(--x-soft);font:600 14px var(--font);cursor:pointer;transition:background .2s,color .2s}
.sbtn:hover,.sbtn:active{background:var(--x-acc);color:#031014}
.sc-need{margin-top:auto;height:40px;display:flex;flex-direction:column;justify-content:center;font:500 11.5px var(--mono);color:var(--x-mut);text-transform:uppercase;letter-spacing:.03em}
.sc-need i{display:block;height:3px;border-radius:2px;margin-top:7px;background:repeating-linear-gradient(90deg,transparent 0 3px,rgba(0,0,0,.6) 3px 4px),linear-gradient(90deg,var(--x-acc) var(--pr),rgba(255,255,255,.1) var(--pr))}
/* codes, earn, history */
.theme-tech .code{font-family:var(--mono);font-size:13.5px;letter-spacing:.08em;border:1px dashed var(--x-line2);background:rgba(0,0,0,.35);color:var(--x-acc);border-radius:10px}
.theme-tech .code-row{border-radius:14px}
.theme-tech .earn{background:transparent;border:0;border-bottom:1px solid var(--x-line);border-radius:0;padding:14px 2px;margin:0}
.theme-tech .earn .ic{background:transparent;border:1px solid var(--x-line2);border-radius:10px;width:40px;height:40px;color:var(--x-acc);box-shadow:inset 0 0 12px var(--x-soft)}
.theme-tech .earn .ic .ln{width:20px;height:20px}
.theme-tech .earn .v{font-family:var(--mono);font-weight:500;font-size:11.5px;text-transform:uppercase}
.theme-tech .earn.soon{opacity:.42}
.theme-tech .hist-card{border-radius:16px}
.theme-tech .hist .hd{font-family:var(--mono);font-size:11px;text-transform:uppercase}
.theme-tech .hist .hv{font-family:var(--mono);font-weight:500}
.theme-tech .hv.pos{color:var(--x-acc)}.theme-tech .hv.neg{color:var(--x-mut)}
.theme-tech .hist.new{animation:xfade .6s ease}
/* nav */
.theme-tech .nav{background:rgba(6,12,16,.86);border:1px solid var(--x-line2);border-radius:16px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 10px 40px rgba(0,0,0,.6),inset 0 0 20px var(--x-soft)}
.theme-tech .nav .nv{color:var(--x-mut);font-weight:500;font-size:10.5px;gap:4px;border-radius:10px;position:relative}
.theme-tech .nav .nv.on{background:transparent;color:var(--x-acc)}
.theme-tech .nav .nv.on .ln{filter:drop-shadow(0 0 6px var(--x-glow))}
.theme-tech .nav .nv.on:after{content:"";position:absolute;top:-9px;left:30%;right:30%;height:2px;border-radius:2px;background:var(--x-acc);box-shadow:0 0 10px var(--x-acc)}
/* sheets, toast */
.theme-tech .sheet{background:rgba(0,4,6,.7);backdrop-filter:blur(4px)}
.theme-tech .sheet-card{background:#071015;border:1px solid var(--x-line2);border-bottom:0;border-radius:18px 18px 0 0;animation:xup .35s cubic-bezier(.2,.7,.2,1);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 -10px 40px var(--x-soft)}
.theme-tech .sheet-card h3{font-family:var(--disp);font-weight:600;font-size:26px;letter-spacing:-.02em}
.theme-tech .sheet-card .k{font-family:var(--mono);color:var(--x-acc);font-weight:500;letter-spacing:.14em;text-transform:uppercase;font-size:11px}
.theme-tech .sheet-card .row b{font-family:var(--mono);font-weight:500}
.theme-tech .amounts button{background:transparent;border:1px solid var(--x-line2);border-radius:10px;font-family:var(--mono)}
.theme-tech .amounts button.sel{background:var(--x-acc);color:#031014;border-color:var(--x-acc)}
.theme-tech .toast{background:#071015;border:1px solid var(--x-line2);border-radius:12px;font-family:var(--mono);font-size:13px}
.theme-tech .fine{font-family:var(--mono);font-size:11px}
/* profile in tech */
.theme-tech .profile{background:rgba(3,6,8,.97)}
.theme-tech .pf-top h2{font-family:var(--disp);font-weight:600;letter-spacing:-.02em}
.theme-tech .pf-back{background:transparent;border:1px solid var(--x-line2);border-radius:12px;color:var(--x-acc)}
.theme-tech .pf-av{background:transparent;color:var(--x-acc);border:1px solid var(--x-acc);border-radius:14px;font:500 22px var(--mono);box-shadow:inset 0 0 16px var(--x-soft),0 0 16px var(--x-soft)}
.theme-tech .pf-id span{font-family:var(--mono);font-size:12px}
.theme-tech .pf-stats{background:var(--x-line)!important;border-radius:16px}
.theme-tech .pf-stats div{background:#071015}
.theme-tech .pf-stats span{font:500 9.5px var(--mono);letter-spacing:.14em}
.theme-tech .pf-stats b{font:500 14px var(--mono)}
.theme-tech .pf-group{border-radius:16px}
.theme-tech .pf-soon{font-family:var(--mono);font-weight:500;background:transparent;border:1px solid var(--x-line2);color:var(--x-mut)}
.theme-tech .seg{background:rgba(0,0,0,.35);border:1px solid var(--x-line);border-radius:12px}
.theme-tech .seg button{border-radius:9px;font:500 13px var(--font);color:var(--x-mut)}
.theme-tech .seg button.on{background:var(--x-soft);color:var(--x-acc);box-shadow:inset 0 0 0 1px var(--x-acc),0 0 14px var(--x-soft)}
@keyframes xfade{from{opacity:0;transform:translateY(6px)}}
@keyframes xup{from{transform:translateY(24px);opacity:0}}
@keyframes xdraw{to{stroke-dashoffset:0}}
@keyframes xblink{50%{opacity:.35}}
@keyframes xpulse{0%,100%{text-shadow:0 0 0 transparent}50%{text-shadow:0 0 22px var(--x-glow)}}
@media (prefers-reduced-motion:reduce){.theme-tech *{animation:none!important}.sp-line,.g-on{stroke-dashoffset:0}}
/* late overrides */
.profile{background:#05060b}
.theme-tech .profile{background:#03070a;background-image:linear-gradient(var(--x-line) 1px,transparent 1px),linear-gradient(90deg,var(--x-line) 1px,transparent 1px);background-size:32px 32px}
.tank-fresh .blobs i:nth-child(1){background:#1fa36a}
.tank-fresh .blobs i:nth-child(2){background:#1b6f7a}
.tank-fresh .blobs i:nth-child(3){background:#9bd34a;opacity:.12}

/* holographic hero canvas + tile art */
.theme-tech .holo{display:block;position:absolute;inset:0;width:100%;height:100%}
.hx-svg{display:block;width:100%;height:100%;color:var(--x-acc)}
.hx-svg .hart{fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 2.5px var(--x-glow))}
.hx-svg .ha{stroke-width:.9;opacity:.6}
.hx-svg .ht{fill:currentColor;stroke:none}
.hx-svg .hgr{fill:none;stroke:var(--x-line);stroke-width:.6}
.hx-svg .hrs0{stop-color:var(--x-acc);stop-opacity:.16}.hx-svg .hrs1{stop-color:var(--x-acc);stop-opacity:0}
.hx-svg .hrings{fill:none;stroke:var(--x-acc);stroke-width:.6;opacity:.22;stroke-dasharray:2 3}
.hx-svg .hfl{stroke:var(--x-acc);stroke-width:.8;opacity:.45}
.hx-svg .hcorner{fill:none;stroke:var(--x-acc);stroke-width:1;opacity:.6}
.hx-svg .hscan{fill:var(--x-acc);opacity:.0}
.theme-tech .scard.can .hscan{animation:hscan 4.5s linear infinite}
.hp{animation:hpulse 3.4s ease-in-out infinite;animation-delay:calc(var(--i,0) * -.45s)}
.hw{animation:hwave 3s ease-in-out infinite;animation-delay:calc(var(--i,0) * -.3s);transform-box:fill-box;transform-origin:bottom center}
.hf{animation:hfloat 5s ease-in-out infinite;animation-delay:calc(var(--i,0) * -1.1s)}
.hsw{animation:hsway 6s ease-in-out infinite;transform-origin:80px 110px}
.scard.locked .hp,.scard.locked .hw,.scard.locked .hf,.scard.locked .hsw{animation:none}
@keyframes hscan{0%{transform:translateY(0);opacity:0}10%{opacity:.35}90%{opacity:.35}100%{transform:translateY(118px);opacity:0}}
@keyframes hpulse{50%{opacity:.6;transform:scale(.94)}}
@keyframes hwave{50%{transform:rotate(6deg)}}
@keyframes hfloat{50%{transform:translate(3px,-3px)}}
@keyframes hsway{50%{transform:rotate(2.5deg)}}
@media (prefers-reduced-motion:reduce){.hp,.hw,.hf,.hsw,.hscan{animation:none!important}}