@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap";
:root{--background:#f7f8fb;--surface:#ffffffe0;--surface-solid:#fff;--text:#171821;--muted:#777b8c;--muted-strong:#555a6d;--border:#1a1f341a;--accent:#5f63e8;--accent-dark:#4d51cd;--accent-soft:#eeefff;--danger:#c44747;--shadow:0 30px 90px #36395e24;--surface-subtle:#ffffff94;--surface-muted:#ffffffbd;--surface-field:#ffffffd1;--surface-field-focus:#fff;--surface-border-strong:#fffc;--field-border:#191c3221;--placeholder:#a4a7b4;--backdrop:#13141e47;--grid-line:#5f63e807;--running-background:#eeefffcc;--running-border:#5f63e833;--running-text:#4d51cd;--running-dot:#5f63e8;--running-halo:#5f63e81f;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}html[data-theme=dark]{--background:#111216;--surface:#1f2128eb;--surface-solid:#24262e;--text:#f1f2f6;--muted:#969aa9;--muted-strong:#c0c3cf;--border:#e8eaf41f;--accent:#9295ff;--accent-dark:#b2b4ff;--accent-soft:#6f73ff29;--danger:#ff8f8f;--shadow:0 30px 90px #0000006b;--surface-subtle:#2a2c35b3;--surface-muted:#2b2d36d1;--surface-field:#16171dc7;--surface-field-focus:#191a20;--surface-border-strong:#ffffff1a;--field-border:#e8eaf429;--placeholder:#747887;--backdrop:#0304079e;--grid-line:#9295ff0d;--running-background:#5256b433;--running-border:#9295ff57;--running-text:#d4d5ff;--running-dot:#aeb0ff;--running-halo:#5256b461;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html{background:var(--background);min-width:320px}body{min-width:320px;min-height:100vh;color:var(--text);background:var(--background);-webkit-font-smoothing:antialiased;margin:0;font-family:DM Sans,PingFang SC,Microsoft YaHei,sans-serif}button,input,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}.app-shell{isolation:isolate;grid-template-rows:auto 1fr auto;min-height:100dvh;padding:28px clamp(22px,5vw,64px) 22px;display:grid;position:relative;overflow:hidden}.app-shell:before{z-index:-3;content:"";background:linear-gradient(var(--grid-line) 1px, transparent 1px), linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);background-size:64px 64px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000000bf,#0000 82%);mask-image:linear-gradient(#000000bf,#0000 82%)}.ambient{z-index:-2;filter:blur(2px);opacity:.7;pointer-events:none;border-radius:50%;width:460px;height:460px;position:absolute}.ambient-one{background:radial-gradient(circle,#8689f633,#0000 68%);top:-250px;right:-120px}.ambient-two{background:radial-gradient(circle,#66c5d229,#0000 68%);bottom:-310px;left:-150px}.topbar,.footer-line{z-index:1;justify-content:space-between;align-items:center;width:100%;max-width:1240px;margin:0 auto;display:flex}.brand{color:var(--text);letter-spacing:-.05em;font-size:20px;font-weight:700;text-decoration:none}.brand span{color:var(--accent)}.topbar-actions{align-items:center;gap:10px;display:flex}.theme-switcher{border:1px solid var(--border);background:var(--surface-subtle);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:12px;grid-template-columns:repeat(3,32px);gap:2px;padding:3px;display:grid}.theme-option{cursor:pointer;width:32px;height:32px;color:var(--muted);background:0 0;border:0;border-radius:8px;place-items:center;padding:0;font-size:15px;line-height:1;transition:color .16s,background .16s,box-shadow .16s;display:grid}.theme-option:hover{color:var(--text);background:var(--accent-soft)}.theme-option[aria-pressed=true]{color:var(--accent-dark);background:var(--surface-solid);box-shadow:0 2px 8px #0000001f}.theme-option:focus-visible{outline-offset:2px;outline:3px solid #5f63e838}.status-dot{border:1px solid var(--border);min-height:32px;color:var(--muted-strong);background:var(--surface-subtle);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:999px;align-items:center;gap:9px;padding:0 13px;font-size:13px;font-weight:600;display:inline-flex}.status-dot>span{background:var(--muted);border-radius:50%;width:7px;height:7px}.status-dot.is-running{border-color:var(--running-border);color:var(--running-text);background:var(--running-background)}.status-dot.is-running>span{background:var(--running-dot);box-shadow:0 0 0 5px var(--running-halo);animation:1.8s ease-in-out infinite pulse}.clock-stage{text-align:center;flex-direction:column;justify-content:center;align-items:center;width:min(780px,100%);min-height:620px;margin:0 auto;display:flex}.date-line{color:var(--muted);letter-spacing:.08em;margin:0 0 20px;font-size:clamp(13px,1.3vw,15px);font-weight:600}.clock{letter-spacing:-.075em;font-variant-numeric:tabular-nums;text-shadow:0 12px 40px #20234014;margin:0;font-family:IBM Plex Mono,ui-monospace,monospace;font-size:clamp(58px,12vw,132px);font-weight:500;line-height:.92}.session-area{border:1px solid #0000;border-radius:24px;flex-direction:column;justify-content:center;align-items:center;width:min(560px,100%);min-height:134px;margin-top:clamp(42px,6vw,68px);padding:24px 34px;transition:all .22s;display:flex}.session-area.has-session{background:var(--surface-subtle);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-color:#5f63e81f;box-shadow:0 18px 55px #32365c12}.session-label{color:var(--muted);letter-spacing:.1em;text-transform:uppercase;margin:0;font-size:12px;font-weight:700}.session-name{color:var(--text);letter-spacing:-.04em;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:9px 0 6px;font-size:clamp(21px,3vw,30px);font-weight:700;line-height:1.25;display:-webkit-box;overflow:hidden}.elapsed{color:var(--accent);letter-spacing:.08em;font-variant-numeric:tabular-nums;margin:4px 0 0;font-family:IBM Plex Mono,ui-monospace,monospace;font-size:15px;font-weight:600}.entry-count{color:var(--muted-strong);margin:9px 0 0;font-size:12px;font-weight:700}.idle-copy{max-width:390px;color:var(--muted-strong);margin:12px 0 0;font-size:16px;line-height:1.75}.controls{grid-template-columns:1fr 1fr;gap:14px;width:min(410px,100%);margin-top:32px;display:grid}.button{cursor:pointer;border:1px solid #0000;border-radius:15px;justify-content:center;align-items:center;gap:10px;min-height:52px;padding:0 22px;font-size:15px;font-weight:700;transition:transform .16s,box-shadow .16s,color .16s,background .16s,border-color .16s;display:inline-flex}.button:hover:not(:disabled){transform:translateY(-2px)}.button:active:not(:disabled){transform:translateY(0)}.button:focus-visible,.dialog-close:focus-visible,input:focus-visible,textarea:focus-visible{outline-offset:3px;outline:3px solid #5f63e838}.button:disabled{cursor:not-allowed;opacity:.42}.button-primary{color:#fff;background:var(--accent);box-shadow:0 13px 30px #5f63e842}.button-primary:hover:not(:disabled){background:var(--accent-dark);box-shadow:0 16px 36px #5f63e852}.button-secondary{border-color:var(--border);color:var(--text);background:var(--surface-muted);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 10px 30px #2427460f}.button-secondary:hover:not(:disabled),.button-ghost:hover:not(:disabled){color:var(--accent-dark);background:var(--accent-soft);border-color:#5f63e840}.button-ghost{border-color:var(--border);color:var(--muted-strong);box-shadow:none;background:0 0}.button-icon{place-items:center;width:20px;height:20px;font-size:10px;display:inline-grid}.stop-icon:before{content:"";background:currentColor;border-radius:2px;width:9px;height:9px;display:block}.footer-line{color:var(--muted);letter-spacing:.035em;font-size:12px}.dialog-backdrop{z-index:20;background:var(--backdrop);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);place-items:center;padding:24px;animation:.16s ease-out both fade-in;display:grid;position:fixed;inset:0;overflow-y:auto}.dialog-card{border:1px solid var(--surface-border-strong);background:var(--surface);width:min(460px,100%);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border-radius:28px;padding:38px;animation:.22s cubic-bezier(.2,.8,.2,1) both dialog-in;position:relative}.dialog-card-wide{width:min(540px,100%)}.dialog-close{border:1px solid var(--border);cursor:pointer;width:34px;height:34px;color:var(--muted-strong);background:var(--surface-muted);border-radius:50%;place-items:center;padding:0;font-size:22px;line-height:1;transition:all .16s;display:grid;position:absolute;top:20px;right:20px}.dialog-close:hover{color:var(--text);background:var(--surface-solid);transform:rotate(5deg)}.dialog-kicker{color:var(--accent);letter-spacing:.1em;text-transform:uppercase;margin:0 0 10px;font-size:12px;font-weight:700}.dialog-card h2{letter-spacing:-.055em;margin:0;font-size:clamp(28px,5vw,38px);line-height:1.18}.dialog-copy{color:var(--muted-strong);margin:14px 0 28px;font-size:15px;line-height:1.7}.dialog-card form{margin-top:28px}.dialog-card label{color:var(--muted-strong);margin-bottom:9px;font-size:13px;font-weight:700;display:block}.dialog-card input,.dialog-card textarea{border:1px solid var(--field-border);width:100%;color:var(--text);background:var(--surface-field);box-shadow:inset 0 1px 0 var(--surface-border-strong);border-radius:15px;transition:all .16s}.dialog-card input{height:55px;padding:0 17px}.dialog-card textarea{resize:vertical;min-height:136px;padding:15px 17px;line-height:1.7}.dialog-card input::placeholder,.dialog-card textarea::placeholder{color:var(--placeholder)}.dialog-card input:hover,.dialog-card textarea:hover{border-color:#5f63e847}.dialog-card input:focus,.dialog-card textarea:focus{background:var(--surface-field-focus);border-color:#5f63e8a6;outline:none;box-shadow:0 0 0 4px #5f63e814}.dialog-card input[aria-invalid=true],.dialog-card textarea[aria-invalid=true]{border-color:#c4474799}.field-error{color:var(--danger);margin:9px 2px 0;font-size:13px;font-weight:600}.field-meta{color:var(--muted);justify-content:space-between;margin-top:9px;font-size:11px;display:flex}.dialog-actions{grid-template-columns:.86fr 1.4fr;gap:12px;margin-top:28px;display:grid}.session-summary{background:var(--accent-soft);border:1px solid #5f63e81f;border-radius:16px;justify-content:space-between;align-items:center;gap:18px;margin-top:28px;padding:16px 18px;display:flex}.session-summary span{text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:700;overflow:hidden}.session-summary strong{color:var(--accent-dark);font-variant-numeric:tabular-nums;flex:none;font-family:IBM Plex Mono,ui-monospace,monospace;font-size:13px}.entry-history{margin-top:22px}.entry-history-title{color:var(--muted-strong);margin:0 0 9px;font-size:12px;font-weight:700}.entry-history-list{overscroll-behavior:contain;gap:8px;max-height:180px;padding-right:4px;display:grid;overflow-y:auto}.entry-history-item{border:1px solid var(--border);color:var(--text);background:var(--surface-subtle);overflow-wrap:anywhere;white-space:pre-wrap;border-radius:12px;margin:0;padding:12px 14px;font-size:13px;line-height:1.65}.spinner{border:2px solid #ffffff73;border-top-color:#fff;border-radius:50%;width:16px;height:16px;animation:.75s linear infinite spin}.toast{z-index:30;min-height:48px;color:var(--accent-dark);background:var(--surface);opacity:0;pointer-events:none;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid #5f63e829;border-radius:14px;align-items:center;gap:10px;padding:0 18px;font-size:14px;font-weight:700;transition:all .22s;display:inline-flex;position:fixed;bottom:30px;left:50%;transform:translate(-50%,20px);box-shadow:0 18px 50px #30345a2e}.toast span{color:#fff;background:var(--accent);border-radius:50%;place-items:center;width:23px;height:23px;font-size:12px;display:grid}.toast.is-visible{opacity:1;transform:translate(-50%)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes dialog-in{0%{opacity:0;transform:translateY(18px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.55}}@keyframes spin{to{transform:rotate(360deg)}}@media (max-height:760px){.clock-stage{min-height:540px}.session-area{margin-top:34px}}@media (max-width:640px){.app-shell{min-height:100dvh;padding:max(18px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));overflow:hidden auto}.topbar{align-items:flex-start;gap:12px}.brand{padding-top:7px}.topbar-actions{flex-direction:column-reverse;align-items:flex-end;gap:6px;min-width:0}.status-dot{min-height:28px;padding:0 10px;font-size:12px}.clock-stage{min-height:min(570px,100dvh - 130px);padding:32px 0}.clock{max-width:100%;font-size:clamp(48px,18vw,82px)}.session-area{min-height:126px;margin-top:40px;padding:22px 16px}.controls{grid-template-columns:1fr;gap:10px}.button{border-radius:14px;width:100%;min-height:54px;padding:0 14px}.footer-line{text-align:left;flex-direction:column;justify-content:center;align-items:flex-start;gap:4px}.footer-line span:first-child{display:inline}.dialog-backdrop{align-items:end;padding:0}.dialog-card,.dialog-card-wide{width:100%;max-height:min(88dvh,760px);padding:34px max(20px, env(safe-area-inset-right)) max(24px, calc(env(safe-area-inset-bottom) + 16px)) max(20px, env(safe-area-inset-left));border-bottom:0;border-left:0;border-right:0;border-radius:24px 24px 0 0;animation-name:sheet-in;overflow-y:auto}.dialog-actions{grid-template-columns:1fr}.dialog-actions .button-primary{grid-row:1}.session-summary{flex-direction:column;align-items:flex-start;gap:8px}.entry-history{margin-top:18px}.entry-history-list{max-height:160px}.entry-history-item{padding:11px 12px}}@media (max-width:360px){.theme-switcher{grid-template-columns:repeat(3,30px)}.theme-option{width:30px;height:30px}.clock{font-size:clamp(46px,17vw,62px)}.date-line{font-size:12px}}@keyframes sheet-in{0%{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
