/* TriPanic: Typhoon v0.10.0 – Foxy Typhoon crew deck.
   Purely visual: the existing room/solo/server logic is untouched. */
#tymp-root{
  background:linear-gradient(180deg,rgba(3,8,21,.15),rgba(5,10,24,.46)),url('/typhoon-hub/command-bridge.svg') center center/cover fixed no-repeat,#081122!important;
  --ty100-cyan:#69d7df;--ty100-lilac:#ad92ed;--ty100-border:rgba(139,193,217,.36);
}
#tymp-root.ty100-lobby{
  background:linear-gradient(180deg,rgba(3,8,21,.24),rgba(4,9,21,.61)),url('/typhoon-hub/crew-deck.svg') center center/cover fixed no-repeat,#081122!important;
}
#tymp-root .ty93-bg{background:none!important;pointer-events:none!important}
#tymp-root .ty93-bg:after,#tymp-root .ty93-orbit,#tymp-root .ty93-planet{display:none!important}
#tymp-root:before{opacity:0!important;pointer-events:none}
#tymp-root .tymp-frame.ty93{
  width:min(1180px,100%);max-width:none;min-height:min(750px,calc(100dvh - 30px));
  border:1px solid rgba(133,187,214,.30);border-radius:23px;
  background:linear-gradient(121deg,rgba(7,15,31,.48),rgba(10,18,38,.33) 49%,rgba(8,13,30,.68));
  box-shadow:0 24px 95px rgba(1,5,14,.57),inset 0 1px rgba(199,226,255,.08);backdrop-filter:blur(2px);
}
#tymp-root .ty93-header{padding-bottom:10px;border-bottom:1px solid rgba(127,180,209,.20)}
#tymp-root .ty93-logo{filter:none!important}
#tymp-root .ty93-profile,#tymp-root .ty93-settings-icon{background:rgba(7,20,39,.78);border-color:rgba(117,184,209,.33);box-shadow:inset 0 1px #ffffff11}
#tymp-root .ty93-home-main{grid-template-columns:minmax(290px,.98fr) minmax(330px,.95fr);gap:clamp(26px,4vw,72px);min-height:430px;margin:12px 0}
#tymp-root .ty93-home-main .ty93-intro{align-self:center;max-width:490px;gap:18px;padding:30px 10px 30px 8px;text-shadow:0 3px 19px #030714}
#tymp-root .ty93-kicker{color:#8df1e5;letter-spacing:2.4px;font-size:11px}
#tymp-root .ty93-intro h1{font-size:clamp(42px,5.2vw,70px);line-height:1.03;letter-spacing:-1.5px}
#tymp-root .ty93-intro h1 em{background:linear-gradient(95deg,#79e4e6,#bfa5ff);background-clip:text}
#tymp-root .ty93-intro p{color:#d4deef;max-width:375px;line-height:1.55}
#tymp-root .ty93-menu-options{align-content:center;align-self:center;gap:10px;padding:clamp(12px,2vw,23px);border:1px solid rgba(132,176,218,.32);border-radius:20px;background:linear-gradient(160deg,rgba(7,16,36,.90),rgba(14,21,43,.81));box-shadow:0 20px 46px #03081888,inset 0 1px #c4e8ff14}
#tymp-root .ty93-tile{min-height:83px;border-color:#42607d;background:linear-gradient(105deg,#12243bdb,#12172fdf);transition:background .16s,border-color .16s,transform .16s}
#tymp-root .ty93-tile.featured{background:linear-gradient(110deg,#103b4bbd,#252149d6);border-color:#68d0d4}
#tymp-root .ty93-tile:hover{transform:translateY(-2px);background:#19354c;border-color:#83e5df}
#tymp-root .ty93-tile-icon{background:#0b2940;border-color:#3a7e97}
#tymp-root .ty93-menu-mini{border-top:1px solid #6085a32b;padding-top:5px}
#tymp-root .ty93-footer{border-color:#6584ac34}
#tymp-root .ty100-hub-readout{display:grid;gap:8px;width:min(370px,100%);font-size:10px;font-weight:820;letter-spacing:1.25px;color:#b3cde4;text-shadow:0 2px 8px #040718}
#tymp-root .ty100-hub-readout .ty100-caption{color:#7de6da;display:flex;align-items:center;gap:8px}
#tymp-root .ty100-hub-readout .ty100-caption:before{content:'';height:7px;width:7px;border-radius:50%;background:#79e4d8;box-shadow:0 0 8px #4de8c780}
#tymp-root .ty100-hub-readout .ty100-bars{height:3px;display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:4px}
#tymp-root .ty100-hub-readout .ty100-bars i{display:block;background:#6bd7da84;border-radius:5px}
#tymp-root .ty100-hub-readout .ty100-bars i:nth-child(2){background:#a18be780}
#tymp-root .ty100-hub-readout .ty100-bars i:nth-child(4){background:#d2a6747a}
/* Subpages use the same command-bridge architecture without competing with form controls. */
#tymp-root .ty93:not(.ty93-home) .ty93-section-header,
#tymp-root .ty93:not(.ty93-home) .ty93-setup,
#tymp-root .ty93:not(.ty93-home) .ty93-online-cards,
#tymp-root .ty93:not(.ty93-home) .ty93-settings-grid{position:relative;z-index:1}
#tymp-root .ty93-choice,#tymp-root .ty93-setting{background:#0a1b33d9;backdrop-filter:blur(5px)}
#tymp-root .ty93-choice.selected{background:linear-gradient(115deg,#13414cdd,#30244bdc)}
/* The lobby is a gathering area, not a second gameplay screen. */
#tymp-root .tymp-frame.lobby{
  width:min(1000px,100%)!important;max-width:100%!important;
  background:linear-gradient(145deg,rgba(8,16,35,.96),rgba(14,23,44,.91))!important;
  border:1px solid rgba(109,183,204,.48);border-radius:20px;
  box-shadow:0 20px 78px #020614c9, inset 0 1px #c0edff18;
  backdrop-filter:blur(7px);padding:clamp(16px,2.3vw,27px)!important;
}
#tymp-root .tymp-frame.lobby .tymp-brand{margin-bottom:2px;width:min(250px,70%);align-self:center}
#tymp-root .tymp-frame.lobby .tymp-logo{max-height:100px!important}
#tymp-root .tymp-frame.lobby .tymp-eyebrow{color:#73dedb;letter-spacing:2px;font-size:10px}
#tymp-root .tymp-frame.lobby h1{font-size:clamp(23px,3.2vw,34px);letter-spacing:-.4px}
#tymp-root .tymp-frame.lobby>p{font-size:12px;color:#b7c7e1}
#tymp-root .tymp-frame.lobby .tymp-code-display{background:linear-gradient(110deg,rgba(8,30,48,.92),rgba(21,27,55,.88));border-color:#4cbfc38d;box-shadow:inset 0 1px #d0faff1c;padding:10px 15px}
#tymp-root .tymp-frame.lobby .tymp-code-display strong{font-size:clamp(24px,4vw,35px);color:#a0f6e9;letter-spacing:5px}
#tymp-root .tymp-frame.lobby .tymp-players{gap:10px;grid-template-columns:repeat(2,minmax(0,1fr))}
#tymp-root .tymp-frame.lobby .tymp-players>div{
  position:relative;min-height:83px;gap:3px;padding:8px 12px;
  border:1px solid rgba(109,147,194,.55);border-radius:13px;
  background:linear-gradient(135deg,rgba(19,43,65,.84),rgba(13,22,44,.94));
  box-shadow:inset 0 1px #cdeafa0d;overflow:hidden;
}
#tymp-root .tymp-frame.lobby .tymp-players>div:before{content:'';position:absolute;inset:0 auto 0 0;width:3px;background:rgba(114,170,200,.47)}
#tymp-root .tymp-frame.lobby .tymp-players>div:has(small){transition:border-color .18s}
#tymp-root .tymp-frame.lobby .tymp-players>div.ty-online-bot{border-color:#65c3c586;background:linear-gradient(115deg,#0b303aeb,#1c2246df)}
#tymp-root .tymp-frame.lobby .tymp-players>div.ty-online-bot:before{background:#79e7d4}
#tymp-root .tymp-frame.lobby .tymp-players span{color:#8edbdc}
#tymp-root .tymp-frame.lobby .tymp-players strong{font-size:clamp(13px,1.6vw,17px);line-height:1.15}
#tymp-root .tymp-frame.lobby .tymp-players small{font-size:11px}
#tymp-root .tymp-frame.lobby .tymp-player-avatar{width:38px;height:42px;object-fit:cover}
#tymp-root .tymp-frame.lobby .ty-bot-tools{padding:13px 16px;border-radius:13px;background:#0b2533db;border-color:#3c969aa8}
#tymp-root .tymp-frame.lobby .ty-bot-tools>strong{color:#85e6d8;letter-spacing:.8px}
#tymp-root .tymp-frame.lobby .ty-bot-actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
#tymp-root .tymp-frame.lobby .ty-bot-actions button{min-height:40px;font-size:12px}
#tymp-root .tymp-frame.lobby .tymp-btn{border-color:#526f91;background:#1b2b4b}
#tymp-root .tymp-frame.lobby .tymp-btn.primary{background:linear-gradient(105deg,#1d798c,#6354ac);border-color:#7bd5da;color:#fff}
#tymp-root .tymp-frame.lobby .tymp-btn:disabled{opacity:.5}
#tymp-root .tymp-frame.lobby .tymp-feedback{border-color:#486e8b;background:#0a1f35;min-height:32px}
#tymp-root .ty100-lobby-caption{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 10px 6px;color:#b6d1de;font-weight:850;font-size:10px;letter-spacing:1.2px;border-top:1px solid #57738d43}
#tymp-root .ty100-lobby-caption span:last-child{color:#8ff3da}
@media (max-width:900px){
 #tymp-root .tymp-frame.ty93{min-height:calc(100dvh - 18px);padding:15px 18px}
 #tymp-root .ty93-home-main{grid-template-columns:1fr 1.1fr;gap:18px;margin:4px 0}
 #tymp-root .ty93-home-main .ty93-intro{padding:12px 0}
 #tymp-root .ty93-home-main .ty93-intro h1{font-size:clamp(29px,4.3vw,42px)}
 #tymp-root .ty93-tile{min-height:66px;padding:10px}
 #tymp-root .ty93-menu-options{padding:11px}
}
@media (max-width:630px){
 #tymp-root .ty93-home-main{grid-template-columns:1fr}
 #tymp-root .ty93-home-main .ty93-intro{gap:8px}
 #tymp-root .ty93-menu-options{width:100%}
 #tymp-root .ty100-hub-readout{display:none}
 #tymp-root .tymp-frame.lobby .tymp-players{grid-template-columns:repeat(2,minmax(0,1fr))}
 #tymp-root .tymp-frame.lobby .tymp-players>div{min-height:90px;padding:8px}
 #tymp-root .tymp-frame.lobby .ty-bot-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-height:500px) and (orientation:landscape){
 #tymp-root{background-attachment:scroll!important}
 #tymp-root .tymp-frame.ty93{min-height:calc(100dvh - 12px);padding:9px 14px!important;gap:5px}
 #tymp-root .ty93-header{padding-bottom:2px}
 #tymp-root .ty93-home-main{grid-template-columns:.92fr 1.08fr;gap:15px;margin:0;min-height:0}
 #tymp-root .ty93-home-main .ty93-intro{gap:6px;padding:2px 1px}
 #tymp-root .ty93-intro h1{font-size:clamp(26px,4.6vw,40px);line-height:1.0}
 #tymp-root .ty93-intro p{font-size:11px}
 #tymp-root .ty93-tile{min-height:55px;padding:6px 10px}
 #tymp-root .ty93-tile-icon{width:31px;height:31px;flex-basis:31px;font-size:17px}
 #tymp-root .ty93-tile-copy strong{font-size:12px}
 #tymp-root .ty93-tile-copy small{font-size:9px}
 #tymp-root .ty93-menu-options{padding:8px;gap:5px}
 #tymp-root .ty93-footer{padding-top:5px}
 #tymp-root .ty100-hub-readout{display:none}
 #tymp-root .tymp-frame.lobby{padding:9px 14px!important;gap:5px}
 #tymp-root .tymp-frame.lobby .tymp-players{grid-template-columns:repeat(4,minmax(0,1fr))}
 #tymp-root .tymp-frame.lobby .tymp-players>div{min-height:64px;padding:6px}
 #tymp-root .tymp-frame.lobby .tymp-players strong{font-size:10px}
 #tymp-root .tymp-frame.lobby .tymp-players small{font-size:8px}
 #tymp-root .tymp-frame.lobby .tymp-player-avatar{width:31px;height:35px}
 #tymp-root .tymp-frame.lobby .tymp-code-display{padding:5px}
 #tymp-root .tymp-frame.lobby .tymp-code-display strong{font-size:20px}
 #tymp-root .tymp-frame.lobby .ty-bot-tools{padding:6px}
 #tymp-root .tymp-frame.lobby .ty-bot-actions button{min-height:34px;font-size:10px}
}
@media (prefers-reduced-motion:reduce){#tymp-root .ty93-tile{transition:none!important}}

/* Dense phone-landscape controls: the user can reach bot options without hunting below the player grid. */
@media(max-height:500px) and (orientation:landscape){
 #tymp-root .tymp-frame.lobby .tymp-brand{width:135px!important;align-self:center!important;max-height:43px}
 #tymp-root .tymp-frame.lobby .tymp-logo{max-height:43px!important}
 #tymp-root .tymp-frame.lobby .tymp-eyebrow{display:none!important}
 #tymp-root .tymp-frame.lobby>h1{font-size:18px!important;margin:0}
 #tymp-root .tymp-frame.lobby>p{font-size:10px!important;line-height:1.2;margin:0}
 #tymp-root .tymp-frame.lobby .tymp-code-display{padding:3px 8px!important}
 #tymp-root .tymp-frame.lobby .tymp-code-display small{font-size:9px}
 #tymp-root .tymp-frame.lobby .tymp-code-display strong{font-size:20px;line-height:1.15}
 #tymp-root .tymp-frame.lobby .tymp-actions .tymp-btn{min-height:34px!important;font-size:11px!important;padding:5px!important}
 #tymp-root .tymp-frame.lobby .ty-bot-tools{padding:6px!important}
 #tymp-root .tymp-frame.lobby .ty-bot-tools small{font-size:10px}
 #tymp-root .tymp-frame.lobby .ty-bot-tools>strong{font-size:10px}
 #tymp-root .tymp-frame.lobby .ty-bot-actions button{min-height:31px!important;padding:4px!important}
 #tymp-root .ty100-lobby-caption{font-size:8px;padding:3px}
 #tymp-root .tymp-frame.lobby .tymp-players>div{min-height:59px!important;padding:4px!important}
 #tymp-root .tymp-frame.lobby .tymp-players strong{font-size:10px!important}
 #tymp-root .tymp-frame.lobby .tymp-players small{font-size:8px!important}
 #tymp-root .tymp-frame.lobby .tymp-players span{font-size:8px!important}
 #tymp-root .tymp-frame.lobby .tymp-player-avatar{width:24px!important;height:28px!important}
}