
/* LAS3R PROJ3CTIL3S 1.0.0 — cabinet styles. Everything lives under .tlt-l3 / #l3-app; the theme-proof block is at the end.
   His pictures arrive as CSS variables on the wrap (set by the shortcode): --l3-surround, --l3-panel, --l3-card, --l3-throw-*, --l3-vel-*. */
/* ---- 3RDS cabinet: bleed past Twenty Twenty-Five's global padding, paint the page dark ---- */
.has-global-padding > [data-tlt-cabinet],
.has-global-padding > .tlt-arcade-wide { margin-left: calc(var(--wp--style--root--padding-left, 30px) * -1) !important; margin-right: calc(var(--wp--style--root--padding-right, 30px) * -1) !important; max-width: none !important; width: auto !important; }
html.tlt3rds-cabinet-page, html.tlt3rds-cabinet-page body, body:has([data-tlt-cabinet]) { background: #05070d !important; }
html.tlt3rds-cabinet-page .wp-site-blocks, html.tlt3rds-cabinet-page .entry-content { background: #05070d; }
html.tlt3rds-cabinet-page .entry-content { margin-block: 0 !important; padding-block: 0 !important; }
@media (max-width: 720px) { [data-tlt-cabinet] { border-radius: 0 !important; border-left: 0 !important; border-right: 0 !important; } }

.tlt-l3{
  --ground:#05070D; --navy:#0B1233; --graphite:#151A24;
  --chalk:#F4EFE6; --chalk-dim:rgba(244,239,230,.55); --edge:rgba(190,220,255,.18); --glass:rgba(190,220,255,.05);
  --cyan:#3EE6FF; --cyan-hi:#9BF3FF; --gold:#E1B457; --gold-hi:#F5D67A; --magenta:#D14CFF; --red:#E3434B; --amber:#FFB238;
  --display:"Barlow Condensed","Arial Narrow",Impact,"Helvetica Neue",Arial,sans-serif;
  --mono:"Share Tech Mono","SF Mono",Menlo,Consolas,monospace;
  --s:1; --l3-h:900px;
  background:var(--ground); color:var(--chalk); font-family:var(--display);
  -webkit-user-select:none; user-select:none; -webkit-tap-highlight-color:transparent;
  position:relative; box-sizing:border-box; border-radius:12px; overflow:hidden;
}
.tlt-l3[data-tlt-arcade]{padding:0}
.tlt-l3 *,.tlt-l3 *::before,.tlt-l3 *::after{box-sizing:border-box}
#l3-app [hidden]{display:none!important}
#l3-app{height:clamp(560px,calc(100vh - 110px),960px);height:clamp(560px,calc(100svh - 110px),960px);display:flex;flex-direction:column;gap:8px;padding:0 16px 12px;touch-action:none;box-sizing:border-box;
  background:radial-gradient(120% 70% at 50% 0%,#101a3a 0%,#070a16 55%,var(--ground) 100%);color:var(--chalk);font-family:var(--display)}
/* the desktop surround (his render) on screens 900 px and wider */
@media (min-width:900px){#l3-app{background:linear-gradient(180deg,rgba(5,7,13,.35),rgba(5,7,13,.55)),var(--l3-surround,none) center/cover no-repeat,#05070d}}
/* the cabinet is #l3-app itself: the fixed overlay, or real fullscreen; sized from its own box */
#l3-app.l3-cabinet{position:fixed;inset:0;z-index:2147483000;height:auto;max-width:none;margin:0;border-radius:0}
#l3-app:fullscreen{height:100%;width:100%;max-width:none;border-radius:0}
#l3-app #l3-stage{position:relative;flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center}
#l3-app #l3-canvas{display:block;background:#04060c;border:1px solid var(--edge);border-radius:8px;outline:none;touch-action:none;max-width:100%;box-shadow:0 14px 44px rgba(0,0,0,.6)}
#l3-app #l3-canvas:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
#l3-app #l3-canvas.l3-aiming{cursor:none}

/* ---- the throwing controls: one broad velocity slider, one big THROW, a small pause ---- */
#l3-app #l3-controls{flex:0 0 auto;display:grid;grid-template-columns:1fr;gap:8px;margin:0 auto;width:100%;max-width:560px;touch-action:none}
#l3-app #l3-controls.l3-wide{grid-template-columns:1.35fr 1fr;align-items:center;max-width:1120px}
#l3-app .l3-vel{display:grid;grid-template-columns:auto 1fr 52px;align-items:center;gap:12px;padding:8px 14px;border:1px solid var(--edge);border-radius:12px;
  background:linear-gradient(180deg,rgba(20,28,52,.85),rgba(7,10,22,.9));box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
#l3-app .l3-vel label{font:600 15px/1 var(--display);letter-spacing:.14em;color:var(--chalk)}
#l3-app .l3-vel label b{color:var(--gold-hi);font-weight:800}
#l3-app .l3-vel output{font:18px/1 var(--mono);color:var(--chalk);text-align:right}
#l3-app #l3-velbar{position:relative;height:36px;min-width:0}
#l3-app #l3-velbar .l3-vt,#l3-app #l3-velbar .l3-vf{position:absolute;left:0;right:0;top:50%;height:22px;transform:translateY(-50%);background:var(--l3-vel-track,none) center/100% 100% no-repeat}
#l3-app #l3-velbar .l3-vf{right:auto;width:var(--fill,62%);overflow:hidden;background:none}
#l3-app #l3-velbar .l3-vf i{position:absolute;left:0;top:0;bottom:0;width:var(--l3-velw,400px);background:var(--l3-vel-fill,linear-gradient(90deg,#0fb7d6,#3ee6ff)) left center/100% 100% no-repeat}
#l3-app #l3-velbar .l3-vh{position:absolute;top:50%;left:var(--fill,62%);width:24px;height:38px;transform:translate(-50%,-50%);background:var(--l3-vel-handle,linear-gradient(180deg,#fff1c2,#e1b457 55%,#a97c2c)) center/contain no-repeat;pointer-events:none;filter:drop-shadow(0 0 8px rgba(245,214,122,.6))}
#l3-app #l3-vel{-webkit-appearance:none;appearance:none;position:absolute;inset:0;width:100%;height:36px;background:transparent;margin:0;touch-action:none;cursor:pointer;opacity:0}
#l3-app #l3-vel::-webkit-slider-runnable-track{height:12px;border-radius:7px;border:1px solid rgba(155,243,255,.35);
  background:linear-gradient(90deg,#0fb7d6 0%,var(--cyan) var(--fill,62%),rgba(12,18,34,.95) var(--fill,62%))}
#l3-app #l3-vel::-moz-range-track{height:12px;border-radius:7px;border:1px solid rgba(155,243,255,.35);background:rgba(12,18,34,.95)}
#l3-app #l3-vel::-moz-range-progress{height:12px;border-radius:7px;background:linear-gradient(90deg,#0fb7d6,var(--cyan))}
#l3-app #l3-vel::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:34px;margin-top:-12px;border-radius:5px;border:1px solid #fff3cf;
  background:linear-gradient(180deg,#fff1c2,#e1b457 55%,#a97c2c);box-shadow:0 0 12px rgba(245,214,122,.7)}
#l3-app #l3-vel::-moz-range-thumb{width:22px;height:34px;border-radius:5px;border:1px solid #fff3cf;background:linear-gradient(180deg,#fff1c2,#e1b457 55%,#a97c2c)}
#l3-app .l3-btns{display:grid;grid-template-columns:56px 1fr;gap:8px}
#l3-app #l3-throw{font:800 30px/1 var(--display);letter-spacing:.2em;color:var(--gold-hi);border:0;border-radius:0;min-height:58px;cursor:pointer;
  background:var(--l3-throw-ready,linear-gradient(180deg,#1b2442,#0a0f20 60%,#060913)) center/100% 100% no-repeat;text-shadow:0 0 14px rgba(245,214,122,.85)}
#l3-app #l3-throw:disabled{background-image:var(--l3-throw-wait,none)}
#l3-app #l3-throw:not(:disabled):active,#l3-app #l3-throw.l3-press{background-image:var(--l3-throw-press,none)}
#l3-app #l3-throw.l3-hot{animation:l3-hot 1.2s ease-in-out infinite}
@keyframes l3-hot{0%,100%{filter:brightness(1)}50%{filter:brightness(1.35)}}
#l3-app #l3-throw:disabled{opacity:.38;cursor:default;text-shadow:none}
#l3-app #l3-pausebtn{display:flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--edge);border-radius:12px;cursor:pointer;min-height:58px;
  background:linear-gradient(180deg,rgba(20,28,52,.85),rgba(7,10,22,.9))}
#l3-app #l3-pausebtn i{display:block;width:6px;height:20px;border-radius:2px;background:var(--chalk-dim)}
#l3-app #l3-throw:focus-visible,#l3-app #l3-pausebtn:focus-visible,#l3-app #l3-vel:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

/* ---- entry panel over the title screen (smoked glass, scaled with the canvas) ---- */
#l3-app #l3-entry{position:absolute;display:flex;flex-direction:column;align-items:center;gap:calc(var(--s) * 9px);padding:calc(var(--s) * 14px) calc(var(--s) * 20px) calc(var(--s) * 16px);

  background:linear-gradient(180deg,rgba(12,18,38,.82),rgba(5,7,14,.8));border:1px solid var(--edge);border-radius:calc(var(--s) * 16px);touch-action:auto;
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 16px 44px rgba(0,0,0,.6)}
#l3-app #l3-entry label{font:600 max(11px,calc(var(--s) * 14px))/1 var(--display);letter-spacing:.18em;text-transform:uppercase;color:var(--gold-hi)}
#l3-app #l3-name{width:100%;max-width:calc(var(--s) * 380px);text-align:center;font:max(16px,calc(var(--s) * 23px))/1.2 var(--mono);letter-spacing:.04em;color:var(--chalk);background:rgba(0,0,0,.5);
  border:1px solid rgba(190,220,255,.18);border-radius:calc(var(--s) * 9px);padding:calc(var(--s) * 9px) calc(var(--s) * 12px);outline:none;caret-color:var(--gold);-webkit-user-select:text;user-select:text;box-shadow:inset 0 2px 6px rgba(0,0,0,.5)}
#l3-app #l3-name::placeholder{color:rgba(244,239,230,.3)}
#l3-app #l3-name:focus{border-color:var(--gold);box-shadow:inset 0 2px 6px rgba(0,0,0,.5),0 0 0 calc(var(--s) * 3px) rgba(225,180,87,.18)}
#l3-app #l3-rule{display:none}
#l3-app #l3-hint{font:600 max(11px,calc(var(--s) * 13px))/1 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--amber);text-align:center}
#l3-app .l3-seg{display:grid;grid-template-columns:1fr 1fr 1fr;gap:calc(var(--s) * 6px);width:100%;max-width:calc(var(--s) * 380px)}
#l3-app .l3-tier,#l3-app .l3-mode{font:800 max(12px,calc(var(--s) * 16px))/1 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--chalk-dim);background:rgba(0,0,0,.45);
  border:1px solid rgba(190,220,255,.14);border-radius:calc(var(--s) * 9px);padding:max(9px,calc(var(--s) * 11px)) 0;cursor:pointer}
#l3-app .l3-mode{font-size:max(11px,calc(var(--s) * 14px))}
#l3-app .l3-tier:hover,#l3-app .l3-mode:hover{color:var(--chalk);border-color:var(--chalk-dim)}
#l3-app .l3-tier[aria-pressed="true"]{color:#FFF6DC;border-color:var(--gold-hi);background:linear-gradient(180deg,rgba(225,180,87,.36),rgba(30,40,80,.4));box-shadow:0 0 calc(var(--s) * 12px) rgba(225,180,87,.35)}
#l3-app .l3-mode[aria-pressed="true"]{color:#E9FDFF;border-color:var(--cyan-hi);background:linear-gradient(180deg,rgba(62,230,255,.26),rgba(20,30,70,.4));box-shadow:0 0 calc(var(--s) * 12px) rgba(62,230,255,.3)}
#l3-app #l3-tier-note{font:max(11px,calc(var(--s) * 12px))/1.3 var(--mono);color:var(--chalk-dim);text-align:center;min-height:calc(var(--s) * 16px)}
#l3-app #l3-run{font:800 max(18px,calc(var(--s) * 28px))/1 var(--display);letter-spacing:.14em;white-space:nowrap;color:var(--gold-hi);border:calc(var(--s) * 2px) solid var(--gold-hi);border-radius:calc(var(--s) * 12px);
  padding:max(11px,calc(var(--s) * 13px)) calc(var(--s) * 40px);cursor:pointer;margin-top:calc(var(--s) * 2px);min-width:calc(var(--s) * 280px);
  background:linear-gradient(180deg,#1f2a4d,#0b1022 60%,#070a15);text-shadow:0 0 calc(var(--s) * 12px) rgba(245,214,122,.9);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 0 calc(var(--s) * 22px) rgba(62,230,255,.14),0 0 calc(var(--s) * 20px) rgba(225,180,87,.45)}
#l3-app #l3-run:hover{background:linear-gradient(180deg,#283663,#0f1630 60%,#090d1b)}
#l3-app #l3-run:disabled{opacity:.42;pointer-events:none;cursor:default;text-shadow:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}
#l3-app #l3-sub{font:600 max(11px,calc(var(--s) * 13px))/1 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--chalk-dim);background:none;border:0;cursor:pointer;padding:calc(var(--s) * 4px) calc(var(--s) * 10px);text-decoration:underline;text-underline-offset:3px}
#l3-app #l3-sub:hover{color:var(--chalk)}
#l3-app #l3-best{font:max(12px,calc(var(--s) * 13px))/1 var(--mono);letter-spacing:.08em;color:var(--chalk-dim);text-align:center}
#l3-app .l3-tier:focus-visible,#l3-app .l3-mode:focus-visible,#l3-app #l3-run:focus-visible,#l3-app #l3-sub:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

/* ---- pause + practice chips ---- */
#l3-app #l3-pause{position:absolute;display:flex;gap:calc(var(--s) * 10px);touch-action:auto}
#l3-app #l3-pause button,#l3-app #l3-practice button{flex:1 1 0;font:800 max(13px,calc(var(--s) * 18px))/1 var(--display);letter-spacing:.12em;text-transform:uppercase;border-radius:calc(var(--s) * 10px);
  padding:max(10px,calc(var(--s) * 13px)) 0;cursor:pointer;color:var(--chalk-dim);background:linear-gradient(180deg,rgba(14,20,40,.9),rgba(5,7,14,.88));border:1px solid var(--edge)}
#l3-app #l3-pause button:hover,#l3-app #l3-practice button:hover{color:var(--chalk);border-color:var(--chalk-dim)}
#l3-app #l3-pause #l3-resume{color:var(--gold-hi);border:calc(var(--s) * 2px) solid var(--gold-hi);text-shadow:0 0 calc(var(--s) * 8px) rgba(245,214,122,.8)}
#l3-app #l3-practice{position:absolute;display:flex;gap:calc(var(--s) * 8px);touch-action:auto}
#l3-app #l3-practice button{font-size:max(11px,calc(var(--s) * 14px));padding:max(8px,calc(var(--s) * 9px)) 0}
#l3-app #l3-practice button[aria-pressed="true"]{color:#E9FDFF;border-color:var(--cyan-hi)}
#l3-app #l3-pause button:focus-visible,#l3-app #l3-practice button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

/* ---- TOP 100 + City Cup panels (smoked glass over the results screen) ---- */
#l3-app #l3-board,#l3-app #l3-cup{position:absolute;display:flex;flex-direction:column;overflow:hidden;touch-action:auto;
  background:linear-gradient(180deg,rgba(12,18,38,.88),rgba(5,7,14,.86));border:1px solid var(--edge);border-radius:calc(var(--s) * 14px);

  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 16px 44px rgba(0,0,0,.6)}
#l3-app .l3-bh{display:flex;justify-content:space-between;align-items:baseline;padding:calc(var(--s) * 12px) calc(var(--s) * 16px) calc(var(--s) * 9px);border-bottom:1px solid var(--edge)}
#l3-app .l3-bh b{font:800 max(17px,calc(var(--s) * 22px))/1 var(--display);letter-spacing:.12em;color:var(--chalk)}
#l3-app .l3-bh span{font:max(11px,calc(var(--s) * 12px))/1 var(--mono);letter-spacing:.06em;color:var(--chalk-dim)}
#l3-app #l3-land,#l3-app #l3-cup-next{padding:calc(var(--s) * 8px) calc(var(--s) * 16px);font:600 max(12px,calc(var(--s) * 15px))/1.25 var(--display);letter-spacing:.1em;text-transform:uppercase;color:var(--gold-hi);text-align:center;border-bottom:1px solid var(--edge)}
#l3-app #l3-cup-next{border-bottom:0;border-top:1px solid var(--edge);color:var(--cyan-hi)}
#l3-app #l3-listwrap{position:relative;flex:1 1 auto;min-height:0;overflow:hidden}
#l3-app #l3-list{position:relative;height:100%;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:rgba(244,239,230,.25) transparent}
#l3-app #l3-fall{position:absolute;left:0;right:0;top:0;pointer-events:none;will-change:transform;box-shadow:0 10px 26px rgba(0,0,0,.6);background:linear-gradient(90deg,rgba(225,180,87,.36),rgba(62,230,255,.18)),#0E121A}
#l3-app #l3-fall::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:var(--trail,0px);background:linear-gradient(180deg,rgba(225,180,87,0),rgba(225,180,87,.35));pointer-events:none}
#l3-app #l3-fx{position:absolute;inset:0;pointer-events:none;overflow:hidden}
#l3-app #l3-fx i{position:absolute;display:block;border-radius:50%;will-change:transform,opacity}
#l3-app .l3-ground{height:0;margin:max(10px,calc(var(--s) * 14px)) calc(var(--s) * 16px) max(8px,calc(var(--s) * 10px));border-top:2px solid rgba(244,239,230,.55)}
#l3-app .l3-ground.l3-cracked{border-top:0;height:3px;background:repeating-linear-gradient(-35deg,rgba(255,92,100,.9) 0 6px,transparent 6px 10px,rgba(244,239,230,.6) 10px 13px,transparent 13px 19px)}
#l3-app .l3-row{display:grid;grid-template-columns:max(34px,calc(var(--s) * 44px)) 1fr auto;align-items:center;gap:max(8px,calc(var(--s) * 10px));padding:max(6px,calc(var(--s) * 7px)) calc(var(--s) * 16px);
  font:max(13px,calc(var(--s) * 15px))/1 var(--mono);color:var(--chalk-dim);border-bottom:1px solid rgba(244,239,230,.06)}
#l3-app .l3-row .l3-rk{color:rgba(244,239,230,.4);text-align:right}
#l3-app .l3-row .l3-hd{color:var(--chalk);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#l3-app .l3-row .l3-pt{color:var(--amber);font-variant-numeric:tabular-nums}
#l3-app .l3-row.l3-top3 .l3-rk,#l3-app .l3-row.l3-top3 .l3-hd{color:var(--gold)}
#l3-app .l3-row.l3-you{background:linear-gradient(90deg,rgba(225,180,87,.32),rgba(62,230,255,.16));border-top:1px solid rgba(245,214,122,.55);border-bottom:1px solid rgba(245,214,122,.55)}
#l3-app .l3-row.l3-you .l3-rk,#l3-app .l3-row.l3-you .l3-hd{color:#FFF6DC}
#l3-app .l3-row.l3-you .l3-pt{color:#FFE9A8}
#l3-app .l3-row.l3-you i{display:inline-block;margin-left:.6em;padding:.15em .45em;border-radius:.4em;font:800 .72em/1 var(--display);letter-spacing:.14em;color:#1a1405;background:var(--gold-hi);vertical-align:middle;font-style:normal}
#l3-app .l3-row.l3-off{opacity:.45}
#l3-app .l3-row.l3-crashed{transform:rotate(-1.4deg) translateY(2px);border-color:rgba(227,67,75,.7);background:linear-gradient(90deg,rgba(227,67,75,.32),rgba(62,10,15,.5))}
#l3-app .l3-row.l3-crashed .l3-pt{color:#FF9AA0}
@keyframes l3-thud{0%{transform:translateY(0)}30%{transform:translateY(7px)}60%{transform:translateY(-3px)}100%{transform:translateY(0)}}
@keyframes l3-crash{0%{transform:translate(0,0)}18%{transform:translate(-4px,12px) rotate(-.4deg)}40%{transform:translate(5px,-5px) rotate(.3deg)}62%{transform:translate(-3px,4px)}82%{transform:translate(2px,-2px)}100%{transform:translate(0,0)}}
@keyframes l3-pop{0%{transform:scale(1.6)}100%{transform:scale(1)}}
@keyframes l3-flash{0%{background:rgba(255,92,100,.75)}100%{background:transparent}}
#l3-app #l3-board.l3-thud{animation:l3-thud .3s ease-out}
#l3-app #l3-board.l3-crash{animation:l3-crash .5s ease-out}
#l3-app .l3-row.l3-you.l3-landed i{animation:l3-pop .35s ease-out}
#l3-app #l3-listwrap.l3-flash::after{content:"";position:absolute;inset:0;pointer-events:none;animation:l3-flash .5s ease-out forwards}
#l3-app .l3-bf{display:flex;gap:calc(var(--s) * 10px);padding:calc(var(--s) * 10px) calc(var(--s) * 16px) calc(var(--s) * 12px);border-top:1px solid var(--edge)}
#l3-app .l3-bf button{flex:1 1 0;white-space:nowrap;font:800 max(12px,calc(var(--s) * 15px))/1 var(--display);letter-spacing:.08em;text-transform:uppercase;border-radius:calc(var(--s) * 10px);padding:max(10px,calc(var(--s) * 12px)) 0;cursor:pointer;
  color:var(--chalk-dim);background:linear-gradient(180deg,rgba(190,220,255,.10),rgba(190,220,255,.03));border:1px solid var(--edge)}
#l3-app .l3-bf button:hover{color:var(--chalk);border-color:var(--chalk-dim)}
#l3-app #l3-again,#l3-app #l3-cup-go{flex-grow:1.4;color:var(--gold-hi);border:calc(var(--s) * 2px) solid var(--gold-hi);background:linear-gradient(180deg,#1f2a4d,#0b1022 60%,#070a15);text-shadow:0 0 calc(var(--s) * 8px) rgba(245,214,122,.85)}
#l3-app .l3-bf button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
/* the bracket */
#l3-app #l3-cup-body{flex:1 1 auto;min-height:0;overflow-y:auto;padding:calc(var(--s) * 6px) calc(var(--s) * 14px);touch-action:pan-y}
#l3-app .l3-stage-h{font:800 max(11px,calc(var(--s) * 13px))/1 var(--display);letter-spacing:.2em;color:var(--gold-hi);margin:calc(var(--s) * 10px) 0 calc(var(--s) * 5px)}
#l3-app .l3-m{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:calc(var(--s) * 8px);padding:max(6px,calc(var(--s) * 7px)) calc(var(--s) * 10px);margin-bottom:calc(var(--s) * 5px);
  border:1px solid rgba(190,220,255,.1);border-radius:calc(var(--s) * 8px);background:rgba(0,0,0,.35);font:max(12px,calc(var(--s) * 14px))/1.1 var(--mono);color:var(--chalk-dim)}
#l3-app .l3-m .l3-a{text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#l3-app .l3-m .l3-b{text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#l3-app .l3-m .l3-sc{color:var(--amber);white-space:nowrap}
#l3-app .l3-m .l3-w{color:var(--chalk)}
#l3-app .l3-m.l3-mine{border-color:rgba(245,214,122,.5);background:linear-gradient(90deg,rgba(225,180,87,.16),rgba(62,230,255,.08))}
#l3-app .l3-m.l3-next{border-color:rgba(155,243,255,.6);box-shadow:0 0 calc(var(--s) * 10px) rgba(62,230,255,.25)}
#l3-app .l3-m .l3-you-tag{color:var(--gold-hi)}

/* ---- the wrapper chrome: bar + chips + cabinet mode ---- */
.tlt-l3 .l3-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0;border:0;padding:10px 16px 0;font:600 12px/1 var(--display);letter-spacing:.18em;text-transform:uppercase;color:var(--gold-hi)}
.tlt-l3 .l3-cab{font:800 12px/1 var(--display)!important;letter-spacing:.14em!important;text-transform:uppercase!important;color:var(--chalk)!important;background:linear-gradient(180deg,rgba(190,220,255,.10),rgba(190,220,255,.03))!important;border:1px solid var(--edge)!important;border-radius:9px!important;padding:8px 12px!important;cursor:pointer;box-shadow:none!important;text-shadow:none!important;margin:0!important;min-height:0!important;line-height:1!important;white-space:nowrap;flex:0 0 auto}
.tlt-l3 .l3-cab:hover{border-color:var(--gold-hi)!important;color:var(--gold-hi)!important}
.tlt-l3 .l3-bar span{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tlt-l3 .l3-bar em{font-style:normal}
.tlt-l3 .l3-bar .l3-chips{display:flex;gap:8px;flex:0 0 auto;margin:0;padding:0}
@media (max-width:640px){.tlt-l3 .l3-bar .l3-pre{display:none}}
.tlt-l3 #l3-app .l3-bar{flex:0 0 auto;padding:8px 0 0}
.tlt-l3 .l3-note{padding:8px 16px 14px;font:600 11px/1 var(--display);letter-spacing:.2em;text-transform:uppercase;color:rgba(244,239,230,.4);text-align:center}

/* ---- theme-proofing: what the host theme must not touch ---- */
.tlt-l3 #l3-app button{-webkit-appearance:none;appearance:none;text-decoration:none;margin:0;line-height:1}
.tlt-l3 #l3-app input[type="text"]{-webkit-appearance:none;appearance:none;margin:0;text-decoration:none}
.tlt-l3 #l3-app div,.tlt-l3 #l3-app section,.tlt-l3 #l3-app form{margin:0}
.tlt-l3 #l3-app .l3-tier,.tlt-l3 #l3-app .l3-mode{font-family:var(--display)!important;color:var(--chalk-dim)!important;background:rgba(0,0,0,.45)!important;border:1px solid rgba(190,220,255,.14)!important;font-weight:800!important;text-transform:uppercase!important}
.tlt-l3 #l3-app .l3-tier[aria-pressed="true"]{color:#FFF6DC!important;border-color:var(--gold-hi)!important;background:linear-gradient(180deg,rgba(225,180,87,.36),rgba(30,40,80,.4))!important}
.tlt-l3 #l3-app .l3-mode[aria-pressed="true"]{color:#E9FDFF!important;border-color:var(--cyan-hi)!important;background:linear-gradient(180deg,rgba(62,230,255,.26),rgba(20,30,70,.4))!important}
.tlt-l3 #l3-app #l3-run,.tlt-l3 #l3-app #l3-again,.tlt-l3 #l3-app #l3-cup-go,.tlt-l3 #l3-app #l3-throw{font-family:var(--display)!important;color:var(--gold-hi)!important;background:linear-gradient(180deg,#1f2a4d,#0b1022 60%,#070a15)!important;border:2px solid var(--gold-hi)!important;text-transform:uppercase!important;font-weight:800!important}
.tlt-l3 #l3-app #l3-run:disabled{opacity:.42!important;pointer-events:none!important}
.tlt-l3 #l3-app #l3-throw:disabled{opacity:.38!important}
.tlt-l3 #l3-app #l3-name{color:var(--chalk)!important;background:rgba(0,0,0,.5)!important;border:1px solid rgba(190,220,255,.18)!important;font-family:var(--mono)!important;text-align:center!important}
.tlt-l3 #l3-app label{color:var(--gold-hi)!important;font-family:var(--display)!important;margin:0!important}
.tlt-l3 #l3-app .l3-vel label{color:var(--chalk)!important}
.tlt-l3 #l3-app #l3-canvas{max-width:100%!important;margin:0!important;padding:0!important}
.tlt-l3 #l3-app .l3-row,.tlt-l3 #l3-app .l3-row *,.tlt-l3 #l3-app .l3-m,.tlt-l3 #l3-app .l3-m *{font-family:var(--mono)!important;line-height:1.1!important}
.tlt-l3 #l3-app .l3-row i{font-family:var(--display)!important}
.tlt-l3 #l3-app .l3-bf button,.tlt-l3 #l3-app #l3-pause button,.tlt-l3 #l3-app #l3-practice button{font-family:var(--display)!important}

/* phones: edge to edge, 44 px tap targets, one screen tall */
@media (max-width:720px){
  .tlt-l3{border-radius:0;max-width:none}
  .tlt-l3 #l3-app{gap:6px}
  .tlt-l3 #l3-app #l3-canvas{border-radius:0!important;border-left:0!important;border-right:0!important}
  .tlt-l3 #l3-app #l3-controls{padding:0 10px}
  .tlt-l3 .l3-bar{flex-wrap:wrap;row-gap:6px;padding:8px 12px 0}
  .tlt-l3 .l3-cab{min-height:44px!important}
  .tlt-l3 #l3-app .l3-tier,.tlt-l3 #l3-app .l3-mode,.tlt-l3 #l3-app #l3-run,.tlt-l3 #l3-app .l3-bf button,.tlt-l3 #l3-app #l3-pause button,.tlt-l3 #l3-app #l3-practice button,.tlt-l3 #l3-app .t3r-rules__ok,.tlt-l3 #l3-app #l3-name{min-height:44px!important}
  .tlt-l3 #l3-app .t3r-rules__x{min-height:44px!important;min-width:44px!important}
  .tlt-l3 #l3-app .l3-bar span{display:none}
  .tlt-l3 #l3-app .l3-bar .l3-chips{margin-left:auto}
  .tlt-l3 #l3-app{padding:0 0 8px}
  .tlt-l3 #l3-app .l3-bar{padding:6px 10px 0}
  #l3-app .l3-vel{padding:4px 12px;gap:10px}
  #l3-app #l3-throw,#l3-app #l3-pausebtn{min-height:54px}
}
@media (max-width:640px){.tlt-l3 #l3-app:not(.l3-cabinet){height:calc(100vh - 56px);height:calc(100svh - 56px);min-height:560px}}

/* ---- RULES drop-down (the shared t3r- pattern): the display font on the head, gold on the OK button ---- */
.t3r-rules-btn { font: inherit; letter-spacing: .12em; text-transform: uppercase; }
.t3r-rules { position: fixed; inset: 0; z-index: 9000; background: rgba(3,4,8,.82); backdrop-filter: blur(6px); display: flex; align-items: center; justify-content: center; padding: 16px; touch-action: auto; }
.t3r-rules[hidden] { display: none; }
.t3r-rules__panel { --t3r-accent: #F5D67A; --t3r-font: "Barlow Condensed","Arial Narrow",Impact,"Helvetica Neue",Arial,sans-serif; width: min(460px, 100%); max-height: 86vh; overflow: auto; background: #0b0f1c; border: 1px solid rgba(190,220,255,.16); border-radius: 14px; padding: 16px 18px 18px; color: #e9ecf1; box-shadow: 0 30px 80px rgba(0,0,0,.6); }
.t3r-rules__head { display: flex; justify-content: space-between; align-items: center; font-family: var(--t3r-font); letter-spacing: .18em; font-size: 13px; color: var(--t3r-accent); margin-bottom: 10px; }
.t3r-rules__x { background: none; border: 0; color: #9aa3b2; font-size: 18px; cursor: pointer; padding: 4px 8px; }
.t3r-rules__list { margin: 0 0 12px; padding: 0 0 0 18px; font-size: 15px; line-height: 1.45; }
.t3r-rules__list li { margin: 0 0 6px; }
.t3r-rules__keys { margin: 0 0 8px; font-size: 13px; color: #9aa3b2; }
.t3r-rules__ok { display: block; width: 100%; margin-top: 8px; padding: 12px; font-family: var(--t3r-font); letter-spacing: .14em; font-weight: 700; background: var(--t3r-accent); color: #0b0c10; border: 0; border-radius: 10px; cursor: pointer; }
.t3r-touch { display: none; } @media (hover: none) and (pointer: coarse) { .t3r-desk { display: none; } .t3r-touch { display: block; } }
.tlt-l3 #l3-app .t3r-rules{padding:16px}
.tlt-l3 #l3-app .t3r-rules__panel{padding:16px 18px 18px;font-family:"Helvetica Neue",Arial,sans-serif;text-align:left;-webkit-user-select:text;user-select:text}
.tlt-l3 #l3-app .t3r-rules__list{list-style:disc;padding:0 0 0 18px;margin:0 0 12px}
.tlt-l3 #l3-app .t3r-rules__list li{margin:0 0 6px;padding:0;line-height:1.45}
.tlt-l3 #l3-app .t3r-rules__keys{margin:0 0 8px;padding:0;line-height:1.4}
.tlt-l3 #l3-app .t3r-rules__ok{font-family:var(--t3r-font)!important;color:#0b0c10!important;background:var(--t3r-accent)!important;border:0!important;line-height:1.1;text-transform:uppercase}
.tlt-l3 #l3-app .t3r-rules__x{color:#9aa3b2!important;background:none!important;border:0!important;font-family:inherit!important}
.tlt-l3 #l3-app .t3r-rules__ok:focus-visible,.tlt-l3 #l3-app .t3r-rules__x:focus-visible{outline:2px solid var(--gold);outline-offset:2px}


/* ---- 1.0.0: his pictures on the panels and the THROW button (after every border shorthand, so nothing resets them) ---- */
.tlt-l3 #l3-app #l3-board,.tlt-l3 #l3-app #l3-cup{border:18px solid transparent!important;border-image:var(--l3-panel,none) 90 70 fill / 18px 16px / 0 stretch!important;background:rgba(5,7,14,.55)!important}
.tlt-l3 #l3-app #l3-entry{border:16px solid transparent!important;border-image:var(--l3-card,none) 60 fill / 16px / 0 stretch!important;background:rgba(5,7,14,.62)!important}
.tlt-l3 #l3-app .t3r-rules__panel{border:16px solid transparent!important;border-image:var(--l3-card,none) 60 fill / 16px / 0 stretch!important;background:rgba(7,10,20,.92)!important}
.tlt-l3 #l3-app #l3-throw{border:0!important;border-radius:0!important;background:var(--l3-throw-ready,linear-gradient(180deg,#1f2a4d,#0b1022 60%,#070a15)) center/100% 100% no-repeat!important;box-shadow:none!important}
.tlt-l3 #l3-app #l3-throw:disabled{background-image:var(--l3-throw-wait,none)!important;color:rgba(244,239,230,.45)!important}
.tlt-l3 #l3-app #l3-throw:not(:disabled):active,.tlt-l3 #l3-app #l3-throw.l3-press{background-image:var(--l3-throw-press,none)!important}

/* members' bests (the US3R interface feeds them into window.L3.BOARDS): the handle reads a shade green, as on VAMPIR3 */
#l3-app .l3-row.l3-member .l3-hd{color:#9bbf82}
/* panel heads: the title never wraps; the tier line takes what is left and wraps on its own side */
#l3-app .l3-bh b{flex:none;white-space:nowrap}
#l3-app .l3-bh span{flex:1 1 auto;min-width:0;text-align:right;margin-left:12px;line-height:1.25}

/* ---- 1.1.0: on the TL3RDS STAGE (full screen) #l3-app is laid out at its design width and scaled by the stage — nothing in it reads the viewport ---- */
/* the frame's height is its content's (the stage CSS forces it auto); #l3-stage takes the lens's own height (l3.js sets it inline: 640 wide, 820 tall) in place of the 100vh clamp */
.tlt-l3.tl3-full #l3-app{height:auto;min-height:0}
.tlt-l3.tl3-full #l3-app #l3-stage{flex:0 0 auto}
.tlt-l3.tl3-full.tl3-desk #l3-app #l3-stage{height:640px}
.tlt-l3.tl3-full>.l3-note{display:none}
.tlt-l3.tl3-full #l3-app .t3r-rules__panel{max-height:calc(100% - 32px)}
/* the bay surround stays behind the game in the stage's full screen */
.tlt-l3.tl3-full{--tl3s-backdrop:var(--l3-surround,none)}

/* 1.1.5 (Oct 10, the walker's iPhone pass: "START OVER" was 62×14 px — smaller than a fingertip): a phone gets a full-size tap */
.tl3-phone #l3-app #l3-sub{min-height:40px;min-width:120px;padding:10px 16px;display:inline-flex;align-items:center;justify-content:center}
