/* THE FELT - 13-tourney.css
   The tournament simulator's lobby: tonight's cards, the structure sheet and
   the custom builder. Everything is prefixed tl- on purpose - the old lobby
   grid was called .lobby, which 06-v4.css also uses for the room picker
   overlay (position:fixed, display:none), so the whole event list was
   silently invisible. New names, no collisions with 02-table.css either.

   Colour rules: the four action hues belong to the action bar. The only
   borrowed one here is gold, and only on money (buy-ins, prizes, the roll).
   The speed meter runs violet to ember, which is chrome and brand. */

/* ---------- head ---------- */
.tl-head{display:flex;align-items:flex-end;gap:18px;flex-wrap:wrap;margin:4px 0 16px;}
.tl-htext{flex:1 1 440px;min-width:0;}
.tl-kicker{font:700 11px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ember);margin-bottom:8px;}
.tl-head h2{margin:0 0 10px;font:800 clamp(30px,4.4vw,52px)/.95 var(--disp);letter-spacing:-.03em;color:var(--text);
  text-shadow:0 1px 0 #4B3C47,0 2px 0 #3A2E37,0 3px 0 #2A2127,0 4px 0 #1B1519,0 12px 24px rgba(0,0,0,.6);}
.tl-head h2 em{font-style:normal;background:var(--g-ember);-webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:none;filter:drop-shadow(0 3px 0 #6A2A14);}
.tl-head p{margin:0;color:var(--text2);max-width:600px;font-size:14px;line-height:1.55;}
.tl-roll{display:flex;flex-direction:column;align-items:flex-end;gap:2px;padding:10px 16px;border-radius:16px;
  background:var(--g-surface2);border:1px solid var(--border2);box-shadow:var(--shadow);}
.tl-roll .k{font:700 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text3);}
.tl-roll b{font:800 26px/1 var(--disp);color:var(--gold-hi);}

/* ---------- the bar: where to start, and the three ways to find one ---------- */
.tl-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px;
  padding:10px 12px;border-radius:16px;background:var(--g-well);border:1px solid var(--border);
  box-shadow:inset 0 2px 10px rgba(0,0,0,.45);}
.tl-startat{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0;}
.tl-lbl{font:700 10.5px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text3);}
#tvSpots .chip{font-size:11.5px;padding:7px 12px;}
.tl-acts{display:flex;gap:8px;flex-wrap:wrap;}

/* ---------- tonight's cards ---------- */
.tl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;}
.tl-card{position:relative;display:flex;flex-direction:column;gap:10px;min-width:0;border-radius:20px;padding:18px 16px 16px;
  overflow:hidden;background:linear-gradient(165deg,rgba(255,236,220,.05),rgba(255,236,220,0) 40%),var(--g-surface);
  border:1px solid var(--border2);box-shadow:var(--shadow);
  transition:transform .2s var(--ease),border-color .2s,box-shadow .2s;}
.tl-card::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--g-ember);opacity:.75;}
.tl-card::after{content:"";position:absolute;inset:-45% -25% auto auto;width:60%;height:80%;border-radius:50%;
  background:radial-gradient(closest-side,rgba(138,99,247,.35),transparent);opacity:.35;pointer-events:none;}
.tl-card:hover{border-color:var(--accent-line);transform:translateY(-2px);}
.tl-card.on{border-color:var(--accent-hi);box-shadow:0 0 0 2px var(--accent-line),var(--shadow);}
.tl-top{display:flex;align-items:center;gap:8px;position:relative;z-index:1;}
.tl-preset{display:inline-block;font:700 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-hi);
  padding:3px 8px;border-radius:7px;background:var(--accent-dim);border:1px solid var(--accent-line);white-space:nowrap;}
.tl-tagx{font:700 10px var(--mono);letter-spacing:.06em;color:var(--gold-hi);padding:3px 7px;border-radius:7px;
  border:1px solid rgba(232,180,76,.35);white-space:nowrap;}
.tl-buy{margin-left:auto;font:800 24px/1 var(--disp);color:var(--gold-hi);text-shadow:0 2px 0 rgba(0,0,0,.35);white-space:nowrap;}
.tl-name{margin:0;font:800 21px/1.1 var(--disp);letter-spacing:-.01em;color:var(--text);position:relative;z-index:1;}
.tl-name.big{font-size:clamp(22px,3vw,28px);margin-top:8px;}
.tl-meta{font-size:12px;color:var(--text3);margin-top:-4px;}
.tl-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;}
.tl-stats div{display:flex;flex-direction:column;padding:8px 7px;border-radius:12px;background:var(--g-well);
  border:1px solid var(--border);min-width:0;}
.tl-stats b{font:800 17px/1.1 var(--disp);color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tl-stats b small{font:600 10px var(--mono);color:var(--text3);margin-left:1px;}
.tl-stats span{font:600 9.5px var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--text3);margin-top:3px;white-space:nowrap;}
.tl-speed{height:6px;border-radius:99px;background:var(--g-well);overflow:hidden;box-shadow:inset 0 1px 2px rgba(0,0,0,.5);}
.tl-speed i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--accent),var(--ember));}
.tl-pay{font:600 12px var(--mono);color:var(--text2);}
.tl-cta{display:flex;gap:8px;margin-top:auto;padding-top:4px;}
.tl-cta .lbtn.big{flex:1;min-height:50px;padding:12px 14px;font-size:16px;}
.tl-cta .lbtn.ghost{min-height:50px;}
#view-tourney .lbtn:disabled{opacity:.45;cursor:default;pointer-events:none;}

/* ---------- the structure sheet ---------- */
.tl-detail,.tl-builder{margin-top:16px;border-radius:20px;}
.tl-dhead{display:flex;gap:14px;align-items:flex-start;flex-wrap:wrap;margin-bottom:14px;}
.tl-dhead>div:first-child{flex:1 1 320px;min-width:0;}
.tl-blurb{margin:6px 0 0;color:var(--text2);font-size:13.5px;line-height:1.5;max-width:600px;}
.tl-dact{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.tl-dact .lbtn{min-height:44px;}
.tl-struct{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,.9fr);gap:20px;align-items:start;}
.tl-sub{font:700 10.5px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text3);margin-bottom:6px;}
.tl-sum .kv{align-items:baseline;}
.tl-sum .kv .v{text-align:right;font-size:12.5px;}
.tl-sum small{color:var(--text3);font-size:10.5px;font-family:var(--ui);}
.tl-tab th.num,.tl-tab td.num{text-align:right;}
.tl-tab td:first-child{color:var(--text2);white-space:nowrap;}
.tl-tab td{white-space:nowrap;}
.tl-tab small{color:var(--text3);font-size:9.5px;}
.tl-tab tr.anteon td{box-shadow:inset 0 1px 0 var(--accent-line);}
.tl-tab tr.anteon td:first-child{color:var(--accent-hi);}
.tl-tab .tl-more{color:var(--text3);font-style:italic;white-space:normal;}

/* ---------- the builder ---------- */
.tl-bgrid{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:20px;align-items:start;}
.tl-form{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.tl-f{display:flex;flex-direction:column;gap:5px;min-width:0;}
.tl-f.wide{grid-column:1/-1;}
.tl-f span{font:600 10.5px var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--text3);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;}
.tl-f em{font-style:normal;text-transform:none;letter-spacing:0;color:var(--text4);}
.tl-f input,.tl-f select{min-height:44px;}
.tl-f select:focus,.tl-f input:focus{border-color:var(--accent);box-shadow:inset 0 1px 3px rgba(0,0,0,.45),0 0 0 3px var(--accent-dim);}
.tl-bprev{min-width:0;}
.tl-bprev .tl-struct{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
.tl-bprev .tl-sum{grid-column:1/-1;}
.tl-bgo{display:flex;justify-content:flex-end;margin-top:16px;}
.tl-bgo .lbtn.big{min-height:50px;}

/* ---------- a tournament you are still in ---------- */
.tl-resume{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px;border-radius:20px;
  border-color:var(--accent-line);box-shadow:var(--glow-accent),var(--shadow);}
.tl-rtext{flex:1 1 260px;display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0;}
.tl-rtext b{font:800 22px/1.1 var(--disp);color:var(--text);}
.tl-rtext span:last-child{color:var(--text2);font-size:13px;}

@media(max-width:1180px){
  .tl-struct{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  .tl-struct .tl-sum{grid-column:1/-1;}
  .tl-bgrid{grid-template-columns:minmax(0,1fr);}
}
@media(max-width:700px){
  .tl-head{gap:12px;margin-bottom:12px;}
  .tl-head p{font-size:13px;}
  .tl-roll{flex-direction:row;align-items:baseline;justify-content:space-between;width:100%;padding:10px 14px;}
  .tl-roll b{font-size:22px;}
  .tl-bar{padding:10px;gap:10px;}
  .tl-startat{width:100%;}
  #tvSpots{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;max-width:100%;padding-bottom:2px;}
  #tvSpots::-webkit-scrollbar{display:none;}
  #tvSpots .chip{flex:none;min-height:44px;}
  .tl-acts{width:100%;}
  .tl-acts .lbtn{flex:1 1 0;min-height:44px;padding:8px 6px;font-size:12px;}
  .tl-grid{grid-template-columns:minmax(0,1fr);}
  .tl-card{padding:16px 14px 14px;}
  .tl-stats b{font-size:15px;}
  .tl-struct,.tl-bprev .tl-struct{grid-template-columns:minmax(0,1fr);}
  .tl-dact{width:100%;}
  .tl-dact .lbtn.big{flex:1;}
  .tl-resume .btn.sm{min-height:44px;}
  .tl-bgo .lbtn.big{width:100%;}
}
