@property --state-color{syntax: "<color>"; inherits: true; initial-value: #2dd4bf;}:root{--bg: #070b14;--panel: rgba(255, 255, 255, .04);--panel-2: rgba(255, 255, 255, .07);--border: rgba(148, 163, 184, .16);--text: #e6edf7;--muted: #8b98ad;--ok: #2dd4bf;--warn: #fbbf24;--danger: #fb7185;--state-color: var(--ok);--radius: 16px;--font: "Inter", "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Hiragino Sans", sans-serif}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100vh}body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}.num{font-variant-numeric:tabular-nums;letter-spacing:-.02em}.app{min-height:100vh;display:flex;flex-direction:column;position:relative;background:radial-gradient(900px 500px at 15% -10%,color-mix(in oklab,var(--state-color) 13%,transparent),transparent 70%),radial-gradient(800px 500px at 90% 110%,rgba(99,102,241,.12),transparent 70%),var(--bg);transition:--state-color .6s ease}.app[data-state=warn]{--state-color: var(--warn)}.app[data-state=over]{--state-color: var(--danger)}.app[data-state=paused]{--state-color: var(--muted)}.app[data-state=over]:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;box-shadow:inset 0 0 120px #fb71852e;animation:breathe 2.4s ease-in-out infinite;z-index:0}@keyframes breathe{0%,to{opacity:.5}50%{opacity:1}}.header{display:flex;align-items:baseline;gap:14px;padding:20px 28px;position:relative;z-index:1}.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:17px}.brand-mark{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,#2dd4bf,#38bdf8);color:#04141a;font-size:15px;font-weight:800}.tagline{color:var(--muted);font-size:12.5px}.main{flex:1;width:100%;max-width:1080px;margin:0 auto;padding:8px 28px 48px;position:relative;z-index:1}.footer{text-align:center;color:var(--muted);font-size:11.5px;padding:16px;position:relative;z-index:1}.screen{animation:rise .45s cubic-bezier(.22,1,.36,1)}@keyframes rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:22px 24px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.card+.card{margin-top:18px}.card-title{margin:0 0 4px;font-size:15px;font-weight:700}.card-desc{margin:0 0 16px;color:var(--muted);font-size:12.5px}.input{width:100%;background:#ffffff0d;border:1px solid var(--border);border-radius:10px;color:var(--text);font:inherit;padding:9px 12px;transition:border-color .15s,background .15s}.input:focus-visible{outline:none;border-color:var(--ok);background:#2dd4bf0f}.input::placeholder{color:#8b98ad8c}input[type=number]{-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none}.input-unit{display:flex;align-items:center;gap:8px}.input-unit>span{color:var(--muted);font-size:12.5px;white-space:nowrap}.input-unit-sm .input{width:90px;text-align:right}.field{margin-top:16px}.field-label{display:block;font-size:12.5px;font-weight:600;color:var(--muted);margin-bottom:6px}.field-hint{color:var(--muted);font-size:12px}.field-hint.center{text-align:center;margin:10px 0 0}.chip-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.chip{background:#ffffff0d;border:1px solid var(--border);border-radius:999px;color:var(--text);font:inherit;font-size:13px;padding:6px 14px;cursor:pointer;transition:all .15s}.chip:hover{border-color:#2dd4bf80}.chip-active{background:#2dd4bf24;border-color:var(--ok);color:var(--ok);font-weight:700}.btn{border:1px solid transparent;border-radius:12px;font:inherit;font-weight:700;padding:11px 22px;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s,border-color .15s}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,#2dd4bf,#38bdf8);color:#04141a;box-shadow:0 8px 24px #2dd4bf40}.btn-primary:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 12px 28px #2dd4bf59}.btn-ghost{background:#ffffff0d;border-color:var(--border);color:var(--text)}.btn-ghost:hover{border-color:#94a3b866;background:#ffffff14}.btn-danger{background:#fb71851f;border-color:#fb718573;color:#fda4af}.btn-danger:hover{background:#fb718533;transform:translateY(-1px)}.btn-sm{padding:6px 14px;font-size:13px;font-weight:600}.btn-quiet{color:var(--muted)}.icon-btn{background:none;border:1px solid transparent;border-radius:8px;color:var(--muted);font-size:18px;width:32px;height:32px;cursor:pointer;transition:all .15s}.icon-btn:not(:disabled):hover{color:var(--danger);border-color:#fb718566}.icon-btn:disabled{opacity:.25;cursor:not-allowed}button:focus-visible{outline:2px solid var(--ok);outline-offset:2px}.setup-grid{display:grid;grid-template-columns:1fr 340px;gap:18px;align-items:start}.pattern-rows{display:flex;flex-direction:column;gap:10px;margin-bottom:14px}.pattern-row{display:grid;grid-template-columns:1fr 150px 90px 110px 32px;gap:10px;align-items:center}.pattern-subtotal{text-align:right;font-size:13px;color:var(--muted);white-space:nowrap}.setup-side{position:sticky;top:20px}.summary-card{background:linear-gradient(180deg,#2dd4bf12,#ffffff08);border-color:#2dd4bf40}.summary-hero{font-size:40px;font-weight:800;line-height:1.15;margin-top:8px}.summary-hero-unit{font-size:17px;font-weight:600;color:var(--muted);margin-left:4px}.summary-sub{color:var(--muted);font-size:13px;margin-bottom:14px}.summary-rows{margin:0 0 18px;border-top:1px solid var(--border)}.summary-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:10px 0;border-bottom:1px solid var(--border)}.summary-row dt{color:var(--muted);font-size:12.5px}.summary-row dd{margin:0;font-weight:700;font-size:15px}.accent{background:linear-gradient(90deg,#38bdf8,#818cf8);-webkit-background-clip:text;background-clip:text;color:transparent}.btn-start{width:100%;font-size:16px;padding:14px}.template-save{display:grid;grid-template-columns:1fr auto;gap:10px;margin-bottom:14px}.template-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.template-item{display:flex;justify-content:space-between;align-items:center;gap:12px;background:#ffffff08;border:1px solid var(--border);border-radius:12px;padding:10px 14px}.template-name{font-weight:700;display:block}.template-meta{color:var(--muted);font-size:12px}.template-actions{display:flex;gap:6px;flex-shrink:0}.timer{max-width:720px;margin:0 auto;padding-top:4vh;display:flex;flex-direction:column;align-items:center;text-align:center}.meeting-title{color:var(--muted);font-size:14px;font-weight:600;margin-bottom:10px}.status-chip{display:inline-block;border-radius:999px;padding:5px 16px;font-size:12.5px;font-weight:700;border:1px solid;margin-bottom:3vh}.status-ok{color:var(--ok);border-color:#2dd4bf66;background:#2dd4bf14}.status-warn{color:var(--warn);border-color:#fbbf2466;background:#fbbf2414}.status-over{color:var(--danger);border-color:#fb718580;background:#fb71851a;animation:breathe 2.4s ease-in-out infinite}.status-paused{color:var(--muted);border-color:var(--border);background:#ffffff0a}.hero-label{color:var(--muted);font-size:14px;font-weight:600}.hero-value{font-size:clamp(56px,13vw,110px);font-weight:800;line-height:1.05;color:var(--state-color);transition:color .6s ease;text-shadow:0 0 60px color-mix(in oklab,var(--state-color) 35%,transparent)}.app[data-state=paused] .hero-value{color:var(--text);opacity:.55;text-shadow:none}.hero-sub{color:var(--muted);font-size:13.5px;margin-top:6px}.sales-line{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:3.5vh}.sales-label{color:var(--muted);font-size:13.5px}.sales-value{font-size:clamp(26px,5vw,38px);font-weight:800;background:linear-gradient(90deg,#38bdf8,#818cf8);-webkit-background-clip:text;background-clip:text;color:transparent}.sales-note{color:var(--muted);font-size:12px}.progress-block{width:100%;max-width:560px;margin-top:4vh}.progress-meta{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:8px}.elapsed{font-size:24px;font-weight:800}.progress-plan{color:var(--muted);font-size:12.5px}.progress-track{height:8px;border-radius:999px;background:#ffffff12;overflow:hidden}.progress-fill{height:100%;border-radius:999px;background:var(--state-color);transition:width .2s linear,background .6s ease}.progress-over .progress-fill{background:repeating-linear-gradient(-45deg,var(--danger) 0 10px,color-mix(in oklab,var(--danger) 65%,black) 10px 20px);background-size:28px 100%;animation:march 1.2s linear infinite}@keyframes march{to{background-position:28px 0}}.over-note{margin-top:8px;color:var(--danger);font-size:13px;font-weight:700;text-align:right}.controls{display:flex;gap:12px;justify-content:center;margin-top:5vh;flex-wrap:wrap}.result{max-width:760px;margin:0 auto;padding-top:3vh;display:flex;flex-direction:column;align-items:center;text-align:center}.result-title{margin:0 0 20px;font-size:22px}.result-grid{display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:14px;width:100%;align-items:stretch}.stat-card{padding:18px}.stat-main{border-color:#2dd4bf4d;background:linear-gradient(180deg,#2dd4bf14,#ffffff08)}.stat-label{color:var(--muted);font-size:12.5px;font-weight:600}.stat-value{font-size:clamp(22px,4vw,34px);font-weight:800;margin-top:4px}.stat-main .stat-value{font-size:clamp(28px,5vw,42px)}.stat-sub{color:var(--muted);font-size:12px;margin-top:4px}.verdict{margin:20px 0 4px;color:var(--text);font-size:14.5px}.breakdown{width:100%;margin-top:18px;text-align:left}.breakdown-list{list-style:none;margin:8px 0 0;padding:0}.breakdown-row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--border);font-size:14px}.breakdown-row:last-child{border-bottom:none}.breakdown-row .num:last-child{font-weight:700}.muted{color:var(--muted);font-size:12.5px}@media(max-width:860px){.setup-grid{grid-template-columns:1fr}.setup-side{position:static;order:-1}.result-grid{grid-template-columns:1fr}.main{padding:4px 16px 40px}.header{padding:16px;flex-wrap:wrap;gap:6px}}@media(max-width:640px){.pattern-row{grid-template-columns:1fr 32px;background:#ffffff08;border:1px solid var(--border);border-radius:12px;padding:12px;row-gap:8px}.pattern-row>.input:first-child{grid-column:1}.pattern-row .icon-btn{grid-row:1;grid-column:2}.pattern-row .input-unit,.pattern-subtotal{grid-column:1 / -1}.pattern-subtotal{text-align:left}.template-item{flex-direction:column;align-items:flex-start}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}