/* Phone-first adjustments for Android and iOS. Desktop styles remain unchanged. */
:root { --safe-top:max(12px, env(safe-area-inset-top)); --safe-bottom:max(14px, env(safe-area-inset-bottom)); }
button,input,select,a { -webkit-tap-highlight-color:transparent; }

@media (max-width:700px) {
  html { -webkit-text-size-adjust:100%; }
  body { min-width:320px; overscroll-behavior-y:none; }
  .site-shell { overflow:clip; }
  .topbar { position:sticky;top:0;z-index:18;height:calc(58px + env(safe-area-inset-top));padding:var(--safe-top) 14px 0; }
  .brand { font-size:15px;white-space:nowrap;letter-spacing:.3px; }.brand-spark { font-size:18px; }
  .nav-actions { gap:7px; }.nav-actions .workshop-link,.how-link { display:none; }.token-count { padding:5px 6px;font-size:8px; }.profile-avatar { width:34px;height:34px;font-size:17px; }
  .hero { min-height:0;padding:47px 22px 37px;gap:18px; }.hero-copy { position:relative;z-index:1; }h1 { font-size:clamp(52px,16vw,73px);letter-spacing:-2px; }.intro { max-width:32ch;margin:19px 0;font-size:13px;line-height:1.65; }.primary-cta { width:100%;min-height:50px;justify-content:space-between;padding:14px 17px; }.tiny-note { line-height:1.55; }.hero-art { min-height:250px;margin:4px -4px 0; }.notebook-paper { width:min(340px,86vw);height:238px;right:50%;top:6px;transform:translateX(50%) rotate(-3deg); }.doodle-spiral { right:3%;top:-13%; }.doodle-heart { left:2%;bottom:-8%; }
  .arena-section { padding:56px 10px 54px; }.arena-section .section-heading>p:last-child { margin-bottom:20px; }.game-card { width:100%;margin-top:20px;box-shadow:5px 5px 0 var(--ink); }.scorebar { min-height:57px;height:auto;padding:6px 9px; }.player-score { flex-wrap:wrap;max-width:29%;gap:3px 6px; }.player-score strong { font-size:23px; }.player-score span:not(.player-dot) { font-size:7px; }.round-label b { font-size:22px; }
  .mode-picker { min-height:0;padding:25px 12px 18px; }.mode-picker>p { margin-bottom:17px;font-size:26px; }.mode-options { grid-template-columns:repeat(2,minmax(0,1fr));gap:8px; }.mode-options button { min-height:95px;padding:8px 4px;font-size:13px;box-shadow:2px 2px 0 var(--ink); }.mode-options button b { font-size:25px; }.mode-options button small { font-size:8px;line-height:1.25; }.environment-picker { margin-top:20px;padding-top:14px; }.environment-options { grid-template-columns:repeat(2,minmax(0,1fr));gap:7px; }.environment-options button { min-height:62px;padding:5px 3px; }
  .game-stage { height:clamp(340px,94vw,470px); }.play-table { border-radius:0; }.environment-label { max-width:66%;right:8px;top:8px;font-size:7px; }.environment-label button { font-size:7px; }.game-menu-button { min-width:44px;min-height:38px;font-size:8px; }.desk-logo { font-size:16px; }.arena-pen { width:118px;height:22px; }.arena-pen:before { right:-18px;border-left-width:17px;border-top-width:7px;border-bottom-width:7px; }.arena-pen:after { right:-14px;border-left-width:13px;border-top-width:5px;border-bottom-width:5px; }.launch-handle { touch-action:none; }.start-button { min-height:49px;bottom:22px;padding:13px 15px; }.game-message { padding:0 16px;font-size:clamp(30px,10vw,42px);line-height:.9; }.impact { font-size:50px; }.controls { display:none; }.under-game { margin:18px 10px 0;line-height:1.55; }
  .touch-controls { display:grid;grid-template-columns:1fr;gap:9px;padding-bottom:calc(13px + env(safe-area-inset-bottom))!important; }.drag-instruction { display:grid;gap:7px; }.drag-instruction span { max-width:100%;white-space:normal;line-height:1.25; }.drag-instruction b { font-size:17px!important;line-height:1.08; }.drag-meter { display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px; }
  .how-section { padding:62px 21px; }.steps { gap:12px; }.steps article { grid-template-columns:34px 52px 1fr;padding:14px 0; }.step-icon { font-size:37px; }.steps h3 { font-size:20px; }.memory-banner { padding:47px 17px calc(47px + env(safe-area-inset-bottom)); }footer { padding:16px 14px calc(16px + env(safe-area-inset-bottom));gap:12px; }
  .welcome-screen { align-items:start;overflow-y:auto;padding:var(--safe-top) 14px var(--safe-bottom); }.welcome-card { min-height:0;margin:12px auto;padding:31px 24px 26px;box-shadow:7px 7px 0 var(--red); }.welcome-card .brand { margin-bottom:39px; }.welcome-card h2 { font-size:clamp(42px,13vw,54px);margin-bottom:26px; }.welcome-primary { min-height:50px; }.auth-form input,.profile-card input,.wifi-room-card input,.wifi-room-card select,.clan-builder input { font-size:16px; }
  .workshop-modal,.profile-modal,.game-menu-modal { padding:var(--safe-top) 10px var(--safe-bottom); }.workshop-card,.championship-card,.profile-card,.game-menu-card,.wifi-room-card { width:100%;margin:4px auto;padding:28px 16px 22px;box-shadow:5px 5px 0 var(--yellow); }.workshop-card h2,.championship-card h2,.profile-card h2,.game-menu-card h2,.wifi-room-card h2 { font-size:clamp(34px,10vw,45px);padding-right:28px; }.close-button { min-width:44px;min-height:44px;right:4px;top:4px; }.collection-grid,.stat-upgrades,.materials { flex-wrap:nowrap;overflow-x:auto;padding:2px 2px 9px;scroll-snap-type:x mandatory; }.pen-card,.upgrade-card,.material-card { flex:0 0 132px;scroll-snap-align:start; }.championship-grid,.wifi-room-setup { grid-template-columns:1fr; }.wifi-divider { padding:2px 0; }.bracket { overflow-x:auto; }
}
@media (max-width:370px) { .brand { font-size:13px; }.token-count { display:none; }.hero { padding-inline:18px; }.mode-options button { font-size:12px; }.game-stage { height:340px; } }
@media (max-width:900px) and (orientation:landscape) { .topbar { position:relative; }.hero { grid-template-columns:1fr 1fr;min-height:0;padding-block:34px; }.hero-art { min-height:220px; }.game-stage { height:min(68vh,410px); }.welcome-card { margin:5px auto; } }
@media (hover:none) and (pointer:coarse) { button,.primary-cta,.mode-options button,.environment-options button { min-height:44px; }.primary-cta:hover,.start-button:hover { transform:none; } }