/* Shared header, Start menu, Find, and iPhone field sizing. Cached once for every section. */
.site-header .hdr{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.site-header .brand{flex:1 1 auto;min-width:0}
.site-header .brand span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.shell-bar{display:flex;flex:0 1 auto;flex-wrap:wrap;gap:6px;align-items:center;min-width:0;position:relative;z-index:6}
.shell-tool,.shell-x,.shell-menu a,.shell-hit{
  font:700 15px -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Verdana, Roboto, Helvetica, Arial, sans-serif;color:#111827;background:#d4d0c8;text-decoration:none;
  border-top:2px solid #fff;border-left:2px solid #fff;border-right:2px solid #404040;border-bottom:2px solid #404040;
  min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;cursor:pointer
}
.shell-tool{white-space:nowrap}
.shell-tool.is-owner{background:#000080;color:#fff;border-top-color:#404040;border-left-color:#404040;border-right-color:#fff;border-bottom-color:#fff}
.shell-tool[aria-expanded="true"]{border-top-color:#404040;border-left-color:#404040;border-right-color:#fff;border-bottom-color:#fff}
.shell-menu[hidden]{display:none}
.shell-label{margin:4px 6px 2px;font:700 12px -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Verdana, Roboto, Helvetica, Arial, sans-serif;color:#111827}
html,body{overflow-x:clip;max-width:100%}
:root{--nav-h:64px;--task-h:0px}
body{padding-top:var(--nav-h);padding-bottom:28px}
.studio-nav{
  position:fixed;top:0;left:0;right:0;z-index:1200;box-sizing:border-box;
  display:flex;flex-wrap:nowrap;align-items:center;gap:6px;height:var(--nav-h);
  padding:0 max(8px, env(safe-area-inset-right)) 0 max(8px, env(safe-area-inset-left));
  background:var(--surface, #fff);
  border-bottom:1px solid var(--line, #e2e8f0);color:var(--ink, #0f172a);overflow:hidden;box-shadow:none
}
.studio-brand{display:inline-flex;align-items:center;gap:6px;min-width:0;flex:0 1 auto;font-weight:700;letter-spacing:-.03em;color:#0f172a;text-decoration:none;font-size:clamp(.92rem,2.8vw,1.15rem);white-space:nowrap}
.studio-mark{flex:none;width:28px;height:28px;border-radius:8px !important;display:inline-flex;align-items:center;justify-content:center;background:var(--accent,#0f172a);color:var(--accent-ink,#fff);font-size:14px;font-weight:800}
.studio-word{font:700 var(--text-md, 1.125rem)/1 var(--font-ui, Inter, sans-serif);letter-spacing:-.01em;color:var(--ink, #0f172a)}
.nav-ico{width:16px;height:16px;flex:none;display:block}
.nav-avatar{flex:none;width:22px;height:22px;border-radius:50% !important;display:inline-flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--accent-ink,#fff) 18%,transparent);color:inherit;font-size:12px;font-weight:800;line-height:1}
.studio-links{display:flex;gap:2px;min-width:0;overflow:auto;flex:1 1 auto}
.studio-links a{color:#334155;text-decoration:none;font-weight:600;font-size:.88rem;padding:6px 8px;border-radius:999px;white-space:nowrap}
.studio-links a[aria-current="page"],.studio-links a:hover{background:#f1f5f9;color:#0f172a}
.studio-actions{display:flex;flex-wrap:nowrap;align-items:center;gap:6px;margin-left:auto;min-width:0}
.studio-nav .shell-bar{flex-wrap:nowrap;min-width:0}
.studio-apps,.studio-ghost,.studio-account,.studio-close{
  border:1px solid #e2e8f0;background:#fff;color:#0f172a;border-radius:999px;
  min-height:44px;padding:0 10px;font-weight:650;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap
}
#shellOwner{max-width:min(40vw,168px);min-width:0;flex:0 1 auto}
#shellOwner .nav-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.studio-apps kbd{margin-left:6px;font:600 11px "JetBrains Mono", "SFMono-Regular", Consolas, monospace;color:#64748b;border:1px solid #e2e8f0;border-radius:6px;padding:1px 4px}
.studio-account{background:#0f172a;color:#fff;border-color:#0f172a}
.studio-account.is-owner{background:#0f766e;border-color:#0f766e}
.studio-clock{font:600 12px "JetBrains Mono", "SFMono-Regular", Consolas, monospace;color:#64748b}
.studio-drawer{
  position:fixed;inset:auto 12px auto auto;top:calc(var(--nav-h) + 8px);z-index:90;margin:0;
  width:min(720px,calc(100vw - 24px));
  max-height:min(85svh, calc(100svh - var(--nav-h) - 8px));
  overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  touch-action:pan-y;
  background:var(--surface, #fff);color:var(--ink, #0f172a);border:1px solid var(--line, #e2e8f0);border-radius:16px;
  box-shadow:var(--shadow-3, 0 24px 60px -20px rgba(15,23,42,.28));
  padding:16px 16px calc(16px + env(safe-area-inset-bottom))
}
.studio-drawer::backdrop{background:var(--overlay, rgb(15 23 42 / .45))}
.studio-drawer[hidden]{display:none}
.studio-group h2{margin:12px 0 8px;font-size:13px;letter-spacing:0;text-transform:none;font-weight:600;color:var(--ink-muted, #475569)}
.studio-apps-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px 6px}
.studio-app{
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:6px;
  min-width:44px;min-height:44px;padding:2px 2px 4px;border-radius:14px;
  color:var(--ink,#0f172a);text-decoration:none;font-weight:600;text-align:center
}
.app-modern{display:flex}
html:not([data-theme="retro"]) .app-pixel{display:none !important}
.app-tile{
  width:56px;height:56px;border-radius:16px;display:grid;place-items:center;flex:none;
  background:var(--app-bg,#e2e8f0);color:var(--app-ink,#0f172a);
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--app-ink) 18%, transparent)
}
.app-tile svg{width:26px;height:26px;display:block}
.app-label{
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;
  width:100%;min-height:2.3em;font-size:12px;line-height:1.15;font-weight:600;letter-spacing:-.01em
}
.studio-app:hover,.studio-app[aria-current="page"]{background:var(--surface-2,#f1f5f9)}
.studio-app[aria-current="page"] .app-tile{box-shadow:0 0 0 2px var(--surface,#fff),0 0 0 4px var(--ink,#0f172a)}
.dock-glyph{display:grid;place-items:center}
.dock-glyph .app-modern,.dock-glyph .app-pixel{grid-area:1/1}
@media (min-width:520px){
  .studio-apps-grid{grid-template-columns:repeat(auto-fill,minmax(88px,1fr))}
}
.studio-close{margin-top:12px}
.theme-switch{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:.85rem;color:#475569}
.theme-switch select{border:1px solid #e2e8f0;border-radius:8px;background:#fff;color:#0f172a;min-height:36px}
.win98-taskbar{display:none}
.win98-start,.win98-mute{
  font:700 15px -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Verdana, Roboto, Helvetica, Arial, sans-serif;color:#111827;background:#c0c0c0;cursor:pointer;
  border-top:2px solid #fff;border-left:2px solid #fff;border-right:2px solid #404040;border-bottom:2px solid #404040;
  min-height:36px;padding:2px 10px;white-space:nowrap
}
.win98-start{font-weight:800}
.win98-start[aria-expanded="true"],.win98-mute[aria-pressed="true"]{border-top-color:#404040;border-left-color:#404040;border-right-color:#fff;border-bottom-color:#fff}
.win98-taskbar .shell-bar{flex:1 1 auto;flex-wrap:nowrap;overflow-x:auto;min-width:0;gap:4px;-webkit-overflow-scrolling:touch}
.win98-taskbar .shell-tool{min-height:36px;padding:2px 8px;font-size:14px}
.win98-tray{display:flex;align-items:center;gap:4px;flex:0 0 auto;margin-left:auto;padding:2px 4px;border:1px inset #808080;background:#c0c0c0;max-width:58%}
.win98-tray .theme-switch{display:flex;align-items:center;gap:4px;margin:0;min-width:0}
.win98-tray .theme-switch span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.win98-tray select{max-width:34vw;min-height:32px;font:700 12px -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Verdana, Roboto, Helvetica, Arial, sans-serif;background:#fff;color:#111827}
.win98-clock{font:700 13px "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;min-width:72px;padding:2px 6px;border:1px inset #fff;background:#c0c0c0;color:#111827;white-space:nowrap}
.win98-menu{
  position:fixed;left:2px;bottom:var(--task-h);top:auto;z-index:90;
  width:min(560px,calc(100vw - 8px));max-height:calc(100dvh - var(--task-h) - 8px);
  display:flex;flex-wrap:wrap;align-items:stretch;gap:0;overflow:hidden;background:#c0c0c0;padding:2px;
  border-top:2px solid #fff;border-left:2px solid #fff;border-right:2px solid #404040;border-bottom:2px solid #404040;
  box-shadow:3px 3px 0 #000
}
.win98-side{
  flex:0 0 28px;display:flex;align-items:center;justify-content:center;
  writing-mode:vertical-rl;transform:rotate(180deg);
  background:linear-gradient(#000080,#1084d0);color:#fff;
  font:700 15px -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Verdana, Roboto, Helvetica, Arial, sans-serif;letter-spacing:1px;padding:8px 0
}
.win98-cols{display:flex;flex:1 1 auto;min-width:0;min-height:0;max-height:calc(100dvh - var(--task-h) - 56px);overflow:auto;-webkit-overflow-scrolling:touch}
.win98-col{flex:1 1 50%;min-width:0;border-left:1px solid #808080}
.win98-item{
  font:700 14px -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Verdana, Roboto, Helvetica, Arial, sans-serif;color:#111827;background:transparent;text-decoration:none;
  border:0;width:100%;min-height:40px;display:flex;align-items:center;justify-content:flex-start;gap:8px;
  padding:4px 8px;cursor:pointer;text-align:left
}
.win98-item svg{flex:none;image-rendering:pixelated}
.win98-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.win98-item:hover,.win98-item:focus-visible,.win98-item[aria-current="page"]{background:#000080;color:#fff}
.win98-menu .shell-x{flex:1 0 100%;min-height:36px;margin-top:2px}
html[data-scan="1"]::before{
  content:"";pointer-events:none;position:fixed;inset:0;z-index:70;
  background:repeating-linear-gradient(to bottom,rgba(0,0,0,.16) 0 1px,transparent 1px 3px)
}
#starTrail{position:fixed;inset:0;pointer-events:none;z-index:75}
.star-bit{position:fixed;pointer-events:none;z-index:75;color:#ff0;font:700 14px -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Verdana, Roboto, Helvetica, Arial, sans-serif;text-shadow:0 0 2px #f60;animation:star-fade .55s linear forwards}
@keyframes star-fade{to{opacity:0;transform:translateY(-8px) scale(.4)}}
html[data-shell-paused="1"] .star-bit{animation-play-state:paused!important}
body.board-page,body.fps-live{padding:var(--nav-h) 0 0!important;height:calc(100dvh - var(--nav-h));min-height:0}
body.fps-page.fps-live main.wrap{height:calc(100dvh - var(--nav-h))!important}
body.is-playing{padding-top:var(--nav-h)!important;padding-bottom:0!important}
body.is-playing .cabinet{min-height:calc(100dvh - var(--nav-h))}
body.is-playing .crt{height:calc(100dvh - var(--nav-h) - 168px)}
.studio-dock{display:none}
@media (max-width:768px){
  :root{--nav-h:56px;--dock-h:calc(60px + env(safe-area-inset-bottom))}
  body{padding-bottom:var(--dock-h)}
  .studio-dock{
    display:grid;grid-template-columns:repeat(6,1fr);position:fixed;left:0;right:0;bottom:0;z-index:85;box-sizing:border-box;
    height:var(--dock-h);
    padding:6px max(4px, env(safe-area-inset-right)) env(safe-area-inset-bottom) max(4px, env(safe-area-inset-left));
    background:color-mix(in srgb, var(--surface, #fff) 88%, transparent);
    -webkit-backdrop-filter:saturate(1.4) blur(12px);backdrop-filter:saturate(1.4) blur(12px);
    border-top:1px solid var(--line,#e2e8f0);align-items:stretch
  }
  .studio-dock a,.studio-dock button{
    display:grid;place-items:center;align-content:center;gap:1px;min-height:44px;min-width:0;overflow:hidden;border:0;background:none;color:var(--ink-muted,#475569);
    font:500 12px/1.1 var(--font-ui, Inter, sans-serif);
    text-decoration:none;border-radius:var(--radius-md, 12px);text-align:center;padding:2px 1px 0
  }
  .studio-dock a > span:last-child,
  .studio-dock button > span:last-child{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .studio-dock .dock-glyph{display:grid}
  .studio-dock .app-modern{display:flex}
  .studio-dock svg{width:24px;height:24px;display:block}
  .studio-dock [aria-current="page"]{color:var(--link,#1d4ed8);background:none}
  .studio-dock [aria-current="page"] .dock-glyph{color:var(--link,#1d4ed8)}
  body.is-playing .studio-dock,body.wordle-page .studio-dock{display:none}
  body.is-playing,body.wordle-page{padding-bottom:0 !important;--dock-h:0px}
  .studio-drawer{
    inset:auto 0 0 0;top:auto;right:0;left:0;width:100%;max-width:none;margin:0;
    max-height:min(85svh, calc(100svh - var(--nav-h) - 8px));
    border-radius:20px 20px 0 0;
    padding:8px var(--gutter-r, 16px) calc(16px + env(safe-area-inset-bottom)) var(--gutter-l, 16px);
    box-shadow:var(--shadow-3, 0 24px 48px -12px rgb(15 23 42 / .3))
  }
  .studio-drawer::before{content:"";display:block;width:36px;height:5px;border-radius:3px;background:var(--line-strong,#7c8799);margin:4px auto 12px}
  body.board-page,body.fps-live{height:calc(100dvh - var(--nav-h) - var(--dock-h))}
}
@media (max-width:900px){
  body{padding-top:var(--nav-h)}
  .studio-nav{gap:6px;padding:0 8px}
  .studio-links{display:none}
  .studio-clock,#shellMute{display:none}
  .studio-drawer{left:8px;right:8px;width:auto}
  body.board-page,body.fps-live,body.is-playing{padding-top:var(--nav-h)!important;margin-top:0}
  .studio-apps,.studio-ghost,.studio-account{min-height:44px;padding:0 8px;gap:4px}
  .studio-apps kbd{display:none}
  .shell-tool{min-height:var(--tap, 44px);min-width:var(--tap, 44px)}
}
@media (max-width:429px){
  .studio-word{display:none}
}
@media (hover:hover) and (pointer:fine){
  .shell-tool kbd,.studio-apps kbd{display:inline}
}
@media (max-width:340px){
  #shellStart .nav-label,#shellFindBtn .nav-label{
    position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0
  }
  #shellStart,#shellFindBtn{position:relative;padding:0 12px}
}
@media (max-width:640px){
  .win98-cols{flex-direction:column}
  .win98-side{flex-basis:22px}
  .win98-tray{max-width:46%}
  .win98-tray select{max-width:22vw}
  .win98-clock{min-width:0;padding:1px 4px;font-size:12px}
}
@media (max-width:420px){
  .win98-clock{display:none}
  .win98-taskbar .shell-tool{font-size:12px;padding:2px 6px}
}
@media print{
  .win98-taskbar,.win98-menu,#starTrail{display:none!important}
  html[data-scan="1"]::before{content:none}
  body,body.chat-page,body.board-page{padding:0!important;margin:0!important;height:auto}
}
.site-header .site-nav{
  flex:1 1 100%;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;max-width:100%;
  -webkit-overflow-scrolling:touch;scrollbar-width:thin;gap:4px;padding-bottom:2px
}
.site-header .site-nav a{flex:0 0 auto;white-space:nowrap}
.nav-apps{display:none}
dialog{max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);box-sizing:border-box}
.shell-find{width:min(520px,calc(100vw - 16px));background:#c0c0c0;color:#111827;border:2px solid #fff;border-right-color:#404040;border-bottom-color:#404040;padding:10px}
.shell-find h2{margin:0 36px 8px 0;font:700 18px -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Verdana, Roboto, Helvetica, Arial, sans-serif;color:#111827}
.shell-find p{margin:0 0 8px}
.shell-find .shell-x{float:right}
.shell-find label{display:block;font:700 14px -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Verdana, Roboto, Helvetica, Arial, sans-serif}
.shell-find input,.shell-find textarea,.shell-find select{width:100%;box-sizing:border-box;margin:4px 0 8px}
.shell-results{max-height:min(50dvh,420px);overflow:auto;clear:both}
.shell-hit{display:flex;flex-direction:row;align-items:center;gap:8px;width:100%;margin:0 0 4px;background:transparent;color:inherit;text-align:left;text-decoration:none}
.shell-hit b{font-size:16px}
.shell-kind{font:700 12px -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Verdana, Roboto, Helvetica, Arial, sans-serif;color:#111827}
.shell-empty{margin:0;padding:8px;background:#fff}
html[data-shell-paused="1"] *{animation-play-state:paused!important}
.member-dialog{overflow:auto}
.member-dialog h2{margin-bottom:4px}
.member-tabs{display:flex;gap:6px;margin:0 0 6px;clear:both}
.member-tabs button{flex:1;min-height:44px;font:700 14px -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Verdana, Roboto, Helvetica, Arial, sans-serif}
.member-tabs button[aria-pressed="true"]{background:#000080;color:#fff}
.member-row{display:flex;flex-wrap:wrap;gap:8px}
.member-row .shell-tool{min-height:44px}
.member-err{color:#800;font-weight:700}
.member-dialog label{margin:0}
.member-dialog input{font-size:16px;margin:2px 0 4px}
.member-dialog p{margin:0 0 4px}
.avatar-picker{display:grid;grid-template-columns:repeat(4,minmax(44px,1fr));gap:4px;margin:0 0 6px}
.avatar-choice{min-height:44px;background:#fff;color:#111827;border:2px solid;border-color:#fff #404040 #404040 #fff;padding:2px;font:10px/1.1 -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Verdana, Roboto, Helvetica, Arial, sans-serif}
.avatar-choice[aria-pressed="true"]{outline:2px solid #000080;background:#ffffcc}
.avatar-choice .mava{display:block;margin:0 auto;width:24px;height:24px}
@media (min-width:700px){
  .avatar-picker{grid-template-columns:repeat(8,minmax(44px,1fr))}
}
.member-chip{display:inline-flex;align-items:center;margin:0 6px 0 0;vertical-align:middle}
.mava{image-rendering:pixelated;vertical-align:middle}
.mbadge{font:700 11px -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Verdana, Roboto, Helvetica, Arial, sans-serif;color:#111827;white-space:nowrap}
.mbadge.is-web{color:#8b0000}
@media (max-width:768px){
  .nav-apps{
    display:flex;flex:1 1 100%;align-items:center;justify-content:center;min-height:44px;
    margin:0;padding:8px 10px;font:700 16px -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Verdana, Roboto, Helvetica, Arial, sans-serif;color:#fff;background:#000080;cursor:pointer;
    border-top:2px solid #fff;border-left:2px solid #fff;border-right:2px solid #404040;border-bottom:2px solid #404040
  }
  .site-header .site-nav a.nav-more{display:none}
  .site-header .hdr{align-items:stretch}
  dialog{
    width:min(440px,calc(100vw - 16px));
    max-height:calc(100dvh - var(--task-h) - 12px);
    overflow:auto;-webkit-overflow-scrolling:touch
  }
  dialog .shell-x{position:sticky;top:0;z-index:3}
  pre,code{overflow-wrap:anywhere;max-width:100%}
  .dpad,.controls,#joy,#touch,.board-stage,.crt,#world,#stage{touch-action:none}
}
@media (max-width:900px){
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  textarea,select{font-size:16px!important;min-height:44px}
  button,a.btn,input[type="button"],input[type="submit"],input[type="reset"],.btn,summary,.leaflet-control a{
    min-height:44px;touch-action:manipulation
  }
  .leaflet-control-zoom a{width:44px!important;height:44px!important;line-height:44px!important;font-size:22px!important}
  .leaflet-popup:not(.ship-callout) .leaflet-popup-close-button{width:44px!important;height:44px!important;font-size:22px!important;line-height:40px!important}
}
@media (min-width:901px){
  .site-header .site-nav{scrollbar-width:thin}
}
body.chat-page{
  box-sizing:border-box;
  height:100dvh!important;
  min-height:0!important;
  margin:0!important;
  padding:var(--nav-h) 0 0!important;
  overflow:hidden;
}
body.chat-page .site-footer{display:none!important}
@media (max-width:768px){
  body.chat-page{padding-bottom:var(--dock-h)!important}
}
