/* Shared mobile game controls. Gameplay and currency rules remain in each game. */
html:has(.portal-refresh) { background: #17151b; }
html:has(.portal-fishing, .portal-pets) { background: #10221d; }
.portal-refresh {
  color-scheme: dark;
  --text: #f3eff5; --ink: #f3eff5; --muted: #bab4c1; --dim: #a39bab;
  --purple: #decbea; --red: #e4a4ac; --green: #a8d4b6;
  --line: rgba(243,239,245,.14);
  font-family: system-ui, -apple-system, "Noto Sans TC", sans-serif;
  padding: 0;
}
.portal-refresh:is(.portal-fishing,.portal-pets) { --muted:#afc5b9; --dim:#9eb6a9; --panel:#192d24; --green:#a8d4b6; }
.portal-refresh .app-header { min-height:68px; background:transparent; border-bottom:1px solid var(--line); }
.portal-refresh .brand, .portal-refresh .portal-nav a { color:var(--text); }
.portal-refresh .portal-nav a { min-height:44px; display:flex; align-items:center; font-size:12px; }
.portal-refresh .portal-nav a:hover { background:rgba(222,203,234,.1); color:var(--purple); }
.portal-refresh .avatar { width:44px; height:44px; background:rgba(255,255,255,.07); border-color:var(--line); }
.portal-refresh .brand b { font-size:23px; }
.portal-refresh button, .portal-refresh a { touch-action:manipulation; }
.portal-refresh :is(button, input, .game-login-button) { border-radius:12px; }
.portal-refresh :is(a,button,input):focus-visible { outline:2px solid var(--purple); outline-offset:3px; }
.portal-refresh .hero { padding:18px 0 16px; }
.portal-refresh .hero h1 { font-size:25px; letter-spacing:-.03em; }
.portal-refresh .hero > p:last-child { margin:6px 0 0; font-size:13px; line-height:1.5; }
.portal-refresh .view { padding:20px 16px 28px; }
.portal-refresh h1 { font-size:25px; line-height:1.35; overflow-wrap:anywhere; }
.portal-refresh h2 { font-size:19px; line-height:1.4; }
.portal-refresh #player-status, .portal-refresh .sync-state { display:none; }
.portal-refresh .game-help { margin:16px 0; border:1px solid var(--line); border-radius:12px; color:var(--muted); }
.portal-refresh .game-help summary { padding:12px 14px; min-height:44px; cursor:pointer; font-size:13px; }
.portal-refresh .game-help > div { padding:0 14px 4px; font-size:13px; line-height:1.75; }
.portal-refresh .game-help p { margin:0 0 12px; }
.portal-refresh .system-message { margin:20px 16px; padding:20px; font-size:14px; }
.portal-refresh .system-message a { margin-top:16px; }
.portal-refresh .needs-login { color:var(--text); padding:24px; border:1px solid var(--line); border-radius:14px; background:rgba(255,255,255,.035); text-align:left; }
.portal-refresh .needs-login h2, .portal-refresh .needs-login > b { display:block; margin:0 0 8px; font-size:21px; }
.portal-refresh .needs-login p { font-size:14px; line-height:1.7; color:var(--muted); margin:0 0 20px; }
.portal-refresh .game-login-button { display:flex; align-items:center; justify-content:center; min-height:48px; margin:16px 0 0; padding:12px 20px; color:#251d2b; background:var(--purple); font-size:15px; font-weight:650; text-decoration:none; }
.portal-refresh footer { padding-top:20px; color:var(--dim); font-size:11px; gap:12px; }
.portal-refresh footer small { font-size:11px; }
.portal-refresh .dialog-message, .portal-refresh .form-message { font-size:13px; line-height:1.5; }
.portal-refresh .game-nav-icon { width:24px; height:24px; flex:none; }
/* Fishing: keep the pond prominent and the cast control within thumb reach. */
.portal-fishing .pond-card { height:250px; }
.portal-fishing .pond-copy strong { font-size:36px; }
.portal-fishing .pond-copy small, .portal-fishing .pond-hint { font-size:12px; }
.portal-fishing .pond-hint { bottom:16px; padding-inline:12px; }
.portal-fishing .pond-hud { font-size:11px; }
.portal-fishing .primary-button, .portal-fishing .secondary-button { min-height:48px; font-size:15px; }
.portal-fishing .status-card, .portal-fishing .link-card, .portal-fishing .basket-card { padding:18px; }
.portal-fishing #ready-view[data-playable="true"] { margin-top:10px; padding:0; border:0; background:transparent; }
.portal-fishing #ready-view[data-playable="true"] :is(.status-icon,#line-player,#ready-title,#ready-message,.how-to-play,.text-link,.identity-row small) { display:none; }
.portal-fishing #ready-view[data-playable="true"] .identity-row { margin:0; padding:10px 0; background:transparent; border:0; }
.portal-fishing .identity-row b { font-size:14px; }
.portal-fishing .player-avatar { width:32px; height:32px; }
.portal-fishing .basket-heading h2 { font-size:19px; }
.portal-fishing .basket-value small, .portal-fishing .basket-stats, .portal-fishing .sync-note { font-size:12px; }
.portal-fishing .catch-list :is(b,span,small) { font-size:12px; }
.portal-fishing .catch-close { min-width:44px; min-height:44px; }
.portal-fishing .link-card > p, .portal-fishing .status-card p { font-size:14px; line-height:1.6; }
.portal-fishing .link-card label { font-size:13px; }
/* Pets: compact scene, legible meters and separate food purchase/feed actions. */
.portal-pets .pet-stage { height:238px; }
.portal-pets .panda { bottom:24px; right:40px; }
.portal-pets .speech { max-width:190px; font-size:12px; padding:8px 10px; }
.portal-pets .level-chip { font-size:12px; }
.portal-pets :is(.pet-card,.earn-card,.shop-card) { padding:16px; }
.portal-pets .pet-title small { display:none; }
.portal-pets .pet-title h2 { font-size:21px; }
.portal-pets .pet-title button { min-height:44px; min-width:56px; font-size:13px; }
.portal-pets .meters { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:14px; }
.portal-pets .meters > div > span { font-size:12px; }
.portal-pets .meters em { font-size:11px; }
.portal-pets .actions button, .portal-pets .earn-card button { min-height:50px; font-size:15px; }
.portal-pets .action-message { font-size:13px; line-height:1.6; min-height:0; }
.portal-pets .action-message:empty { display:none; }
.portal-pets .earn-card h2, .portal-pets .shop-card h2 { font-size:18px; }
.portal-pets .earn-card p:not(.eyebrow), .portal-pets .section-title small { font-size:12px; }
.portal-pets .earn-card > strong small { font-size:12px; }
.portal-pets .food-row { grid-template-columns:32px minmax(0,1fr); gap:10px; padding:12px; }
.portal-pets .food-copy b { font-size:14px; }
.portal-pets .food-copy small { font-size:12px; line-height:1.5; }
.portal-pets .food-actions { grid-column:1/-1; display:flex; align-items:center; gap:8px; }
.portal-pets .food-actions small { margin:0 auto 0 0; font-size:12px; }
.portal-pets .food-actions button { min-height:44px; min-width:64px; font-size:13px; }
.portal-pets .food-actions button + button { margin:0; }
.portal-pets dialog { max-height:calc(100dvh - 40px); overflow:auto; }
.portal-pets dialog button { min-height:48px; }
.game-input-label { display:block; font-size:13px; color:var(--muted); margin-bottom:8px; }
/* Quiz: four large choices with clear correct/error feedback. */
.portal-wordquiz main > .game-help { margin:12px 16px 0; }
.portal-wordquiz .view { padding-top:14px; }
.portal-wordquiz .quiz-progress { margin-top:14px; padding:12px; }
.portal-wordquiz .quiz-progress-top { flex-wrap:wrap; font-size:12px; gap:6px; }
.portal-wordquiz .quiz-progress-top b { font-size:14px; }
.portal-wordquiz .quiz-block { margin-top:14px; }
.portal-wordquiz .quiz-card { padding:20px 16px 16px; border-radius:14px; }
.portal-wordquiz .quiz-word { margin:0 0 20px; font-size:36px; }
.portal-wordquiz .quiz-options { grid-template-columns:1fr; gap:8px; }
.portal-wordquiz .quiz-option { min-height:52px; padding:12px; border-radius:10px; font-size:16px; }
.portal-wordquiz .quiz-option.correct { color:#bce5c9; border-color:#a8d4b6; background:#2d4739; }
.portal-wordquiz .quiz-option.wrong { color:#f1bcc2; border-color:#e4a4ac; background:#4a2d36; }
.portal-wordquiz .quiz-capped p { font-size:14px; }
.portal-wordquiz .quiz-capped .submit-order { min-height:48px; font-size:14px; }
.portal-refresh .order-row b { font-size:13px; }
.portal-refresh .order-row :is(small,em), .portal-refresh .empty { font-size:12px; }
/* Exchange: real icons, readable quotes and bottom navigation. */
.portal-stock .asset-card { min-height:150px; padding:16px; margin-top:16px; border-radius:14px; box-shadow:none; }
.portal-stock .asset-card strong { font-size:30px; margin-top:12px; }
.portal-stock .asset-top { align-items:center; font-size:13px; }
.portal-stock .asset-top button { min-height:44px; min-width:44px; font-size:13px; }
.portal-stock .asset-meta { font-size:12px; }
.portal-stock .asset-meta small, .portal-stock .pixel-bars { display:none; }
.portal-stock .quick { min-height:88px; padding:14px; border-radius:12px; gap:8px; }
.portal-stock .quick b { font-size:14px; margin:0; }
.portal-stock .quick small { display:none; }
.portal-stock .block-title button { min-height:44px; font-size:13px; display:flex; align-items:center; gap:6px; }
.portal-stock .stock-row { min-height:68px; padding:12px; border-radius:12px; }
.portal-stock .stock-copy b { font-size:14px; }
.portal-stock .stock-copy small, .portal-stock .stock-quote small { font-size:12px; }
.portal-stock .stock-quote b { font-size:16px; }
.portal-stock .stock-symbol { font-size:12px; }
.portal-stock .sector-tabs button { min-height:44px; padding:10px 14px; font-size:13px; }
.portal-stock .simulation-banner { grid-template-columns:1fr; padding:12px; }
.portal-stock .simulation-banner > span { display:none; }
.portal-stock .simulation-banner b { font-size:13px; }
.portal-stock .simulation-banner p { font-size:12px; }
.portal-stock .title-row > #quote-age { font-size:11px; }
.portal-stock .summary { padding:14px; gap:10px; }
.portal-stock .summary small, .portal-stock .portfolio-note { font-size:12px; }
.portal-stock .summary b { font-size:15px; overflow-wrap:anywhere; }
.portal-stock .holding-heading b { font-size:14px; }
.portal-stock .holding-metrics small { font-size:11px; }
.portal-stock .holding-metrics b { font-size:13px; }
.portal-stock .holding-pnl > small, .portal-stock .holding-pnl strong, .portal-stock .holding-pnl em { font-size:12px; }
.portal-stock .portfolio-sync button { min-height:44px; font-size:12px; padding:8px 12px; }
.portal-stock .portfolio-sync span { font-size:11px; }
.portal-stock .settings b { font-size:14px; }
.portal-stock .settings :is(small,em), .portal-stock .identity small { font-size:12px; }
.portal-stock .bottom-nav { padding:8px 12px calc(8px + env(safe-area-inset-bottom)); background:#211c27; }
.portal-stock .bottom-nav button { min-height:48px; font-size:12px; gap:4px; }
.portal-stock .bottom-nav button.active { color:var(--purple); background:rgba(222,203,234,.08); }
.portal-stock .dialog { background:#25202c; border-radius:16px; padding:22px 18px; max-height:calc(100dvh - 32px); }
.portal-stock .dialog-close { width:44px; height:44px; }
.portal-stock .trade-title { padding-top:38px; }
.portal-stock .dialog :is(label,.estimate), .portal-stock .trade-title small { font-size:13px; }
.portal-stock .dialog label.consent { min-height:44px; align-items:center; grid-template-columns:22px 1fr; gap:10px; }
.portal-stock .dialog label.consent input { width:22px; height:22px; }
.portal-stock .segmented button { min-height:48px; }
.portal-stock .order-warning :is(b,span) { font-size:12px; }
.portal-stock .submit-order { min-height:52px; font-size:15px; }
.portal-stock .submit-order:disabled { color:#b8afc1; background:#38313f; }
.portal-refresh .toast { font-size:13px; bottom:calc(96px + env(safe-area-inset-bottom)); }
/* Rankings: finger-sized filters and room for long player names. */
.portal-rank .lede { font-size:12px; margin-top:8px; }
.portal-rank .chips { margin-inline:-16px; padding-inline:16px; gap:8px; }
.portal-rank .chip { min-height:44px; font-size:13px; padding:10px 14px; }
.portal-rank .board { padding:14px; border-radius:12px; }
.portal-rank .board-head { align-items:start; }
.portal-rank .board-head small, .portal-rank #board-total { font-size:12px; }
.portal-rank .row { min-height:58px; gap:8px; padding:10px 4px; }
.portal-rank .row :is(.name,.value) { font-size:14px; }
.portal-rank .mine-note, .portal-rank .back-link { font-size:13px; }
.portal-rank .back-link { min-height:44px; display:flex; align-items:center; justify-content:center; gap:8px; }
@media(max-width:620px) {
  .portal-refresh:is(.portal-fishing,.portal-pets) .shell { padding-inline:16px; }
  .portal-refresh:is(.portal-fishing,.portal-pets) .app-header { margin-inline:-16px; padding-inline:16px; }
  .portal-fishing #ready-view[data-playable="true"] .game-action-dock,
  .portal-pets #game-view:not([hidden]) .actions {
    position:fixed; z-index:8; bottom:0; left:0; right:0; margin:0 auto;
    max-width:620px; padding:12px 16px calc(12px + env(safe-area-inset-bottom));
    background:#172c23; border-top:1px solid var(--line);
  }
  .portal-fishing .game-action-dock .cast-button { width:100%; min-height:52px; margin:0; }
  .portal-pets .actions button { min-height:52px; }
  .portal-fishing .shell:has(#ready-view[data-playable="true"]:not([hidden])),
  .portal-pets .shell:has(#game-view:not([hidden])) { padding-bottom:calc(112px + env(safe-area-inset-bottom)); }
  .portal-stock .bottom-nav { position:fixed; bottom:0; left:0; right:0; max-width:620px; margin:auto; z-index:8; }
  .portal-stock .app-shell:has(#bottom-nav:not([hidden])) { padding-bottom:calc(92px + env(safe-area-inset-bottom)); }
  .portal-stock .dialog-backdrop { align-items:end; padding:16px 0 0; }
  .portal-stock .dialog { width:100%; border-bottom:0; border-radius:18px 18px 0 0; padding-bottom:calc(24px + env(safe-area-inset-bottom)); }
}
@media(prefers-reduced-motion:reduce) {
  .portal-refresh *, .portal-refresh *::before, .portal-refresh *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition:none !important; }
}
.portal-stock .portfolio-sync button { display:flex; align-items:center; gap:6px; }
.portal-stock .portfolio-sync .game-nav-icon { width:16px; height:16px; }
.portal-refresh .brand { min-height:44px; display:flex; align-items:center; }
.portal-fishing .basket-value strong { font-size:24px; }
.portal-fishing .catch-empty { font-size:13px; }
/* A backdrop filter would make the cast dock stick to its card instead of the viewport. */
.portal-fishing #ready-view[data-playable="true"] { backdrop-filter:none; }
