:root{color-scheme:dark;--bg: #101826;--bg-deep: #0b111c;--text: #eef2f8;--text-soft: #aab6c8;--text-faint: #7f8da3;--accent: #7dd3fc;--accent-strong: #38bdf8;--accent-ink: #062033;--gold: #e8c07a;--danger: #fda4af;--ok: #6ee7b7;--glass: rgba(17, 25, 40, .6);--glass-strong: rgba(13, 20, 34, .78);--glass-border: rgba(255, 255, 255, .1);--glass-hover: rgba(125, 211, 252, .14);--shadow-panel: 0 20px 50px rgba(2, 6, 16, .45);--shadow-glow: 0 0 0 1px rgba(125, 211, 252, .18), 0 10px 34px rgba(2, 6, 16, .5);--radius-lg: 20px;--radius-md: 14px;--radius-sm: 10px;--focus-ring: rgba(125, 211, 252, .85);--safe-top: env(safe-area-inset-top, 0px);--safe-right: env(safe-area-inset-right, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--font-sans: "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Microsoft YaHei", system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono: ui-monospace, "SF Mono", "Cascadia Mono", "JetBrains Mono", Consolas, monospace}*,*:before,*:after{box-sizing:border-box}html,body,#app{min-width:320px;min-height:100%;margin:0}html{background:var(--bg)}body{font-family:var(--font-sans);color:var(--text);line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}button,textarea,input{font:inherit;color:inherit}button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}[hidden]{display:none!important}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}:focus:not(:focus-visible){outline:none}:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}::selection{background:#7dd3fc59;color:var(--text)}.icon{width:1.15em;height:1.15em;flex:none}.weather-app{position:relative;isolation:isolate;min-height:100dvh;background-color:var(--bg);background-image:radial-gradient(1100px 560px at 75% -10%,rgba(56,189,248,.16),transparent 60%),radial-gradient(900px 520px at 5% 110%,rgba(232,192,122,.08),transparent 60%),linear-gradient(180deg,var(--bg) 0%,var(--bg-deep) 100%)}.view{position:relative;min-height:100dvh}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:44px;padding:.55rem 1.05rem;border-radius:var(--radius-md);border:1px solid var(--glass-border);background:var(--glass);color:var(--text);font-weight:600;line-height:1.2;cursor:pointer;user-select:none;text-decoration:none;transition:background-color .18s ease,border-color .18s ease,transform .12s ease,box-shadow .18s ease}.btn:hover{background:var(--glass-strong);border-color:#7dd3fc66}.btn:active{transform:translateY(1px)}.btn:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}.btn--primary{background:linear-gradient(135deg,var(--accent) 0%,var(--accent-strong) 100%);border-color:transparent;color:var(--accent-ink);box-shadow:0 8px 22px #38bdf847}.btn--primary:hover{background:linear-gradient(135deg,#8fd9fd,#4cc3f9);border-color:transparent}.btn--ghost{background:transparent}.btn--ghost:hover{background:var(--glass)}.btn--danger{color:var(--danger);border-color:#fda4af52}.btn--danger:hover{background:#fda4af1f;border-color:#fda4af80}.btn--icon{width:44px;height:44px;padding:0;border-radius:50%}.btn--lg{min-height:52px;padding:.75rem 1.6rem;font-size:1.05rem;border-radius:16px}.btn[disabled]{opacity:.45;cursor:not-allowed;pointer-events:none;box-shadow:none;transform:none}.btn.is-busy,.btn[aria-busy=true]{position:relative;cursor:wait;pointer-events:none;opacity:.8}.btn.is-busy .icon,.btn[aria-busy=true] .icon{visibility:hidden}.btn.is-busy:after,.btn[aria-busy=true]:after{content:"";position:absolute;inset:0;margin:auto;width:1.15em;height:1.15em;border-radius:50%;border:2.5px solid currentColor;border-top-color:transparent;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.view--welcome{display:flex;flex-direction:column;align-items:center;gap:2.6rem;max-width:1080px;margin:0 auto;padding:calc(var(--safe-top) + 3rem) max(1.25rem,var(--safe-right)) calc(var(--safe-bottom) + 2.5rem) max(1.25rem,var(--safe-left));text-align:center}.welcome__hero{display:flex;flex-direction:column;align-items:center;gap:1rem}.logo-mark{width:clamp(64px,18vw,84px);height:auto;color:var(--accent);filter:drop-shadow(0 10px 28px rgba(56,189,248,.35))}@media(prefers-reduced-motion:no-preference){.logo-mark{animation:float 6s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}}.eyebrow{margin:0;font-size:.72rem;font-weight:700;letter-spacing:.32em;text-transform:uppercase;color:var(--accent)}.welcome__title{margin:0;font-size:clamp(1.9rem,6.5vw,3.4rem);font-weight:800;line-height:1.22;letter-spacing:.01em;text-wrap:balance}.welcome__pitch{max-width:34rem;margin:.25rem auto 0;color:var(--text-soft);font-size:1.02rem;text-wrap:pretty}.welcome__badges{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin:.5rem 0 0;padding:0;list-style:none}.welcome__badge{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .8rem;border-radius:999px;border:1px solid var(--glass-border);background:var(--glass);color:var(--text-soft);font-size:.82rem;font-weight:500}.welcome__badge .icon{color:var(--ok)}.welcome__cta{display:flex;flex-direction:column;align-items:center;gap:.6rem;margin-top:1rem}.welcome__cta-note{margin:0;color:var(--text-faint);font-size:.86rem}.challenges{width:100%}.challenges__title{margin:0 0 1.1rem;font-size:1.15rem;font-weight:700;letter-spacing:.12em;color:var(--text-soft)}.challenge-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:1rem}.challenge-card{display:flex;flex-direction:column;align-items:flex-start;gap:.9rem;width:100%;min-height:100%;padding:1.3rem;border-radius:var(--radius-lg);border:1px solid var(--glass-border);background:var(--glass);color:var(--text);text-align:left;cursor:pointer;box-shadow:var(--shadow-panel);transition:transform .18s ease,border-color .18s ease,background-color .18s ease,box-shadow .18s ease}.challenge-card:hover{transform:translateY(-3px);border-color:#7dd3fc73;box-shadow:var(--shadow-glow)}.challenge-card:active{transform:translateY(0)}.challenge-card__icon{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,#38bdf838,#38bdf80f);border:1px solid rgba(125,211,252,.28);color:var(--accent)}.challenge-card__icon svg{width:26px;height:26px}.challenge-card__body{display:flex;flex-direction:column;gap:.5rem;flex:1 1 auto;width:100%;min-width:0}.challenge-card__title{font-size:1.12rem;font-weight:700}.challenge-card__desc{color:var(--text-soft);font-size:.9rem;line-height:1.6}.challenge-card__meta{display:flex;align-items:center;gap:.75rem;margin-top:auto;padding-top:.9rem}.challenge-card__duration{margin-right:auto;padding:.2rem .6rem;border-radius:999px;border:1px solid var(--glass-border);background:#ffffff0d;color:var(--text-faint);font-family:var(--font-mono);font-size:.78rem}.challenge-card__cta{display:inline-flex;align-items:center;gap:.25rem;color:var(--accent);font-size:.88rem;font-weight:700}.welcome__foot{max-width:40rem;margin:0 auto;color:var(--text-faint);font-size:.82rem;line-height:1.7}.welcome__foot p{margin:0}.view--session{position:fixed;inset:0;z-index:10;display:flex;flex-direction:column;gap:.7rem;overflow-y:auto;padding:calc(var(--safe-top) + .75rem) calc(var(--safe-right) + 1rem) calc(var(--safe-bottom) + .9rem) calc(var(--safe-left) + 1rem)}.sky-stage{position:fixed;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,#0c1524,#101826 55%,#0b111c)}.sky-stage:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#080c168c,#080c1600 26% 58%,#080c16ad)}#weather-canvas{position:absolute;inset:0;display:block;width:100%;height:100%}.session__bar,.session__hint,.session__status-row,.editor-panel,.privacy-note{position:relative;z-index:1}.session__bar{display:flex;align-items:center;gap:.55rem;padding:.45rem;border-radius:var(--radius-lg);border:1px solid var(--glass-border);background:var(--glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:var(--shadow-panel)}.session__mode{flex:1;min-width:0;padding-inline:.25rem;font-weight:700;font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.session__timer{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:.95rem;color:var(--text-soft);padding-inline:.35rem}#sound-toggle .icon-sound-off,#sound-toggle[aria-pressed=true] .icon-sound-on{display:none}#sound-toggle[aria-pressed=true] .icon-sound-off{display:block}.session__hint{align-self:center;max-width:min(92%,30rem);margin:0;padding:.5rem 1rem;border-radius:999px;border:1px solid var(--glass-border);background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:var(--text-soft);font-size:.88rem;text-align:center}.session__status-row{flex:1;display:flex;align-items:flex-end;justify-content:center;padding-bottom:.4rem}.session__status{margin:0;max-width:min(94%,32rem);padding:.45rem 1rem;border-radius:999px;background:#080c1680;border:1px solid var(--glass-border);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--text);font-size:.92rem;text-align:center}.editor-panel{border-radius:var(--radius-lg);border:1px solid var(--glass-border);background:var(--glass-strong);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:var(--shadow-panel);padding:.4rem;transition:border-color .18s ease,box-shadow .18s ease}.editor-panel:focus-within{border-color:#7dd3fc8c;box-shadow:var(--shadow-glow)}#weather-input{display:block;width:100%;min-height:clamp(7.5rem,26vh,13rem);max-height:40vh;padding:.8rem .95rem;border:0;border-radius:var(--radius-md);background:transparent;color:var(--text);font-size:1.05rem;line-height:1.75;resize:vertical;caret-color:var(--accent)}#weather-input::placeholder{color:var(--text-faint)}#weather-input:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.privacy-note{margin:0;text-align:center;color:var(--text-faint);font-size:.8rem}.view--result{display:flex;flex-direction:column;gap:1.4rem;max-width:1080px;margin:0 auto;padding:calc(var(--safe-top) + 2.2rem) max(1.25rem,var(--safe-right)) calc(var(--safe-bottom) + 1.5rem) max(1.25rem,var(--safe-left))}.result__head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.45rem}.result__title{margin:0;font-size:clamp(1.5rem,5vw,2.2rem);font-weight:800}.result__message{margin:.4rem auto 0;max-width:36rem;padding:.7rem 1.1rem;border-radius:var(--radius-md);border:1px solid rgba(125,211,252,.32);background:#7dd3fc1a;color:var(--text);font-size:.98rem}.result__score{margin:.15rem auto 0;font-size:2.4rem;font-weight:800;color:var(--accent);font-variant-numeric:tabular-nums;line-height:1.2}.panel{padding:1.3rem;border-radius:var(--radius-lg);border:1px solid var(--glass-border);background:var(--glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:var(--shadow-panel)}.panel__title{margin:0 0 1rem;font-size:.95rem;font-weight:700;letter-spacing:.14em;color:var(--text-soft)}.replay{display:flex;flex-direction:column;gap:.85rem}.replay__toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}.replay__time{margin-left:auto;font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--text-soft);font-size:.88rem;white-space:nowrap}#timeline-canvas{display:block;width:100%;height:clamp(110px,22vw,180px);border-radius:var(--radius-md);background:#080c1699;border:1px solid rgba(255,255,255,.06)}.replay__slider{appearance:none;-webkit-appearance:none;width:100%;height:30px;margin:0;background:transparent;cursor:pointer;touch-action:pan-x}.replay__slider::-webkit-slider-runnable-track{height:6px;border-radius:999px;background:#ffffff29}.replay__slider::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:24px;height:24px;margin-top:-9px;border-radius:50%;background:var(--accent);border:3px solid #0d1524;box-shadow:0 0 0 3px #38bdf847}.replay__slider::-moz-range-track{height:6px;border-radius:999px;background:#ffffff29}.replay__slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--accent);border:3px solid #0d1524;box-shadow:0 0 0 3px #38bdf847}.replay__slider:focus-visible{outline:3px solid var(--focus-ring);outline-offset:3px}.stat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,148px),1fr));gap:.75rem;margin:0}.stat{display:flex;flex-direction:column;gap:.3rem;padding:.9rem 1rem;border-radius:var(--radius-md);border:1px solid var(--glass-border);background:#ffffff0a}.stat dt{color:var(--text-faint);font-size:.78rem;letter-spacing:.06em}.stat dd{margin:0;font-size:1.35rem;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.25;color:var(--text)}.result__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem}@media(max-width:480px){.btn--lg{width:min(100%,22rem)}.replay__time{margin-left:0;width:100%;text-align:center}.result__actions .btn{flex:1 1 40%}#weather-input{font-size:1rem}}@media(min-width:720px){.view--welcome{gap:3.2rem}.challenge-card{padding:1.5rem}.panel{padding:1.6rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
