/* Home-screen app polish: notch, home bar, touch size, keyboard, update/offline/install bars. */
/* no pinch or double-tap zoom anywhere; scrolling still works */
html, body { touch-action: pan-x pan-y; }
html { -webkit-text-size-adjust: 100%; background: #07060d; overscroll-behavior-y: none; }
body { -webkit-tap-highlight-color: transparent; }
button, [role="button"], a, label, summary, select { touch-action: manipulation; -webkit-touch-callout: none; }
.is-app body { -webkit-user-select: none; user-select: none; }
.is-app input, .is-app textarea, .is-app pre, .is-app code, .is-app .selectable, .is-app [contenteditable] { -webkit-user-select: text; user-select: text; }
.is-app img, .is-app a { -webkit-user-drag: none; }

/* notch and landscape side insets */
body { padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); }
.hud-top { top: calc(14px + env(safe-area-inset-top)); }
@media (max-width: 980px) { .hud-top { top: calc(10px + env(safe-area-inset-top)); } }
.top { padding-top: env(safe-area-inset-top); height: calc(var(--top-h, 56px) + env(safe-area-inset-top)); }
.sheet { padding-top: max(22px, env(safe-area-inset-top)); padding-bottom: max(22px, env(safe-area-inset-bottom)); }
.dc-ai-overlay { padding-top: max(16px, env(safe-area-inset-top)); }

/* floating AI button clears the dock; user-dragged position still wins (inline style) */
@media (max-width: 980px) {
  .dc-ai-fab { bottom: calc(96px + env(safe-area-inset-bottom)); right: max(14px, env(safe-area-inset-right)); width: 52px; height: 52px; }
}
.kb-open .dock, .kb-open .dc-ai-fab, .kb-open #pw-install { display: none !important; }
.kb-open body { padding-bottom: 12px !important; }

/* iOS zooms into inputs under 16px; fingers need 40px+ */
@media (pointer: coarse) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea, .field { font-size: 16px; min-height: 42px; }
  .btn, button:not(.dk):not(.nv):not(.sb-btn):not(.pw-btn) { min-height: 40px; }
  input[type="checkbox"], input[type="radio"] { width: 22px; height: 22px; }
  a.chip, .chip.link { display: inline-flex; align-items: center; min-height: 38px; }
  .toast { font-size: 14px; }
}

/* bars */
.pw-bar { position: fixed; z-index: 2400; left: 12px; right: 12px; display: flex; align-items: center; gap: 12px; justify-content: space-between; padding: 12px 14px; border-radius: 16px; font: 500 14px/1.35 var(--f-body, system-ui); color: var(--text, #eee); background: color-mix(in srgb, var(--panel, #181430) 94%, transparent); border: 1px solid color-mix(in srgb, var(--accent, #9a78ff) 45%, transparent); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); box-shadow: 0 12px 34px rgba(0, 0, 0, .45); max-width: 520px; margin-inline: auto; }
.pw-bar[hidden] { display: none; }
.pw-update { bottom: calc(96px + env(safe-area-inset-bottom)); }
.pw-offline { top: calc(8px + env(safe-area-inset-top)); justify-content: center; text-align: center; font-size: 13px; border-color: color-mix(in srgb, var(--warn, #f5b84a) 55%, transparent); }
.pw-btn { appearance: none; border: 0; border-radius: 999px; padding: 10px 18px; min-height: 40px; font: 600 14px var(--f-body, system-ui); color: #14052f; background: linear-gradient(135deg, #e9deff, #a98bff); }
.pw-btn:disabled { opacity: .6; }
.pw-ghost { color: var(--text, #eee); background: transparent; border: 1px solid color-mix(in srgb, var(--text, #fff) 25%, transparent); }
.pw-install { position: fixed; z-index: 2300; left: 12px; right: 12px; bottom: calc(96px + env(safe-area-inset-bottom)); max-width: 440px; margin-inline: auto; padding: 16px; border-radius: 20px; color: var(--text, #eee); background: color-mix(in srgb, var(--panel, #181430) 95%, transparent); border: 1px solid color-mix(in srgb, var(--accent, #9a78ff) 45%, transparent); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); box-shadow: 0 16px 40px rgba(0, 0, 0, .5); }
.pw-install b { font-size: 15px; } .pw-install p { margin: 6px 0 12px; font-size: 14px; line-height: 1.5; color: var(--text-2, #cfc8e8); }
.pw-share { display: inline-flex; vertical-align: -3px; padding: 2px 4px; border-radius: 6px; border: 1px solid currentColor; }
.pw-row { display: flex; gap: 10px; }
.pw-ptr { position: fixed; z-index: 2200; left: 50%; top: calc(env(safe-area-inset-top) + 8px); width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; font-size: 20px; color: var(--text, #fff); background: var(--panel, #181430); border: 1px solid var(--line, #3a3560); opacity: 0; transform: translate(-50%, -40px); pointer-events: none; }
.pw-ptr.spin { opacity: 1 !important; transform: translate(-50%, 24px) !important; animation: pw-spin .7s linear infinite; }
@keyframes pw-spin { to { rotate: 360deg; } }
@media (prefers-reduced-motion: reduce) { .pw-ptr.spin { animation: none; } }

/* iOS zooms the whole page when a field under 16px gets focus, and stays zoomed after. Never let it. */
@supports (-webkit-touch-callout: none) {
  input, select, textarea, .field { font-size: 16px !important; }
}

/* Aether Studio drawer: header clears the status bar, footer clears the home bar */
.ax-drawer { padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom); }
@media (max-width: 560px) { .ax-drawer { width: 100vw; } }

/* v2.css zeroes .panel padding; cards that are also a panel must keep their own (text was touching the card edge) */
.panel.kt-panel, .panel.upd-head, .panel.src-head { padding: 18px 20px; }
.panel.up-card, .panel.rn-card, .panel.review-card, .panel.xf { padding: 16px 18px; }
.panel.store, .panel.score, .panel.agent { padding: 14px 16px; }
.panel.tpl { padding: 12px 14px; }
.panel.ve-panel { padding: 14px; }