:root { color-scheme:light; --bg:#e9e1d5; --paper:#f7f1e8; --ink:#29251f; --muted:#756f65; --line:#d1c6b6; --line-dark:#aaa090; --accent:#5b4939; --accent-soft:#e0d4c4; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; background:linear-gradient(118deg,#e4dacd 0%,var(--bg) 45%,#e7dfd2 100%); color:var(--ink); font-family:Manrope,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
.shell { width:min(1160px,calc(100% - 3rem)); margin:0 auto; padding:4.5rem 0 6rem; }
header { padding-bottom:2.25rem; border-bottom:2px solid var(--ink); } h1,h2,p { margin:0; } h1 { font-family:"DM Serif Display",Georgia,serif; font-size:clamp(3rem,7vw,5.3rem); font-weight:400; letter-spacing:-.055em; line-height:.94; margin:.35rem 0 .8rem; } h2 { font-size:1.18rem; letter-spacing:-.025em; } header p { color:var(--muted); font-size:1rem; text-transform:capitalize; }
.eyebrow { color:var(--accent); font-size:.72rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.metrics { display:grid; grid-template-columns:repeat(3,1fr); margin:0 0 3.5rem; border-bottom:1px solid var(--line-dark); }.metric { min-height:9rem; padding:1.55rem 1.5rem 1.4rem 0; display:flex; flex-direction:column; justify-content:space-between; }.metric + .metric { border-left:1px solid var(--line); padding-left:1.5rem; }.metric span,.metric small { color:var(--muted); font-size:.82rem; }.metric strong { font-size:2.35rem; letter-spacing:-.065em; }.metric.accent strong { color:var(--accent); }
.panel { padding:2.5rem 0; border-bottom:1px solid var(--line-dark); }.body-section { margin:0; }.panel-head { display:flex; align-items:end; justify-content:space-between; gap:1rem; margin-bottom:1.65rem; }.chart-wrap { height:300px; position:relative; }.empty { position:absolute; inset:0; display:grid; place-items:center; text-align:center; color:var(--muted); padding:2rem; }.custom-select { position:relative; min-width:270px; }.select-trigger { width:100%; display:flex; align-items:center; justify-content:space-between; gap:1rem; background:transparent; color:var(--ink); border:0; border-bottom:1px solid var(--ink); border-radius:0; font:600 .9rem/1.3 Manrope,sans-serif; padding:.65rem 0; text-align:left; cursor:pointer; }.select-chevron { font-size:1.3rem; line-height:.5; transition:transform .18s ease; }.select-trigger[aria-expanded="true"] .select-chevron { transform:rotate(180deg); }.select-options { position:absolute; z-index:10; right:0; top:calc(100% + .45rem); width:100%; max-height:230px; overflow:auto; padding:.3rem 0; background:var(--paper); border:1px solid var(--line-dark); box-shadow:0 14px 30px rgba(54,43,30,.15); }.select-option { display:block; width:100%; border:0; background:transparent; color:var(--ink); padding:.7rem .8rem; font:500 .86rem/1.35 Manrope,sans-serif; text-align:left; cursor:pointer; }.select-option:hover,.select-option:focus-visible { background:var(--accent-soft); outline:0; }.session-stats { display:grid; grid-template-columns:repeat(3,1fr); margin:0 0 1.5rem; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.session-stats article { padding:1rem 1.1rem 1rem 0; }.session-stats article + article { padding-left:1.1rem; border-left:1px solid var(--line); }.session-stats span,.session-stats small { display:block; color:var(--muted); font-size:.77rem; }.session-stats strong { display:block; margin:.3rem 0; font-size:1.3rem; letter-spacing:-.04em; }.session-stats small { color:var(--accent); }.strength-note { margin:0 0 1rem; color:var(--muted); font-size:.88rem; line-height:1.5; }.history-wrap { max-height:400px; overflow:auto; margin-top:1rem; }.history-wrap table { width:100%; border-collapse:collapse; font-size:.88rem; }.history-wrap th,.history-wrap td { padding:.85rem .75rem; text-align:right; border-bottom:1px solid var(--line); white-space:nowrap; }.history-wrap th:first-child,.history-wrap td:first-child { text-align:left; padding-left:0; }.history-wrap th:last-child,.history-wrap td:last-child { padding-right:0; }.history-wrap th { position:sticky; top:0; background:var(--bg); color:var(--muted); font-weight:700; }.history-wrap tr:last-child td { border-bottom:0; }
.day-export { padding-top:2rem; }.day-controls { display:flex; flex-wrap:wrap; gap:.5rem; }.day-controls input,.day-controls button { min-height:2.45rem; border:1px solid var(--line-dark); border-radius:0; background:transparent; color:var(--ink); font:inherit; padding:.45rem .75rem; }.day-controls button { cursor:pointer; }.day-controls button:last-child { background:var(--ink); border-color:var(--ink); color:var(--paper); }.day-controls button:active { transform:translateY(1px); }.day-export textarea { display:block; width:100%; min-height:13rem; resize:vertical; border:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); border-radius:0; background:transparent; color:var(--ink); padding:1rem 0; font:500 .88rem/1.6 ui-monospace,SFMono-Regular,Consolas,monospace; }
.daily-grid { display:grid; grid-template-columns:1fr 1fr; column-gap:3rem; margin:0; }.table-note { min-height:2.6rem; margin:-.65rem 0 1rem; color:var(--muted); font-size:.84rem; line-height:1.4; }.daily-table { max-height:320px; margin-top:0; }.daily-table table { font-size:.8rem; }.daily-table th,.daily-table td { padding:.7rem .5rem; }.records-panel { margin:0; }.history-wrap,.select-options { scrollbar-width:thin; scrollbar-color:var(--accent) transparent; }.history-wrap::-webkit-scrollbar,.select-options::-webkit-scrollbar { width:5px; height:5px; }.history-wrap::-webkit-scrollbar-track,.select-options::-webkit-scrollbar-track { background:transparent; }.history-wrap::-webkit-scrollbar-thumb,.select-options::-webkit-scrollbar-thumb { background:var(--accent); border-radius:999px; }.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
.today-records { padding-top:2.15rem; }.today-records-list { border-top:1px solid var(--line); }.today-records-list article { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--line); }.today-records-list strong,.today-records-list span,.today-records-list small { display:block; }.today-records-list strong { font-size:.98rem; letter-spacing:-.02em; }.today-records-list span { margin-top:.2rem; color:var(--muted); font-size:.82rem; }.today-records-list small { color:var(--accent); font-size:.84rem; font-weight:700; text-align:right; }.today-records-empty { margin:0; padding:1rem 0; border-top:1px solid var(--line); color:var(--muted); font-size:.9rem; }
.records-switch { display:flex; align-items:center; gap:.2rem; border-bottom:1px solid var(--line-dark); }.records-mode { appearance:none; border:0; border-bottom:2px solid transparent; margin-bottom:-1px; padding:.58rem .65rem; background:transparent; color:var(--muted); font:700 .78rem/1.2 Manrope,sans-serif; cursor:pointer; }.records-mode:hover,.records-mode:focus-visible { color:var(--ink); outline:0; }.records-mode.is-active { border-bottom-color:var(--accent); color:var(--ink); }
@media (max-width:720px) { .shell { width:min(100% - 1.5rem,1160px); padding:2.5rem 0 4rem; }.metrics,.session-stats,.daily-grid { grid-template-columns:1fr; }.metric { min-height:6.75rem; padding:1rem 0; }.metric + .metric { padding-left:0; border-left:0; border-top:1px solid var(--line); }.session-stats article + article { padding-left:0; border-left:0; border-top:1px solid var(--line); }.chart-wrap { height:250px; }.panel { padding:2rem 0; }.panel-head { align-items:flex-start; flex-direction:column; }.custom-select { width:100%; min-width:0; }.day-controls { width:100%; }.day-controls input { flex:1; }.today-records-list article { align-items:flex-start; flex-direction:column; }.today-records-list small { text-align:left; } }