.fclock{--fc-ease:cubic-bezier(.22, 1, .36, 1);--fc-fresh:var(--positive);--fc-stale:rgb(var(--accent-rgb))}.fclock-panel{border:1px solid var(--line);background:rgb(var(--bg-1-rgb) / .72);border-radius:28px;padding:22px;position:relative}@media (min-width:768px){.fclock-panel{padding:32px}}.fclock-result{background:radial-gradient(70% 50% at 100% 0%, rgb(var(--accent-rgb) / .08) 0%, transparent 60%), rgb(var(--bg-1-rgb) / .72);overflow:hidden;box-shadow:0 30px 80px -50px #00000059}.fclock-kicker{font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);font-size:11px}.fclock-note{color:var(--ink-2);align-items:center;gap:8px;font-size:13px;display:inline-flex}.fclock-note-dot{background:var(--fc-fresh);width:7px;height:7px;box-shadow:0 0 0 4px color-mix(in srgb, var(--fc-fresh) 18%, transparent);border-radius:50%}.fclock-note[data-example] .fclock-note-dot{background:var(--ink-2);box-shadow:0 0 0 4px color-mix(in srgb, var(--ink-2) 18%, transparent)}.fclock-chip{background:var(--ink-0);height:36px;color:var(--bg-0);transition:transform .2s var(--fc-ease), opacity .2s ease;border-radius:999px;align-items:center;padding:0 14px;font-size:13px;font-weight:500;display:inline-flex}.fclock-chip:hover{transform:translateY(-1px)}.fclock-chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.fclock-num{border:1px solid #0000;border-radius:12px;align-items:baseline;gap:8px;padding:2px 4px 4px 10px;transition:border-color .2s,background-color .2s;display:inline-flex}.fclock-num:hover{background:var(--surface-soft)}.fclock-num:focus-within{border-color:rgb(var(--accent-rgb) / .6);background:var(--bg-0)}.fclock-num input{text-align:right;min-width:2ch;max-width:7ch;font-family:var(--font-display);color:var(--ink-0);font-variant-numeric:tabular-nums;background:0 0;border:0;outline:none;font-size:clamp(30px,3.4vw,40px);line-height:1.05}.fclock-num input::selection{background:rgb(var(--accent-rgb) / .25)}.fclock-unit{font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);font-size:11px}.fclock-derived{color:var(--ink-1);font-variant-numeric:tabular-nums}.fclock-range{appearance:none;cursor:pointer;touch-action:pan-y;background:0 0;width:100%;height:28px;display:block}.fclock-range:focus-visible{outline:none}.fclock-range::-webkit-slider-runnable-track{background:linear-gradient(90deg, var(--accent) 0%, var(--accent-4) var(--fill), var(--line-strong) var(--fill));border-radius:6px;height:6px}.fclock-range::-moz-range-track{background:linear-gradient(90deg, var(--accent) 0%, var(--accent-4) var(--fill), var(--line-strong) var(--fill));border-radius:6px;height:6px}.fclock-range::-webkit-slider-thumb{appearance:none;background:var(--bg-0);border:2px solid var(--ink-0);width:22px;height:22px;-webkit-transition:transform .16s var(--fc-ease);transition:transform .16s var(--fc-ease);border-radius:50%;margin-top:-8px;box-shadow:0 4px 12px -4px #00000059}.fclock-range::-moz-range-thumb{background:var(--bg-0);border:2px solid var(--ink-0);border-radius:50%;width:18px;height:18px;box-shadow:0 4px 12px -4px #00000059}.fclock-range:hover::-webkit-slider-thumb{transform:scale(1.12)}.fclock-range:active::-webkit-slider-thumb{transform:scale(1.12)}.fclock-range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px rgb(var(--accent-rgb) / .3)}.fclock-range:focus-visible::-moz-range-thumb{box-shadow:0 0 0 4px rgb(var(--accent-rgb) / .3)}.fclock-segment{background:var(--surface-soft);border-radius:16px;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:4px;display:grid}.fclock-seg{text-align:center;min-height:44px;color:var(--ink-1);cursor:pointer;border-radius:12px;justify-content:center;align-items:center;padding:6px 8px;font-size:13px;line-height:1.25;transition:background-color .2s,color .2s,box-shadow .2s;display:flex}.fclock-seg:hover{color:var(--ink-0)}.fclock-seg[data-on]{background:var(--bg-0);color:var(--ink-0);font-weight:500;box-shadow:0 1px 2px #00000014,0 4px 14px -8px #00000040}.fclock-seg:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:1px}.fclock-mini{z-index:2;border:1px solid var(--line-strong);background:rgb(var(--bg-0-rgb) / .88);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:var(--ink-1);border-radius:999px;align-items:baseline;gap:10px;margin-top:4px;padding:10px 14px;font-size:13px;display:flex;position:sticky;bottom:12px;box-shadow:0 12px 30px -16px #0006}.fclock-mini-pct{font-family:var(--font-display);color:var(--fc-fresh);font-size:22px;line-height:1}.fclock-mini-pct[data-over]{color:var(--fc-stale)}@media (min-width:1024px){.fclock-mini{display:none}}.fclock-mini-gap{white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--ink-0);margin-left:auto}.fclock-ring{width:92px;height:92px}@media (min-width:640px){.fclock-ring{width:108px;height:108px}}.fclock-ring-fresh{fill:none;stroke:color-mix(in srgb, var(--fc-fresh) 55%, transparent);stroke-width:10px}.fclock-ring-stale{fill:none;stroke-width:10px;stroke-linecap:round}.fclock-hero{font-family:var(--font-display);letter-spacing:-.02em;color:var(--fc-fresh);font-variant-numeric:tabular-nums;align-items:baseline;font-size:clamp(56px,8vw,92px);line-height:.9;display:flex}.fclock-hero[data-over]{background:linear-gradient(120deg, var(--accent), var(--accent-4));color:#0000;-webkit-background-clip:text;background-clip:text}.fclock-hero-pct{margin-left:2px;font-size:.5em}.fclock-figure{font-family:var(--font-display);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:26px;line-height:1}.fclock-strip{background:var(--surface-soft);border-radius:14px;height:64px;position:relative;overflow:hidden;container-type:inline-size}.fclock-window{transform-origin:0;transform:scaleX(var(--w));background:color-mix(in srgb, var(--fc-fresh) 16%, transparent);transition:transform .7s var(--fc-ease);position:absolute;inset:0}.fclock-edge{border-left:2px dashed color-mix(in srgb, var(--fc-fresh) 80%, transparent);width:0;transform:translateX(calc(var(--w) * 100cqw - 1px));transition:transform .7s var(--fc-ease);position:absolute;top:0;bottom:0;left:0}.fclock-edge-label{white-space:nowrap;color:color-mix(in srgb, var(--fc-fresh) 80%, var(--ink-0));font-size:11px;font-weight:500;position:absolute;top:6px;left:8px}.fclock-edge-label[data-flip]{left:auto;right:8px}.fclock-dot{--size:10px;left:4px;top:calc(24px + var(--row) * 12px);width:var(--size);height:var(--size);background:var(--fc-fresh);transform:translateX(calc(var(--p) * (100cqw - var(--size) - 8px)));transition:transform .75s var(--fc-ease), background-color .3s ease;border-radius:50%;position:absolute}.fclock-dot[data-stale]{background:var(--fc-stale)}.fclock-key{background:var(--fc-fresh);border-radius:50%;width:9px;height:9px}.fclock-key[data-stale]{background:var(--fc-stale)}.fclock-bar-row{grid-template-columns:minmax(84px,auto) minmax(0,1fr) auto;align-items:center;gap:14px;display:grid}.fclock-bar-row dt{color:var(--ink-1);font-size:14px}.fclock-bar{background:var(--surface-soft);border-radius:12px;height:12px;overflow:hidden}.fclock-bar span{background:var(--ink-1);transform-origin:0;height:100%;transform:scaleX(var(--s));transition:transform .75s var(--fc-ease);border-radius:12px;display:block}.fclock-bar-row[data-need] .fclock-bar span{background:linear-gradient(90deg, var(--accent), var(--accent-4))}.fclock-gapline{color:var(--ink-1);justify-content:space-between;align-items:baseline;gap:16px;font-size:15px;display:flex}.fclock-gapline .fclock-figure{color:var(--fc-stale);font-size:34px}.fclock-gapline[data-zero] .fclock-figure{color:var(--fc-fresh)}.fclock-plan{border-top:1px solid var(--line);background:rgb(var(--bg-0-rgb) / .55);margin-bottom:-22px;margin-left:-22px;margin-right:-22px;padding:22px}@media (min-width:768px){.fclock-plan{margin:32px -32px -32px;padding:28px 32px 32px}}.fclock-fit{background:var(--surface-soft);border-radius:8px;height:8px;overflow:hidden}.fclock-fit span{background:var(--ink-0);transform-origin:0;height:100%;transform:scaleX(var(--s));transition:transform .75s var(--fc-ease);border-radius:8px;display:block}.fclock-fit[data-full] span{background:var(--fc-fresh)}.fclock-action{border:1px solid var(--line);min-height:40px;color:var(--ink-1);border-radius:999px;align-items:center;gap:8px;padding:0 14px;font-size:13px;transition:border-color .2s,color .2s,background-color .2s;display:inline-flex}.fclock-action:hover{border-color:var(--hover-border);color:var(--ink-0);background:var(--surface-hover)}.fclock-action:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media (prefers-reduced-motion:reduce){.fclock-window,.fclock-edge,.fclock-dot,.fclock-bar span,.fclock-fit span,.fclock-chip,.fclock-num,.fclock-seg,.fclock-action{transition:none}.fclock-range::-webkit-slider-thumb{transition:none}}
