.appmock[data-app-ui=modern] .app-ach-group{border-radius:var(--app-radius-xl);border-color:var(--app-border);background:var(--app-surface);box-shadow:var(--app-shadow-sm);margin-bottom:10px;padding:11px;transition:border-color .18s}.appmock[data-app-ui=modern] .app-ach-group:hover{border-color:var(--app-border-hover)}.appmock[data-app-ui=modern] .app-ach-head{border-bottom:1px solid color-mix(in oklch, var(--app-border) 70%, transparent);gap:6px;margin-bottom:9px;padding-bottom:7px}.appmock[data-app-ui=modern] .app-ach-group[data-collapsed=true] .app-ach-head{border-bottom:none;margin-bottom:0;padding-bottom:0}.appmock[data-app-ui=modern] .app-ach-head h4{color:var(--app-text);flex:none;font-size:10px;font-weight:700}.appmock[data-app-ui=modern] .app-ach-count{min-width:0;color:var(--app-text-2);font-variant-numeric:tabular-nums;flex:1;font-size:10px;font-weight:500}.appmock[data-app-ui=modern] .app-ach-toggle{border:1px solid var(--app-border);border-radius:var(--app-radius-md);background:var(--app-surface-muted);color:var(--app-text);padding:3px 7px;font-size:8.5px;font-weight:600;transition:background .15s,border-color .15s}.appmock[data-app-ui=modern] .app-ach-toggle:hover{border-color:var(--app-border-hover);background:var(--app-surface-hover)}.appmock[data-app-ui=modern] .app-ach-toggle:focus-visible{outline-color:var(--app-primary)}.appmock[data-app-ui=modern] .app-ach-grid{grid-template-columns:repeat(auto-fill,minmax(64px,68px));gap:8px}.appmock[data-app-ui=modern] .app-ach-card{perspective:700px;transition:transform .2s cubic-bezier(.16,1,.3,1)}.appmock[data-app-ui=modern] .app-ach-card:hover{transform:translateY(-2px)}.appmock[data-app-ui=modern] .app-ach-inner{aspect-ratio:auto;height:78px;transition:transform .5s cubic-bezier(.16,1,.3,1)}.appmock[data-app-ui=modern] .app-ach-face{border-radius:var(--app-radius-lg);border:1px solid var(--app-border);background:var(--app-surface);box-shadow:var(--app-shadow-sm);gap:3px;padding:7px 4px 6px;transition:border-color .2s,box-shadow .2s}.appmock[data-app-ui=modern] .app-ach-front{justify-content:space-between}.appmock[data-app-ui=modern] .app-ach-back{background:var(--app-surface-muted)}.appmock[data-app-ui=modern] .app-ach-card:hover .app-ach-face{border-color:var(--app-border-hover);box-shadow:var(--app-shadow-md)}.appmock[data-app-ui=modern] .app-ach-card:focus-visible{outline-color:var(--app-primary);border-radius:var(--app-radius-lg)}.appmock[data-app-ui=modern] .app-ach-emblem{--ach-tint:var(--app-text-3);border-radius:var(--app-radius-md);width:26px;height:26px;color:var(--ach-tint);background:color-mix(in oklch, var(--ach-tint) 20%, var(--app-surface));border:1px solid color-mix(in oklch, var(--ach-tint) 50%, transparent);box-shadow:0 0 7px color-mix(in oklch, var(--ach-tint) 22%, transparent);flex:none;place-items:center;display:grid;position:relative}.appmock[data-app-ui=modern] .app-ach-card--system .app-ach-emblem{--ach-tint:var(--app-warn)}.appmock[data-app-ui=modern] .app-ach-card--work .app-ach-emblem{--ach-tint:var(--app-blue)}.appmock[data-app-ui=modern] .app-ach-card--rest .app-ach-emblem{--ach-tint:var(--app-good)}.appmock[data-app-ui=modern] .app-ach-card.is-locked .app-ach-emblem{color:var(--app-text-3);background:var(--app-surface-muted);border:1px dashed var(--app-border);box-shadow:none}.appmock[data-app-ui=modern] .app-ach-emblem .app-ach-ico{color:inherit;place-items:center;font-size:12px;display:grid}.appmock[data-app-ui=modern] .app-ach-card.is-locked .app-ach-ico{opacity:.5}.appmock[data-app-ui=modern] .app-ach-lock{background:var(--app-surface);border:1px solid var(--app-border);width:10px;height:10px;color:var(--app-text-3);box-shadow:var(--app-shadow-sm);border-radius:50%;place-items:center;display:grid;position:absolute;bottom:-3px;right:-3px}.appmock[data-app-ui=modern] .app-ach-lock svg{width:6px;height:6px}.appmock[data-app-ui=modern] .app-ach-title{color:var(--app-text);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:7px;font-weight:600;line-height:1.25;display:-webkit-box;overflow:hidden}.appmock[data-app-ui=modern] .app-ach-card.is-locked .app-ach-title{color:var(--app-text-2)}.appmock[data-app-ui=modern] .app-ach-status{color:var(--app-text-3);align-items:center;gap:2px;font-size:6px;font-weight:500;line-height:1;display:inline-flex}.appmock[data-app-ui=modern] .app-ach-status.is-unlocked{color:var(--app-good);font-weight:600}.appmock[data-app-ui=modern] .app-ach-dot{background:currentColor;border-radius:50%;width:3px;height:3px;box-shadow:0 0 3px}.appmock[data-app-ui=modern] .app-ach-cond-label{letter-spacing:.04em;text-transform:uppercase;color:var(--app-text-3);font-size:6px;font-weight:600}.appmock[data-app-ui=modern] .app-ach-cond{margin:0;font-size:6.5px;line-height:1.35}.appmock[data-app-ui=modern] .app-settings-split{grid-template-columns:104px 1fr;gap:10px}.appmock[data-app-ui=modern] .app-settings-side{border-radius:var(--app-radius-xl);border-color:var(--app-border);background:var(--app-surface);box-shadow:var(--app-shadow-sm);align-self:start;gap:1px;padding:6px}.appmock[data-app-ui=modern] .app-settings-side button{border-radius:var(--app-radius-md);color:var(--app-text-2);white-space:nowrap;align-items:center;gap:5px;padding:5px 7px;font-weight:500;transition:background .15s,color .15s;display:flex;position:relative}.appmock[data-app-ui=modern] .app-settings-side button:hover{background:var(--app-surface-hover);color:var(--app-text)}.appmock[data-app-ui=modern] .app-settings-side button.is-active{background:var(--app-surface-muted);color:var(--app-text);font-weight:600}.appmock[data-app-ui=modern] .app-settings-side button.is-active:before{content:"";background:var(--app-primary);border-radius:999px;width:2px;position:absolute;top:4px;bottom:4px;left:0}.appmock[data-app-ui=modern] .app-settings-side button:focus-visible{outline-color:var(--app-primary)}.appmock[data-app-ui=modern] .app-set-ico{flex:none;place-items:center;display:grid}.appmock[data-app-ui=modern] .app-set-ico svg{width:11px;height:11px}.appmock[data-app-ui=modern] .app-settings-pane{box-sizing:border-box;border-radius:var(--app-radius-xl);border-color:var(--app-border);background:var(--app-surface);max-height:100%;box-shadow:var(--app-shadow-sm);align-self:start;padding:11px 12px 12px}.appmock[data-app-ui=modern] .app-settings-pane h4{border-bottom:1px solid var(--app-border);color:var(--app-text);margin:0 0 9px;padding-bottom:7px;font-size:11.5px;font-weight:600}.appmock[data-app-ui=modern] .app-settings-pane h5{color:var(--app-text);margin:11px 0 6px;font-size:9.5px;font-weight:600}.appmock[data-app-ui=modern] .app-settings-pane h5:first-of-type{margin-top:0}.appmock[data-app-ui=modern] .app-strategy button{border:1px solid var(--app-border);border-radius:var(--app-radius-lg);background:var(--app-surface);box-shadow:var(--app-shadow-sm);transition:border-color .18s,background .18s,box-shadow .18s}.appmock[data-app-ui=modern] .app-strategy button:hover{border-color:var(--app-border-hover);background:var(--app-surface-hover)}.appmock[data-app-ui=modern] .app-strategy button.is-active{border-width:1px;border-color:var(--app-primary);background:var(--app-surface-muted);box-shadow:0 0 0 1px var(--app-primary)}.appmock[data-app-ui=modern] .app-strategy button:focus-visible{outline-color:var(--app-primary);outline-offset:2px}.appmock[data-app-ui=modern] .app-strategy b{font-weight:600}.appmock[data-app-ui=modern] .app-phases{border:1px solid var(--app-border);border-radius:var(--app-radius-lg);background:var(--app-surface-muted)}.appmock[data-app-ui=modern] .app-phase-field input{border-radius:var(--app-radius-md);background:var(--app-surface)}.appmock[data-app-ui=modern] .app-phase-field input:focus-visible{outline-color:var(--app-primary)}.appmock[data-app-ui=modern] .app-phase-del{border:1px solid color-mix(in oklch, var(--app-danger) 40%, transparent);border-radius:var(--app-radius-md);background:var(--app-surface);color:var(--app-danger);font-size:9px;font-weight:500;transition:background .15s,border-color .15s}.appmock[data-app-ui=modern] .app-phase-del:hover{border-color:var(--app-danger);background:color-mix(in oklch, var(--app-danger) 8%, var(--app-surface))}.appmock[data-app-ui=modern] .app-phase-add{border:1px solid var(--app-border);border-radius:var(--app-radius-md);background:var(--app-primary-subtle);color:var(--app-text);font-size:9.5px;transition:background .15s,border-color .15s}.appmock[data-app-ui=modern] .app-phase-add:hover{border-color:var(--app-border-hover);background:var(--app-surface-hover)}.appmock[data-app-ui=modern] .app-phase-del:focus-visible,.appmock[data-app-ui=modern] .app-phase-add:focus-visible{outline-color:var(--app-primary)}@container (width<=400px){.appmock[data-app-ui=modern] .app-settings-split{grid-template-columns:78px 1fr}.appmock[data-app-ui=modern] .app-set-ico{display:none}.appmock[data-app-ui=modern] .app-ach-grid{grid-template-columns:repeat(auto-fill,minmax(60px,1fr))}}@media (prefers-reduced-motion:reduce){.appmock[data-app-ui=modern] .app-ach-card,.appmock[data-app-ui=modern] .app-ach-inner{transition:none}.appmock[data-app-ui=modern] .app-ach-card:hover{transform:none}}.appmock[data-app-ui=modern] .app-range{border-radius:var(--app-radius-md);background:var(--app-surface);gap:2px;padding:2.5px}.appmock[data-app-ui=modern] .app-range button{border-radius:var(--app-radius-sm);color:var(--app-text-2);font-weight:500;transition:background-color .18s,color .18s}.appmock[data-app-ui=modern] .app-range button.is-active{background:var(--app-primary);color:var(--app-primary-fg);font-weight:500}.appmock[data-app-ui=modern] .app-range button:not(.is-active):hover{background:var(--app-surface-hover);color:var(--app-text)}.appmock[data-app-ui=modern] .app-range button:focus-visible{outline-color:var(--app-primary)}.appmock[data-app-ui=modern] .app-stat,.appmock[data-app-ui=modern] .app-panel{background:var(--app-surface);border:1px solid var(--app-border);border-radius:var(--app-radius-xl);box-shadow:var(--app-shadow-sm);transition:border-color .18s}.appmock[data-app-ui=modern] .app-stat:hover,.appmock[data-app-ui=modern] .app-panel:hover{border-color:var(--app-border-hover)}.appmock[data-app-ui=modern] .app-stat{--stat-tint-mix:10%;flex-direction:column;align-items:center;padding:11px 6px 10px;display:flex}.appmock[data-app-ui=modern][data-app-theme=dark] .app-stat{--stat-tint-mix:16%}.appmock[data-app-ui=modern] .app-stat[data-stat=work]{--stat-fg:var(--app-primary);--stat-tint:var(--app-blue)}.appmock[data-app-ui=modern] .app-stat[data-stat=rest]{--stat-fg:var(--app-good);--stat-tint:var(--app-good)}.appmock[data-app-ui=modern] .app-stat[data-stat=breaks]{--stat-fg:var(--app-warn);--stat-tint:var(--app-warn)}.appmock[data-app-ui=modern] .app-stat[data-stat=rate]{--stat-fg:var(--app-violet);--stat-tint:var(--app-violet)}.appmock[data-app-ui=modern] .app-stat-icon{border-radius:var(--app-radius-md);width:22px;height:22px;color:var(--stat-fg,var(--app-text));background:color-mix(in srgb, var(--stat-tint,var(--app-text-2)) var(--stat-tint-mix), transparent);justify-content:center;align-items:center;margin:0 0 7px;display:inline-flex}.appmock[data-app-ui=modern] .app-stat-icon svg{width:12px;height:12px}.appmock[data-app-ui=modern] .app-stat b{color:var(--app-text);letter-spacing:-.03em;line-height:1.1}.appmock[data-app-ui=modern] .app-stat span:not(.app-stat-icon){margin-top:4px;font-weight:500}.appmock[data-app-ui=modern] .app-panel{padding:10px 11px}.appmock[data-app-ui=modern] .app-panel-title{border-bottom:1px solid var(--app-border);color:var(--app-text);margin:0 0 8px;padding-bottom:7px;font-size:10.5px;font-weight:600}.appmock[data-app-ui=modern] .app-axis{border:1px solid var(--app-surface-muted);border-radius:var(--app-radius-lg);background:var(--app-surface);box-shadow:var(--app-shadow-sm);padding:8px 11px 7px}.appmock[data-app-ui=modern] .app-axis-ticks.is-scaled{height:17px;position:relative}.appmock[data-app-ui=modern] .app-axis-ticks.is-scaled span{color:var(--app-text-2);white-space:nowrap;flex-direction:column;align-items:center;gap:2px;display:flex;position:absolute;bottom:0;transform:translate(-50%)}.appmock[data-app-ui=modern] .app-axis-ticks.is-scaled span:first-child{align-items:flex-start;transform:none}.appmock[data-app-ui=modern] .app-axis-ticks.is-scaled span:last-child{align-items:flex-end;transform:translate(-100%)}.appmock[data-app-ui=modern] .app-axis-ticks.is-scaled span:after{content:"";background:var(--app-border);border-radius:999px;width:1px;height:5px}.appmock[data-app-ui=modern] .app-axis-track{background:var(--app-surface-hover);border:1px solid var(--app-border);border-radius:999px;height:12px;margin:0 0 8px;position:relative;overflow:hidden}.appmock[data-app-ui=modern] .app-axis-track i{background:var(--app-primary);position:absolute;top:0;bottom:0}.appmock[data-app-ui=modern] .app-axis-track i.is-rest{background:var(--app-good)}.appmock[data-app-ui=modern] .app-legend{border-top:1px solid var(--app-border);gap:10px;padding-top:6px}.appmock[data-app-ui=modern] .app-legend em{background:var(--app-primary);border-radius:2px;width:7px;height:7px}.appmock[data-app-ui=modern] .app-legend span+span em{background:var(--app-good)}.appmock[data-app-ui=modern] .app-donut-head{color:var(--app-text-2);justify-content:space-between;align-items:baseline;gap:6px;margin-bottom:6px;font-size:8.5px;font-weight:500;display:flex}.appmock[data-app-ui=modern] .app-donut-head b{font-variant-numeric:tabular-nums;font-weight:600}.appmock[data-app-ui=modern] .app-donut{background:conic-gradient(var(--app-primary) 0 var(--donut-a), var(--app-warn) var(--donut-a) var(--donut-b), var(--app-surface-hover) var(--donut-b) 100%)}.appmock[data-app-ui=modern] .app-donut:after{background:var(--app-surface);box-shadow:none;inset:7px}.appmock[data-app-ui=modern] .app-donut b{opacity:0;transition:opacity .2s}.appmock[data-app-ui=modern] .app-donut:hover b{opacity:1}.appmock[data-app-ui=modern] .app-donut-keys div{font-weight:500}.appmock[data-app-ui=modern] .app-donut-keys i{border-radius:50%}.appmock[data-app-ui=modern] .app-donut-keys div:first-child i{background:var(--app-primary)}.appmock[data-app-ui=modern] .app-donut-keys div:nth-child(2) i{background:var(--app-warn)}.appmock[data-app-ui=modern] .app-donut-keys div:nth-child(3) i{background:var(--app-surface-hover);box-shadow:inset 0 0 0 1px var(--app-border)}.appmock[data-app-ui=modern] .app-donut-keys b{font-weight:600}.appmock[data-app-ui=modern] .app-heat i,.appmock[data-app-ui=modern] .app-heat-scale i{background:color-mix(in oklch, var(--app-blue) calc(var(--lv) * 25%), var(--app-surface-muted));border-radius:2px}.appmock[data-app-ui=modern] .app-heat-scale{color:var(--app-text-2)}.appmock[data-app-ui=modern] .app-timeline:before{background:var(--app-border)}.appmock[data-app-ui=modern] .app-tl-card{border:1px solid var(--app-border);border-radius:var(--app-radius-xl);background:var(--app-surface);box-shadow:var(--app-shadow-sm);padding:9px 11px 8px;transition:border-color .18s}.appmock[data-app-ui=modern] .app-tl-card:hover{border-color:var(--app-border-hover)}.appmock[data-app-ui=modern] .app-tl-head{justify-content:space-between;align-items:center;gap:6px;display:flex}.appmock[data-app-ui=modern] .app-tl-date{color:var(--app-text-2);font-weight:500}.appmock[data-app-ui=modern] .app-tl-badge{color:var(--app-text);white-space:nowrap;flex:none;font-size:9px;font-weight:500}.appmock[data-app-ui=modern] .app-tl-status{margin-top:4px;font-weight:600}.appmock[data-app-ui=modern] .app-tl-desc{color:var(--app-text-2)}.appmock[data-app-ui=modern] .app-tl-stats{border-top-color:var(--app-border);margin-top:8px;padding-top:8px}.appmock[data-app-ui=modern] .app-tl-stats b{color:var(--app-primary);letter-spacing:-.01em;font-weight:600}.appmock[data-app-ui=modern] .app-tl-stats span{color:var(--app-text-3)}.appmock[data-app-ui=modern] .app-tl-dot{border-width:2.5px;border-color:var(--app-good);background:var(--app-surface);width:9px;height:9px}.appmock[data-app-ui=modern] .app-tl-item:after{background:var(--app-border)}.appmock{--app-bg:#fff;--app-surface:#f9fafb;--app-surface-hover:#f3f4f6;--app-text:#111827;--app-text-2:#6b7280;--app-text-3:#9ca3af;--app-border:#e5e7eb;--app-accent:oklch(50% .105 158);--app-accent-soft:color-mix(in oklch, var(--app-accent) 12%, transparent);--app-blue:#3b82f6;--app-good:#10b981;--app-warn:#f59e0b;--app-orange:#f97316;--app-danger:#ef4444;--app-shadow-sm:0 1px 2px 0 #0000000d;--app-shadow-md:0 4px 6px -1px #0000001a;--app-shadow-lg:0 10px 15px -3px #0000001f;--app-track-w:38.8px;--app-track-h:94.7px;--app-gap:16.4px;aspect-ratio:4/2.55;border:1px solid var(--border);background:var(--app-bg);color:var(--app-text);box-shadow:0 24px 60px -24px color-mix(in oklch, var(--brand) 45%, transparent);-webkit-user-select:none;user-select:none;border-radius:24px;flex-direction:column;font-size:13px;line-height:1.5;display:flex;position:relative;overflow:hidden;container-type:inline-size}.appmock[data-app-theme=dark]{--app-bg:#111827;--app-surface:#1f2937;--app-surface-hover:#374151;--app-text:#f9fafb;--app-text-2:#d1d5db;--app-text-3:#9ca3af;--app-border:#374151;--app-accent:oklch(70% .13 158);--app-blue:#60a5fa;--app-good:#34d399;--app-warn:#fbbf24;--app-orange:#fb923c;--app-danger:#f87171;--app-shadow-sm:0 1px 2px 0 #0000004d;--app-shadow-md:0 4px 6px -1px #0006;--app-shadow-lg:0 10px 15px -3px #00000080}.appmock button,.appmock select,.appmock input{font:inherit;color:inherit}.appmock .app-ach-toggle{font-size:9.5px}.appmock .app-phase-del{font-size:9px}.appmock .app-phase-add{font-size:9.5px}.app-chrome{background:var(--app-bg);flex:none;align-items:center;gap:8px;height:26px;padding:0 11px;display:flex;position:relative}.app-dots{gap:5px;display:flex}.app-dots i{background:var(--dot);border-radius:50%;width:8px;height:8px}.app-dots i:first-child{--dot:#ff5f57}.app-dots i:nth-child(2){--dot:#febc2e}.app-dots i:nth-child(3){--dot:#28c840}.app-chrome-title{letter-spacing:.01em;font-size:10.5px;font-weight:600}.appmock[data-app-theme=dark] .app-dots i{--dot:var(--app-border)}.app-titlebar{border-bottom:1px solid var(--app-border);background:var(--app-surface);flex:none;align-items:center;gap:8px;height:38px;padding:0 14px;display:flex;box-shadow:0 8px 18px -14px #0f172a29}.app-logo-mark{object-fit:contain;filter:drop-shadow(0 1px 1.5px #0f172a2e);flex:none;width:20px;height:20px;display:block}.appmock[data-app-theme=dark] .app-logo-mark{filter:drop-shadow(0 1px 2px #0000008c)}.app-title-group{flex-direction:column;min-width:0;line-height:1.15;display:flex}.app-title{letter-spacing:.04em;font-size:12px;font-weight:700}.app-subtitle{color:var(--app-text-2);letter-spacing:.02em;font-size:8.5px;font-weight:500}.app-body{flex:1;min-height:0;display:flex}.app-main{flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.app-page{flex-direction:column;flex:1;min-height:0;padding:8px 16px 14px;display:none}.app-page.is-active{display:flex}.app-nav{flex:none;justify-content:flex-end;align-items:center;gap:4px;padding:7px 14px 0;display:flex}.app-nav button{width:30px;height:30px;color:var(--nav-accent);cursor:pointer;background:0 0;border:none;border-radius:8px;place-items:center;transition:background .18s,transform .18s;display:grid}.app-nav button[data-page=dashboard],.app-nav button[data-page=report]{--nav-accent:#3b82f6;--nav-accent-bg:#3b82f62e}.app-nav button[data-page=analytics]{--nav-accent:#10b981;--nav-accent-bg:#10b9812e}.app-nav button[data-page=achievements]{--nav-accent:#f97316;--nav-accent-bg:#f9731633}.app-nav button[data-page=settings]{--nav-accent:#f59e0b;--nav-accent-bg:#f59e0b2e}.app-nav button:hover{background:var(--app-surface-hover)}.app-nav button.is-active{background:var(--nav-accent-bg)}.app-nav button:focus-visible{outline:2px solid var(--nav-accent);outline-offset:1px}.app-nav svg{width:19px;height:19px}.app-toolbar{flex:none;justify-content:flex-end;align-items:center;gap:6px;margin-bottom:10px;display:flex;position:relative}.app-pagehead{flex:none;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:9px;display:flex}.app-pagehead .app-page-title{margin:0}.app-pagehead .app-toolbar{margin-bottom:0}.app-btn{border:1px solid var(--app-border);background:var(--app-surface);color:var(--app-text);cursor:pointer;box-shadow:var(--app-shadow-md);border-radius:9px;padding:4px 9px;font-size:11px;transition:background .18s,box-shadow .18s,transform .18s}.app-btn:hover{background:var(--app-surface-hover);box-shadow:var(--app-shadow-lg);transform:translateY(-1px)}.app-btn:focus-visible{outline:2px solid var(--app-accent);outline-offset:2px}.app-btn-icon{border-radius:10px;place-items:center;width:28px;height:28px;padding:0;font-size:16px;font-weight:600;line-height:1;display:grid}.app-menu{z-index:20;background:var(--app-bg);border:1px solid var(--app-border);min-width:122px;box-shadow:var(--app-shadow-lg);border-radius:11px;flex-direction:column;gap:2px;padding:5px;display:none;position:absolute;top:calc(100% + 5px);right:0}.app-menu.is-open{display:flex}.app-menu button{text-align:left;cursor:pointer;color:var(--app-text);background:0 0;border:none;border-radius:7px;padding:6px 8px;font-size:11.5px}.app-menu button:hover{background:var(--app-surface-hover)}.app-menu button:focus-visible{outline:2px solid var(--app-accent);outline-offset:-2px}.app-grid{grid-template-columns:repeat(12, var(--app-track-w));grid-auto-rows:var(--app-track-h);gap:var(--app-gap);flex:1;place-content:start;min-height:0;display:grid;position:relative;overflow:hidden auto}.app-card{min-width:0;position:relative}.app-card.is-dragging{z-index:12}.app-card.is-dragging .app-tile{box-shadow:var(--app-shadow-lg);cursor:grabbing;transform:scale(1.018)}.app-tile{background:var(--app-surface);border:1px solid var(--app-border);width:100%;height:100%;box-shadow:var(--app-shadow-md);text-align:center;cursor:grab;font-variant-numeric:tabular-nums;border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:10px 12px;transition:transform .3s,box-shadow .3s;display:flex;position:relative;overflow:hidden;container-type:inline-size}.app-tile:hover{box-shadow:var(--app-shadow-lg);transform:translateY(-2px)}.app-tile:focus-visible{outline:2px solid var(--app-accent);outline-offset:2px}.app-tile.has-progress:after{content:"";width:calc(var(--progress,0) * 100%);background:var(--progress-gradient,linear-gradient(90deg, #5ea0ff, #24e1c6));box-shadow:0 0 16px var(--progress-glow,#5ea0ff59);opacity:.28;transition:width .4s,background .4s;position:absolute;inset:0 auto 0 0;-webkit-mask-image:linear-gradient(90deg,#000 0 calc(100% - 26px),#0000 100%);mask-image:linear-gradient(90deg,#000 0 calc(100% - 26px),#0000 100%)}.app-tile>*{z-index:1;width:100%;position:relative}.app-tile.is-align-left{text-align:left;align-items:flex-start}.app-tile.is-align-left .app-tile-label{text-align:left}.app-tile-primary{letter-spacing:-.01em;font-size:clamp(15px,20cqi,30px);font-weight:600;line-height:1.16}.app-tile-primary.is-small{font-size:clamp(12px,11cqi,17px);line-height:1.3}.app-tile-label{color:var(--app-text-2);letter-spacing:.03em;font-size:clamp(8.5px,5.2cqi,11px);line-height:1.45}.app-tile-info{color:var(--app-text-3);font-size:clamp(8px,4.6cqi,10px);line-height:1.4}.app-tile-icon{color:var(--app-accent);line-height:0}.app-tile-icon svg{width:17px;height:17px}.app-tile-tips{color:var(--app-text-2);text-align:left;font-size:clamp(9px,4.4cqi,11px);line-height:1.5}@container (width<=150px){.app-tile-icon{display:none}}.app-card-actions{z-index:4;opacity:0;pointer-events:none;gap:3px;transition:opacity .18s;display:flex;position:absolute;top:4px;right:4px}.app-card:hover .app-card-actions,.app-card:focus-within .app-card-actions{opacity:1;pointer-events:auto}.app-card-actions button{border:1px solid var(--app-border);background:var(--app-bg);width:17px;height:17px;color:var(--app-text-2);cursor:pointer;border-radius:6px;place-items:center;padding:0;font-size:10px;line-height:1;display:grid}.app-card-actions button:hover{background:var(--app-surface-hover);color:var(--app-text)}.app-card-actions button:focus-visible{outline:2px solid var(--app-accent);outline-offset:1px}.app-resize-handle{z-index:4;cursor:nwse-resize;opacity:0;background:0 0;border:none;width:13px;height:13px;padding:0;transition:opacity .18s;position:absolute;bottom:2px;right:2px}.app-card:hover .app-resize-handle,.app-card:focus-within .app-resize-handle{opacity:.55}.app-resize-handle:after{content:"";border-right:2px solid var(--app-text-3);border-bottom:2px solid var(--app-text-3);width:6px;height:6px;position:absolute;bottom:3px;right:3px}.app-modal-overlay{z-index:30;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:oklch(0% none none/.42);place-items:center;padding:14px;display:none;position:absolute;inset:0}.app-modal-overlay.is-open{display:grid}.app-modal{background:var(--app-bg);border:1px solid var(--app-border);width:100%;max-width:264px;max-height:100%;box-shadow:var(--app-shadow-lg);border-radius:14px;padding:12px;overflow-y:auto}.app-modal-head{align-items:center;gap:8px;margin-bottom:10px;display:flex}.app-modal-title{margin-right:auto;font-size:12.5px;font-weight:600}.app-modal-close{cursor:pointer;border:1px solid var(--app-border);background:var(--app-bg);width:20px;height:20px;color:var(--app-text-2);border-radius:7px;flex:none;place-items:center;padding:0;font-size:12px;line-height:1;display:grid}.app-modal-close:hover{background:var(--app-surface-hover)}.app-field{margin-bottom:10px;display:block}.app-field-label{letter-spacing:.05em;text-transform:uppercase;color:var(--app-text-3);margin-bottom:5px;font-size:10px;font-weight:600;display:block}.app-input,.app-select{border:1px solid var(--app-border);background:var(--app-surface);width:100%;color:var(--app-text);border-radius:8px;padding:5px 7px;font-size:11.5px}.app-input:focus-visible,.app-select:focus-visible{outline:2px solid var(--app-accent);outline-offset:0}.app-choices{border:none;flex-wrap:wrap;gap:5px;margin:0;padding:0;display:flex}.app-choice{cursor:pointer;border:1px solid var(--app-border);background:var(--app-surface);color:var(--app-text-2);border-radius:999px;align-items:center;gap:4px;padding:4px 8px;font-size:11px;transition:background .18s,border-color .18s,color .18s;display:inline-flex}.app-choice:hover{background:var(--app-surface-hover)}.app-choice input{opacity:0;width:0;height:0;position:absolute}.app-choice.is-selected{background:var(--app-accent-soft);color:var(--app-accent);border-color:color-mix(in oklch, var(--app-accent) 40%, transparent)}.app-choice:focus-within{outline:2px solid var(--app-accent);outline-offset:1px}.app-modal-empty{color:var(--app-text-3);font-size:11.5px;line-height:1.5}.app-modal-foot{justify-content:flex-end;gap:6px;margin-top:4px;display:flex}.app-grid{scrollbar-width:thin;scrollbar-color:var(--app-border) transparent}.app-grid::-webkit-scrollbar{width:6px;height:6px}.app-grid::-webkit-scrollbar-track{background:0 0}.app-grid::-webkit-scrollbar-thumb{background:var(--app-border);border-radius:999px}.app-grid::-webkit-scrollbar-thumb:hover{background:var(--app-text-3)}.app-row{align-items:center;gap:8px;padding:4px 0;font-size:11.5px;display:flex}.app-row+.app-row{border-top:1px solid color-mix(in oklch, var(--app-border) 60%, transparent)}.app-row span{flex:1;min-width:0}.app-row .app-hint{color:var(--app-text-3);flex:none;font-size:10px}.app-stepper{flex:none;align-items:center;gap:3px;display:inline-flex}.app-stepper button{cursor:pointer;border:1px solid var(--app-border);background:var(--app-bg);width:20px;height:20px;color:var(--app-text);border-radius:6px;place-items:center;padding:0;font-size:12px;line-height:1;display:grid}.app-stepper button:hover{background:var(--app-surface-hover)}.app-stepper button:focus-visible{outline:2px solid var(--app-accent);outline-offset:1px}.app-stepper output{text-align:center;font-variant-numeric:tabular-nums;min-width:44px;font-size:11.5px}.app-switch{cursor:pointer;border:1px solid var(--app-border);background:var(--app-surface-hover);border-radius:999px;flex:none;width:34px;height:19px;padding:0;transition:background .2s,border-color .2s;position:relative}.app-switch:after{content:"";background:var(--app-bg);width:13px;height:13px;box-shadow:var(--app-shadow-sm);border-radius:50%;transition:transform .2s;position:absolute;top:2px;left:2px}.app-switch[aria-checked=true]{background:var(--app-accent);border-color:var(--app-accent)}.app-switch[aria-checked=true]:after{transform:translate(15px)}.app-switch:focus-visible{outline:2px solid var(--app-accent);outline-offset:2px}.app-seg{background:var(--app-surface-hover);border-radius:9px;flex:none;gap:2px;padding:2px;display:inline-flex}.app-seg button{cursor:pointer;color:var(--app-text-2);background:0 0;border:none;border-radius:7px;padding:3px 8px;font-size:11px}.app-seg button.is-active{background:var(--app-bg);color:var(--app-text);box-shadow:var(--app-shadow-sm)}.app-seg button:focus-visible{outline:2px solid var(--app-accent);outline-offset:1px}.app-embed-hint{font-family:var(--font-code);letter-spacing:.03em;color:var(--app-text-3);text-align:center;flex:none;margin:0;padding-top:7px;font-size:9.5px}.app-page-title{letter-spacing:-.01em;flex:none;margin:0 0 9px;font-family:inherit;font-size:15px;font-weight:700;line-height:1.2}.app-scroll{scrollbar-width:thin;scrollbar-color:var(--app-border) transparent;flex:1;min-height:0;padding-right:3px;overflow-y:auto}.app-scroll::-webkit-scrollbar{width:6px}.app-scroll::-webkit-scrollbar-track{background:0 0}.app-scroll::-webkit-scrollbar-thumb{background:var(--app-border);border-radius:999px}.app-timeline{padding:2px 0 6px;position:relative}.app-timeline:before{content:"";background:var(--app-border);width:1px;position:absolute;top:6px;bottom:0;left:50%}.app-tl-item{grid-template-columns:1fr 1fr;display:grid;position:relative}.app-tl-item+.app-tl-item{margin-top:9px}.app-tl-card{background:var(--app-surface);border:1px solid var(--app-border);box-shadow:var(--app-shadow-sm);border-radius:13px;grid-column:1;margin-right:20px;padding:8px 10px}.app-tl-item.is-right .app-tl-card{grid-column:2;margin-left:20px;margin-right:0}.app-tl-item:after{content:"";background:var(--app-border);width:14px;height:1px;position:absolute;top:16px;left:calc(50% - 20px)}.app-tl-item.is-right:after{left:auto;right:calc(50% - 20px)}.app-tl-dot{box-sizing:border-box;border:2px solid var(--app-good);background:var(--app-bg);border-radius:50%;width:9px;height:9px;position:absolute;top:16px;left:50%;transform:translate(-50%,-50%)}.app-tl-date{color:var(--app-text-2);letter-spacing:.01em;font-size:9.5px}.app-tl-status{color:var(--app-good);margin-top:3px;font-size:12.5px;font-weight:700}.app-tl-status.is-fair{color:var(--app-warn)}.app-tl-desc{color:var(--app-text-2);margin-top:4px;font-size:9.5px;line-height:1.55}.app-tl-stats{text-align:center;border-top:1px solid var(--app-border);grid-template-columns:repeat(3,1fr);gap:4px;margin-top:7px;padding-top:7px;display:grid}.app-tl-stats b{color:var(--app-blue);font-variant-numeric:tabular-nums;font-size:10.5px;font-weight:700;display:block}.app-tl-stats span{color:var(--app-text-3);margin-top:2px;font-size:8px;display:block}.app-range{background:var(--app-surface);border-radius:10px;flex:none;align-self:flex-start;gap:2px;margin-bottom:8px;padding:2.5px;display:inline-flex}.app-range button{cursor:pointer;color:var(--app-text-2);white-space:nowrap;background:0 0;border:none;border-radius:7px;flex:none;padding:4px 13px;font-size:9.5px}.app-range button.is-active{background:var(--app-blue);color:#fff;font-weight:600}.app-range button:not(.is-active):hover{background:var(--app-surface-hover)}.app-range button:focus-visible{outline:2px solid var(--app-blue);outline-offset:1px}.app-stat-grid{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.app-stat{background:var(--app-surface);border:1px solid var(--app-border);text-align:center;box-shadow:var(--app-shadow-sm);border-radius:14px;padding:8px 6px 7px}.app-stat-icon{color:var(--stat-color,var(--app-blue));margin-bottom:4px;line-height:0}.app-stat-icon svg{width:16px;height:16px}.app-stat b{letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-size:14px;font-weight:700;display:block}.app-stat span{color:var(--app-text-2);margin-top:3px;font-size:8px;display:block}.app-panel{background:var(--app-surface);border:1px solid var(--app-border);border-radius:13px;margin-top:8px;padding:9px 10px}.app-panel-title{margin:0 0 6px;font-family:inherit;font-size:10.5px;font-weight:700}.app-axis{background:var(--app-bg);border:1px solid var(--app-border);border-radius:10px;padding:6px 9px}.app-axis-ticks{color:var(--app-text-3);font-variant-numeric:tabular-nums;justify-content:space-between;font-size:8px;display:flex}.app-axis-bar{background:var(--app-surface-hover);border-radius:4px;height:14px;margin:4px 0 5px;position:relative;overflow:hidden}.app-axis-bar i{background:var(--app-blue);border-radius:1.5px;width:3px;position:absolute;top:0;bottom:0}.app-axis-bar i.is-rest{background:var(--app-good)}.app-legend{color:var(--app-text-2);justify-content:center;gap:12px;font-size:8.5px;display:flex}.app-legend span{align-items:center;gap:4px;display:inline-flex}.app-legend em{background:var(--app-blue);border-radius:50%;width:6px;height:6px}.app-legend span+span em{background:var(--app-good)}.app-stat-row{grid-template-columns:1fr 1fr;align-items:stretch;gap:8px;margin-top:7px;display:grid}.app-stat-row .app-panel{flex-direction:column;margin-top:0;display:flex}.app-donut-wrap{flex:1;align-items:center;gap:10px;min-height:48px;display:flex}.app-donut{background:conic-gradient(var(--app-blue) 0 var(--donut-a), var(--app-good) var(--donut-a) var(--donut-b), var(--app-surface-hover) var(--donut-b) 100%);border-radius:50%;flex:none;width:46px;height:46px;position:relative}.app-donut:after{content:"";background:var(--app-surface);box-shadow:inset 0 0 0 1px var(--app-border);border-radius:50%;position:absolute;inset:9px}.app-donut b{z-index:1;font-variant-numeric:tabular-nums;letter-spacing:-.02em;place-items:center;font-size:10px;font-weight:700;display:grid;position:absolute;inset:0}.app-donut-keys{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.app-donut-keys div{color:var(--app-text-2);align-items:center;gap:6px;font-size:8.5px;display:flex}.app-donut-keys i{background:var(--key-color,var(--app-blue));border-radius:2px;flex:none;width:7px;height:7px}.app-donut-keys b{color:var(--app-text);font-variant-numeric:tabular-nums;margin-left:auto;font-size:10px;font-weight:700}.app-heat{flex:1;grid-template-rows:repeat(5,6.5px);grid-template-columns:repeat(14,1fr);align-content:center;gap:2.5px;display:grid}.app-heat i{background:color-mix(in oklch, var(--app-good) calc(var(--lv) * 22%), var(--app-surface-hover));border-radius:2.5px}.app-heat-scale{color:var(--app-text-3);justify-content:flex-end;align-items:center;gap:4px;margin-top:5px;font-size:7.5px;display:flex}.app-heat-scale i{background:color-mix(in oklch, var(--app-good) calc(var(--lv) * 22%), var(--app-surface-hover));border-radius:2px;width:7px;height:7px}.app-ach-group{background:var(--app-surface);border:1px solid var(--app-border);border-radius:13px;margin-bottom:8px;padding:10px 11px}.app-ach-head{align-items:center;gap:8px;margin-bottom:9px;display:flex}.app-ach-head h4{flex:1;margin:0;font-family:inherit;font-size:11px;font-weight:700}.app-ach-toggle{border:1px solid var(--app-border);background:var(--app-bg);color:var(--app-text-2);cursor:pointer;border-radius:8px;flex:none;padding:3px 8px;font-size:9.5px}.app-ach-toggle:hover{background:var(--app-surface-hover);color:var(--app-text)}.app-ach-toggle:focus-visible{outline:2px solid var(--app-accent);outline-offset:1px}.app-ach-grid{grid-template-columns:repeat(auto-fit,minmax(80px,110px));justify-content:flex-start;gap:7px;display:grid}.app-ach-group[data-collapsed=true] .app-ach-grid{display:none}.app-ach-card{cursor:pointer;perspective:500px;width:100%;font:inherit;color:inherit;text-align:left;background:0 0;border:none;padding:0}.app-ach-inner{aspect-ratio:1;width:100%;transform-style:preserve-3d;transition:transform .5s;position:relative}.app-ach-card.is-flipped .app-ach-inner{transform:rotateY(180deg)}.app-ach-face{border:1px solid var(--app-border);background:var(--app-surface);backface-visibility:hidden;border-radius:9px;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:8px;display:flex;position:absolute;inset:0}.app-ach-front{justify-content:space-between}.app-ach-back{transform:rotateY(180deg)}.app-ach-ico{color:var(--ach-color);font-size:41px;line-height:1}.app-ach-ico svg{width:1em;height:1em}.app-ach-title{text-align:center;color:var(--app-text);word-break:break-word;margin:0;font-size:7.5px;font-weight:600;line-height:1.3}.app-ach-cond{text-align:center;color:var(--app-text-2);word-break:break-word;font-size:6.5px;line-height:1.45}.app-ach-card.is-locked .app-ach-face{filter:grayscale()saturate(.2);opacity:.6}.app-ach-card:hover .app-ach-face{border-color:color-mix(in oklch, var(--app-border) 70%, var(--app-text))}.app-ach-card:focus-visible{outline:2px solid var(--app-accent);outline-offset:2px;border-radius:9px}.app-ach-card--rest .app-ach-ico{color:var(--app-good)}.app-ach-card--work .app-ach-ico{color:var(--app-blue)}.app-ach-card--system .app-ach-ico{color:var(--app-warn)}.app-settings-split{flex:1;grid-template-columns:88px 1fr;gap:9px;min-height:0;display:grid}.app-settings-side{background:var(--app-surface);border:1px solid var(--app-border);border-radius:13px;flex-direction:column;align-content:start;gap:1px;padding:5px;display:flex}.app-settings-side button{cursor:pointer;text-align:left;color:var(--app-text-2);background:0 0;border:none;border-radius:8px;padding:5px 7px;font-size:10px}.app-settings-side button:hover{background:var(--app-surface-hover)}.app-settings-side button.is-active{background:color-mix(in oklch, var(--app-blue) 16%, transparent);color:var(--app-blue);font-weight:600}.app-settings-side button:focus-visible{outline:2px solid var(--app-blue);outline-offset:1px}.app-settings-pane{background:var(--app-surface);border:1px solid var(--app-border);scrollbar-width:thin;scrollbar-color:var(--app-border) transparent;border-radius:13px;min-width:0;padding:10px 11px;overflow-y:auto}.app-settings-pane::-webkit-scrollbar{width:6px}.app-settings-pane::-webkit-scrollbar-thumb{background:var(--app-border);border-radius:999px}.app-settings-pane h4{margin:0 0 9px;font-family:inherit;font-size:12px;font-weight:700}.app-settings-pane h5{color:var(--app-text-2);margin:11px 0 6px;font-family:inherit;font-size:10px;font-weight:600}.app-settings-pane h5:first-of-type{margin-top:0}.app-strategy{grid-template-columns:1fr 1fr;gap:7px;display:grid}.app-strategy button{text-align:left;cursor:pointer;border:1px solid var(--app-border);background:var(--app-bg);color:var(--app-text);border-radius:10px;padding:7px 8px;transition:border-color .18s,background .18s}.app-strategy button:hover{background:var(--app-surface-hover)}.app-strategy button.is-active{border-color:var(--app-blue);background:color-mix(in oklch, var(--app-blue) 7%, var(--app-bg));border-width:1.5px}.app-strategy button:focus-visible{outline:2px solid var(--app-blue);outline-offset:1px}.app-strategy b{font-size:10.5px;font-weight:700;display:block}.app-strategy span{color:var(--app-text-2);margin-top:3px;font-size:8.5px;line-height:1.4;display:block}.app-phases{background:color-mix(in oklch, var(--app-blue) 8%, var(--app-bg));border-radius:11px;margin-top:9px;padding:9px}.app-phases-hint{color:var(--app-text-2);margin:0 0 8px;font-size:8.5px;line-height:1.45}.app-phase-row{grid-template-columns:34px repeat(3,1fr) auto;align-items:center;gap:5px;display:grid}.app-phase-row+.app-phase-row{margin-top:6px}.app-phase-row>b{font-size:9.5px;font-weight:600}.app-phase-head{color:var(--app-text-2);grid-template-columns:34px repeat(3,1fr) auto;gap:5px;margin-bottom:5px;font-size:8px;display:grid}.app-phase-head span{min-width:0}.app-phase-field label{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app-phase-field input{box-sizing:border-box;border:1px solid var(--app-border);background:var(--app-bg);width:100%;color:var(--app-text);font-variant-numeric:tabular-nums;border-radius:7px;padding:3px 5px;font-size:10px}.app-phase-field input:focus-visible{outline:2px solid var(--app-blue);outline-offset:0}.app-phase-del{border:1px solid color-mix(in oklch, var(--app-danger) 45%, transparent);background:var(--app-bg);color:var(--app-danger);cursor:pointer;border-radius:7px;padding:3px 6px;font-size:9px}.app-phase-del:hover{background:color-mix(in oklch, var(--app-danger) 10%, var(--app-bg))}.app-phase-add{cursor:pointer;background:color-mix(in oklch, var(--app-blue) 22%, var(--app-bg));color:var(--app-blue);border:none;border-radius:8px;margin:8px 0 0 auto;padding:4px 9px;font-size:9.5px;font-weight:600;display:block}.app-phase-add:hover{background:color-mix(in oklch, var(--app-blue) 32%, var(--app-bg))}.app-phase-del:focus-visible,.app-phase-add:focus-visible{outline:2px solid var(--app-blue);outline-offset:1px}.app-about{color:var(--app-text-2);margin:0;font-size:10px;line-height:1.6}@container (width<=400px){.app-page{padding:8px 10px 12px}.app-nav{padding:6px 9px 0}.app-nav button{width:26px;height:26px}.app-nav svg{width:16px;height:16px}.app-tile{border-radius:14px;padding:7px 8px}.app-page-title{margin-bottom:7px;font-size:13px}.app-timeline:before{left:5px}.app-tl-item{grid-template-columns:1fr}.app-tl-card,.app-tl-item.is-right .app-tl-card{grid-column:1;margin:0 0 0 18px}.app-tl-item:after,.app-tl-item.is-right:after{width:12px;left:5px;right:auto}.app-tl-dot{left:5px}.app-stat-grid,.app-ach-grid{grid-template-columns:repeat(2,1fr)}.app-stat-row{grid-template-columns:1fr}.app-settings-split{grid-template-columns:74px 1fr}.app-strategy{grid-template-columns:1fr}.app-phase-head{display:none}.app-phase-field label{clip-path:none;width:auto;height:auto;color:var(--app-text-2);margin:0 0 3px;padding:0;font-size:8px;display:block;position:static;overflow:visible}.app-phase-row{grid-template-columns:30px 1fr 1fr;align-items:end;row-gap:5px}.app-phase-del{grid-column:3;justify-self:end}}@media (prefers-reduced-motion:reduce){.app-tile,.app-card-actions,.app-switch,.app-switch:after{transition:none}.app-card.is-dragging .app-tile{transform:none}}.appmock[data-app-ui=modern]{--app-bg:#fff;--app-surface:#fff;--app-surface-hover:#f4f4f5;--app-surface-muted:#f4f4f5;--app-text:#09090b;--app-text-2:#71717a;--app-text-3:#a1a1aa;--app-border:#e4e4e7;--app-border-hover:#d4d4d8;--app-primary:#18181b;--app-primary-fg:#fff;--app-primary-subtle:#18181b0f;--app-primary-glow:#18181b26;--app-accent:var(--app-primary);--app-accent-soft:var(--app-primary-subtle);--app-good:#16a34a;--app-good-subtle:#16a34a1a;--app-warn:#d97706;--app-warn-subtle:#d977061a;--app-danger:#dc2626;--app-blue:#2563eb;--app-orange:#ea580c;--app-violet:#7c3aed;--app-shadow-sm:0 1px 2px 0 #0000000d;--app-shadow-md:0 4px 6px -1px #00000012, 0 2px 4px -2px #0000000d;--app-shadow-lg:0 10px 15px -3px #00000014, 0 4px 6px -4px #0000000a;--app-radius-xl:10px;--app-radius-lg:8px;--app-radius-md:6px;--app-radius-sm:4px;letter-spacing:-.01em}.appmock[data-app-ui=modern][data-app-theme=dark]{--app-bg:#09090b;--app-surface:#18181b;--app-surface-hover:#27272a;--app-surface-muted:#27272a;--app-text:#fafafa;--app-text-2:#a1a1aa;--app-text-3:#71717a;--app-border:#27272a;--app-border-hover:#3f3f46;--app-primary:#fafafa;--app-primary-fg:#09090b;--app-primary-subtle:#fafafa1a;--app-primary-glow:#fafafa33;--app-good:#22c55e;--app-good-subtle:#22c55e26;--app-warn:#f59e0b;--app-warn-subtle:#f59e0b26;--app-danger:#ef4444;--app-blue:#60a5fa;--app-orange:#fb923c;--app-violet:#a78bfa;--app-shadow-sm:0 1px 2px 0 #0009;--app-shadow-md:0 4px 6px -1px #000000b3, 0 2px 4px -2px #0009;--app-shadow-lg:0 10px 15px -3px #000c, 0 4px 6px -4px #000000b3}.appmock[data-app-ui=modern] .app-chrome{background:var(--app-surface)}.appmock[data-app-ui=modern] .app-titlebar{background:var(--app-surface);border-bottom:1px solid var(--app-border);box-shadow:0 6px 14px -8px #0f172a1f}.appmock[data-app-ui=modern] .app-title{letter-spacing:.03em}.appmock[data-app-ui=modern][data-app-theme=dark] .app-titlebar{box-shadow:0 6px 14px -8px #0009}.appmock[data-app-ui=modern] .app-nav button{width:26px;height:26px;color:var(--app-text-2);border:1px solid #0000;border-radius:7px;transition:background .2s cubic-bezier(.16,1,.3,1),color .2s,transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s}.appmock[data-app-ui=modern] .app-nav svg{width:14px;height:14px;transition:transform .2s}.appmock[data-app-ui=modern] .app-nav button:hover{background:var(--app-surface-hover);color:var(--app-text);transform:translateY(-1px)}.appmock[data-app-ui=modern] .app-nav button:hover svg{transform:scale(1.08)}.appmock[data-app-ui=modern] .app-nav button:active{transform:scale(.96)}.appmock[data-app-ui=modern] .app-nav button[data-page=dashboard]{--nav-accent:var(--app-primary);--nav-accent-bg:#3b82f62e}.appmock[data-app-ui=modern] .app-nav button[data-page=report]{--nav-accent:#06b6d4;--nav-accent-bg:#06b6d42e}.appmock[data-app-ui=modern] .app-nav button[data-page=analytics]{--nav-accent:var(--app-good);--nav-accent-bg:#10b9812e}.appmock[data-app-ui=modern] .app-nav button[data-page=achievements]{--nav-accent:#f97316;--nav-accent-bg:#f9731633}.appmock[data-app-ui=modern] .app-nav button[data-page=settings]{--nav-accent:var(--app-warn);--nav-accent-bg:#f59e0b2e}.appmock[data-app-ui=modern] .app-nav button.is-active{color:var(--nav-accent);background:var(--nav-accent-bg);border-color:var(--nav-accent);box-shadow:0 2px 6px -2px var(--nav-accent)}.appmock[data-app-ui=modern] .app-page-title{letter-spacing:-.02em;font-size:16px;font-weight:700}.appmock[data-app-ui=modern] #app-title-dashboard{visibility:hidden}.appmock[data-app-ui=modern] .app-btn{border:1px solid var(--app-border);background:var(--app-surface);color:var(--app-text);box-shadow:var(--app-shadow-md);border-radius:7px;font-weight:600}.appmock[data-app-ui=modern] .app-btn:hover{background:var(--app-surface);box-shadow:var(--app-shadow-lg);transform:translateY(-1px)}.appmock[data-app-ui=modern] .app-btn:focus-visible{outline:2px solid var(--app-primary-glow);outline-offset:2px}.appmock[data-app-ui=modern] .app-btn-icon{border-radius:7px;width:24px;height:24px;font-size:15px}.appmock[data-app-ui=modern] .app-menu{border:1px solid var(--app-border);background:var(--app-surface);border-radius:9px;box-shadow:0 9px 24px #0f172a2e}.appmock[data-app-ui=modern] .app-menu button{border-radius:6px;transition:background .2s,transform .2s}.appmock[data-app-ui=modern] .app-menu button:hover{background:var(--app-surface-hover);transform:translate(1px)}.appmock[data-app-ui=modern] .app-tile{background:var(--app-surface);border:1px solid var(--app-border);border-radius:var(--app-radius-xl);box-shadow:var(--app-shadow-sm);transition:transform .3s,box-shadow .3s,border-color .18s}.appmock[data-app-ui=modern] .app-tile:hover{border-color:var(--app-border-hover);box-shadow:var(--app-shadow-md)}.appmock[data-app-ui=modern] .app-tile:focus-visible{outline:2px solid var(--app-primary-glow);outline-offset:2px}.appmock[data-app-ui=modern] .app-tile.has-progress:after{-webkit-mask-image:none;mask-image:none}.appmock[data-app-ui=modern] .app-tile-primary{letter-spacing:-.03em;color:var(--app-text);font-weight:700}.appmock[data-app-ui=modern] .app-tile-label{letter-spacing:.01em;font-weight:500}.appmock[data-app-ui=modern] .app-tile-icon{background:var(--app-surface-hover);width:20px;height:20px;color:var(--app-text-2);border-radius:5px;place-items:center;display:inline-grid}.appmock[data-app-ui=modern] .app-tile-icon svg{width:11px;height:11px}@container (width<=230px){.appmock[data-app-ui=modern] .app-tile-icon{display:none}}.appmock[data-app-ui=modern] .app-tile.is-align-left{text-align:center;align-items:center}.appmock[data-app-ui=modern] .app-tile-tips-label{display:none}.appmock[data-app-ui=modern] .app-tile-tips{color:var(--app-text);text-align:center;font-size:clamp(9px,5cqi,12px);line-height:1.6}.appmock[data-app-ui=modern] .app-card-actions button{border-radius:var(--app-radius-sm);border:1px solid var(--app-border);background:var(--app-surface);box-shadow:var(--app-shadow-sm);transition:background .18s cubic-bezier(.16,1,.3,1),color .18s,border-color .18s,transform .18s cubic-bezier(.16,1,.3,1)}.appmock[data-app-ui=modern] .app-card-actions button:hover{background:var(--app-surface-hover);color:var(--app-text);transform:scale(1.06)}.appmock[data-app-ui=modern] .app-card-actions button:last-child:hover{color:var(--app-danger);background:#ef44441f;border-color:#ef444466}.appmock[data-app-ui=modern] .app-resize-handle:after{border-color:var(--app-text-2)}.appmock[data-app-ui=modern] .app-modal-overlay{-webkit-backdrop-filter:none;backdrop-filter:none;background:#0f172a73}.appmock[data-app-ui=modern] .app-modal{border-radius:var(--app-radius-xl);border:1px solid var(--app-border);background:var(--app-surface);animation:.2s cubic-bezier(.16,1,.3,1) app-modal-pop;box-shadow:0 12px 26px #00000047}@keyframes app-modal-pop{0%{opacity:0;transform:scale(.96)translateY(4px)}to{opacity:1;transform:none}}.appmock[data-app-ui=modern] .app-modal-title{letter-spacing:-.01em;font-weight:700}.appmock[data-app-ui=modern] .app-modal-close{border-radius:var(--app-radius-md);background:0 0;border-color:#0000;transition:background .18s,border-color .18s,color .18s}.appmock[data-app-ui=modern] .app-modal-close:hover{background:var(--app-surface-hover);border-color:var(--app-border);color:var(--app-text)}.appmock[data-app-ui=modern] .app-field-label{text-transform:none;letter-spacing:0;color:var(--app-text-2)}.appmock[data-app-ui=modern] .app-input,.appmock[data-app-ui=modern] .app-select{border-radius:var(--app-radius-md);border:1px solid var(--app-border);background:var(--app-surface-muted)}.appmock[data-app-ui=modern] .app-input:focus-visible,.appmock[data-app-ui=modern] .app-select:focus-visible{outline:2px solid var(--app-primary-glow)}.appmock[data-app-ui=modern] .app-choice{border-radius:var(--app-radius-lg);border:1px solid var(--app-border);background:var(--app-surface-muted);color:var(--app-text);padding:5px 9px;font-weight:500}.appmock[data-app-ui=modern] .app-choice:hover{border-color:var(--app-border-hover);background:var(--app-surface-hover)}.appmock[data-app-ui=modern] .app-choice.is-selected{border-color:var(--app-primary);background:var(--app-primary-subtle);color:var(--app-text);box-shadow:inset 0 0 0 1px var(--app-primary);font-weight:600}.appmock[data-app-ui=modern] .app-choice:focus-within{box-shadow:0 0 0 2px var(--app-primary-glow);outline:none}.appmock[data-app-ui=modern] .app-modal-foot{border-top:1px solid var(--app-border);margin-top:8px;padding-top:8px}.appmock[data-app-ui=modern] .app-modal-foot .app-btn{background:var(--app-primary);color:var(--app-primary-fg);box-shadow:var(--app-shadow-sm);border-color:#0000}.appmock[data-app-ui=modern] .app-modal-foot .app-btn:hover{background:var(--app-primary);opacity:.92;transform:none}.appmock[data-app-ui=modern] .app-switch{background:#e4e4e7;border-color:#d4d4d8}.appmock[data-app-ui=modern][data-app-theme=dark] .app-switch{background:#27272a;border-color:#3f3f46}.appmock[data-app-ui=modern] .app-switch:after{background:#fafafa;box-shadow:0 1px 2px #0006}.appmock[data-app-ui=modern] .app-switch[aria-checked=true]{background:var(--app-primary);border-color:var(--app-primary)}.appmock[data-app-ui=modern][data-app-theme=dark] .app-switch[aria-checked=true]:after{background:#09090b}.appmock[data-app-ui=modern] .app-switch:focus-visible{outline:2px solid var(--app-primary-glow)}.appmock[data-app-ui=modern] .app-seg{background:var(--app-surface-muted);border-radius:var(--app-radius-md)}.appmock[data-app-ui=modern] .app-seg button{color:var(--app-text-2);border-radius:5px;font-weight:500}.appmock[data-app-ui=modern] .app-seg button.is-active{background:var(--app-surface);color:var(--app-text);box-shadow:var(--app-shadow-sm);font-weight:600}.appmock[data-app-ui=modern][data-app-theme=dark] .app-seg button.is-active{background:var(--app-border-hover)}.appmock[data-app-ui=modern] .app-stepper button{border-radius:var(--app-radius-sm);border:1px solid var(--app-border);background:var(--app-surface);box-shadow:var(--app-shadow-sm)}.appmock[data-app-ui=modern] .app-stepper button:hover{background:var(--app-surface-hover);border-color:var(--app-border-hover)}.appmock[data-app-ui=modern] .app-row+.app-row{border-top-color:var(--app-border)}.appmock[data-app-ui=modern] .app-grid,.appmock[data-app-ui=modern] .app-scroll{scrollbar-color:var(--app-border-hover) transparent}@media (prefers-reduced-motion:reduce){.appmock[data-app-ui=modern] .app-nav button,.appmock[data-app-ui=modern] .app-nav svg,.appmock[data-app-ui=modern] .app-card-actions button{transition:none}.appmock[data-app-ui=modern] .app-nav button:hover,.appmock[data-app-ui=modern] .app-nav button:hover svg,.appmock[data-app-ui=modern] .app-card-actions button:hover{transform:none}.appmock[data-app-ui=modern] .app-modal{animation:none}}@media (width>=921px){html,body{overflow-x:clip}.hero-split{grid-template-columns:minmax(0,1fr) 200px;position:relative}.hero-copy .lead{max-width:none}.app-peek{align-self:stretch}.app-peek .appmock{z-index:6;transform-origin:50%;cursor:default;width:min(680px,100vw - 48px);transition:left .6s cubic-bezier(.22,1,.36,1),transform .6s cubic-bezier(.22,1,.36,1),box-shadow .45s;position:absolute;top:50%;left:100%;transform:translate(-24%,-50%)scale(.96)}.app-peek.is-out .appmock,.app-peek.is-pinned .appmock{box-shadow:0 34px 80px -24px color-mix(in oklch, var(--brand) 55%, transparent);left:50%;transform:translate(-50%,-50%)scale(1.2)}.hero-copy{transition:transform .65s cubic-bezier(.22,1,.36,1),opacity .65s}:is(.hero-split:has(.app-peek.is-out) .hero-copy,.hero-split:has(.app-peek.is-pinned) .hero-copy){opacity:.3;transform:translate(-26%)}.app-peek .appmock:before{content:"";z-index:5;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1px color-mix(in oklch, var(--brand) 55%, transparent);opacity:1;transition:opacity .4s;position:absolute;inset:0}.app-peek.is-out .appmock:before,.app-peek.is-pinned .appmock:before{opacity:0}.app-peek .appmock .app-chrome,.app-peek .appmock .app-titlebar{cursor:pointer;-webkit-user-select:none;user-select:none}}@media (prefers-reduced-motion:reduce){.app-peek .appmock,.hero-copy{transition:none!important}}
