:root{--ink:#273f35;--muted:#7d887f;--green:#416c54;--pale:#edf2e9;--line:#e8ebe4;--bg:#f8f9f5}
.strong-alert{position:sticky;top:8px;z-index:5;display:flex;align-items:center;gap:20px;margin:18px auto;padding:24px;border:3px solid #b53827;border-radius:16px;background:#fff1e9;color:#842517;box-shadow:0 8px 24px #65271d24;max-width:1180px}
.strong-alert-icon{display:grid;place-items:center;flex-shrink:0;width:62px;height:62px;border-radius:50%;background:#b53827;color:white;font-size:42px;font-weight:750}
.strong-alert-copy{flex:1;min-width:0}.strong-alert h2{font-size:clamp(26px,3vw,38px);font-weight:750;line-height:1.25}.strong-alert p{font-size:17px;margin-top:10px;line-height:1.6}.strong-alert-actions{display:flex;flex-direction:column;gap:8px}.strong-alert .button{border-color:currentColor;color:inherit;background:#fffaf6}
.strong-alert.recovering{border-color:#477859;background:#edf7ef;color:#315c41}.strong-alert.recovering .strong-alert-icon{background:#477859}
body.posture-needs-adjustment::after{content:"";position:fixed;inset:0;border:5px solid #b53827;pointer-events:none;z-index:30}
.posture-needs-adjustment .monitor-card{border:3px solid #b53827}.posture-needs-adjustment .posture-status.bad strong{font-size:21px;font-weight:700}.posture-needs-adjustment .posture-status.bad p{font-size:14px;color:#843f35}
#browser-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#26382f;transform:scaleX(-1)}
@media(max-width:800px){.strong-alert{padding:16px;gap:12px;flex-wrap:wrap;top:4px}.strong-alert-icon{width:44px;height:44px;font-size:30px}.strong-alert p{font-size:15px}.strong-alert-actions{flex-direction:row;width:100%}.strong-alert .button{flex:1}}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;font-size:14px;line-height:1.6}button,input,select{font:inherit}button,a,input,select{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default;opacity:.5}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #a9c59b;outline-offset:3px}button{transition:background .18s,transform .18s}button:not(:disabled):active{transform:translateY(1px)}[hidden]{display:none!important}svg{display:block}h1,h2,h3,p{margin:0}h2{font-size:15px;font-weight:600}h3{font-size:14px;font-weight:600}a{color:inherit;text-decoration:none}
.sidebar{width:236px;height:100dvh;position:fixed;inset:0 auto 0 0;background:#fff;border-right:1px solid var(--line);padding:32px 22px;display:flex;flex-direction:column;z-index:2}.brand{display:flex;gap:12px;align-items:center;font-size:25px;letter-spacing:2px;font-weight:650}.brand-icon{background:#e9efdf;width:43px;height:47px;display:grid;place-items:center;border-radius:15px}.brand-icon svg{width:29px;fill:none;stroke:#42664b;stroke-width:2;stroke-linecap:round}.brand-sub{display:block;font-size:9px;color:var(--muted);font-weight:400;letter-spacing:0;margin-top:1px}.nav-label{font-size:10px;letter-spacing:2px;color:#a0a79e;margin:48px 16px 14px}.nav-item{width:100%;border:0;background:transparent;color:#7b887e;display:flex;gap:13px;align-items:center;text-align:left;padding:13px 16px;border-radius:10px;margin-bottom:9px;font-size:13px}.nav-item svg{width:18px;fill:none;stroke:currentColor;stroke-width:1.5}.nav-item.active{background:#edf2e7;color:#496b50;font-weight:600}.nav-item:hover{background:#f4f6f0}.nav-count{margin-left:auto;font-size:10px;background:#eaf0e5;min-width:21px;border-radius:7px;text-align:center}.sidebar-bottom{margin-top:auto;padding:18px 12px 3px;color:#8c948d;font-size:10px}.sidebar-bottom p{line-height:1.9;margin:10px 0 25px}.privacy-stamp{display:flex;align-items:center;gap:7px;color:#637e66;font-size:11px}.privacy-stamp svg{width:18px;fill:none;stroke:currentColor;stroke-width:1.5}.local-dot{display:inline-block;width:6px;height:6px;background:#7a9a70;border-radius:50%;margin-right:7px;vertical-align:middle}
main{margin-left:236px;padding:0 46px 26px;max-width:1700px}.topbar{height:83px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);font-size:11px;color:#849085}.breadcrumb{color:#a2aaa1}.slash{margin:0 12px;color:#c4cbc0}.view{max-width:1180px;margin:auto}.page-heading{display:flex;align-items:center;justify-content:space-between;margin:38px 0 29px;gap:20px}.eyebrow{font-size:9px;letter-spacing:2.7px;color:#8e9c88;margin-bottom:9px}h1{font-size:30px;font-weight:600;letter-spacing:1px;line-height:1.45}.page-heading p{font-size:12px;color:var(--muted);margin-top:7px}.pill{border:1px solid #dfe7d7;border-radius:30px;font-size:10px;white-space:nowrap;padding:7px 13px;color:#7b8f70;background:#fbfcf8}.card{background:white;border:1px solid var(--line);border-radius:17px}.study-grid{display:grid;grid-template-columns:minmax(0,1.85fr) minmax(275px,1fr);gap:23px}.card-header{padding:20px 23px;display:flex;justify-content:space-between;align-items:center;gap:10px}.camera-icon{font-size:17px;margin-right:8px;color:#8b9e85}.small-label{font-size:10px;color:#929c90}.preview{position:relative;aspect-ratio:1.8;margin:0 14px;background:#f2f4ec;border-radius:11px;overflow:hidden;display:grid;place-items:center}.preview img{width:100%;height:100%;position:absolute;inset:0;object-fit:contain;background:#26382f}.illustration{width:100%;text-align:center;padding:4px 0 21px}.illustration svg{width:76%;max-height:255px;margin:auto}.illustration p{font-size:11px;color:#7b8c75;margin-top:-2px}.illustration>span{display:block;font-size:9px;color:#a0ac98;margin-top:5px}.preview-tag{position:absolute;left:13px;top:12px;background:#fffdf5dd;padding:4px 9px;border-radius:6px;font-size:9px;color:#82937b}.preview-tag span{display:inline-block;width:5px;height:5px;background:#99ad8d;margin-right:4px;border-radius:50%}.posture-status{display:flex;align-items:center;gap:12px;padding:18px 24px 21px;min-height:90px}.status-symbol{width:33px;height:33px;background:#edf3e8;color:#71956e;border-radius:50%;display:grid;place-items:center;font-size:19px;flex-shrink:0}.posture-status strong{font-weight:500;font-size:13px}.posture-status p{color:#8c9788;font-size:10px;margin-top:3px}.posture-status.warning .status-symbol{background:#fff0d4;color:#bc8946}.posture-status.bad .status-symbol{background:#fbe4df;color:#b4564d}.posture-status.bad strong{color:#ad544b}
.timer-card{display:flex;flex-direction:column}.timer-ring{width:200px;height:200px;margin:10px auto 12px;position:relative}.timer-ring svg{width:100%;height:100%;transform:rotate(-90deg)}.timer-ring circle{fill:none;stroke-width:6}.ring-track{stroke:#edf1e7}#ring-progress{stroke:#8ba57e;stroke-linecap:round;stroke-dasharray:552.92;stroke-dashoffset:552.92;transition:stroke-dashoffset .6s}.timer-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column}.timer-text>span{font-size:11px;color:#909b88}.timer-text>strong{font-size:40px;font-weight:450;letter-spacing:1px;line-height:1.6;font-variant-numeric:tabular-nums}.timer-text>small{font-size:9px;color:#a6ae9f}.timer-tip{margin:0 23px 23px;border-radius:9px;background:#f7f8f0;padding:10px 12px;display:flex;gap:10px;align-items:center;color:#9da37d}.timer-tip span{font-size:20px;color:#b7b78f}.timer-tip p{font-size:10px}.mini-stats{display:grid;grid-template-columns:1fr 1fr;text-align:center;margin:auto 22px 17px}.mini-stats>div+div{border-left:1px solid var(--line)}.mini-stats>div>span{display:block;font-size:10px;color:#9aa292}.mini-stats strong{font-size:21px;font-weight:500;font-variant-numeric:tabular-nums;display:block;margin-top:5px}.mini-stats small{font-size:10px;color:#9ba490;font-weight:400}.timer-settings{border-top:1px solid var(--line);margin:0 22px;padding:14px 0;display:flex;align-items:center;justify-content:space-between;font-size:9px;color:#9da592}.text-button{border:0;background:none;color:#7c9575;font-size:10px;padding:0 3px}
.control-bar{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;margin-top:23px;gap:16px}.control-text{display:flex;align-items:center;gap:12px;min-width:0}.soft-icon{width:30px;height:30px;display:grid;place-items:center;color:#8ba57c;font-size:18px}.control-text strong{font-size:12px;font-weight:500}.control-text p{font-size:10px;color:#97a08f;margin-top:3px;max-width:450px}.actions{display:flex;gap:8px;flex-wrap:wrap;flex-shrink:0}.button{border-radius:9px;padding:11px 19px;font-size:12px;font-weight:500;white-space:nowrap;border:1px solid transparent}.primary{background:#496e51;color:#fff}.primary:hover{background:#365c40}.primary span{margin-left:28px}.secondary{background:#f8faf5;color:#628066;border-color:#e3eade}.secondary:hover{background:#edf3e7}.quiet{background:white;color:#8b8275;border-color:#e9e5db}.lower-grid{display:grid;grid-template-columns:1.06fr 1fr;gap:23px;margin-top:24px}.gentle-note,.diary-prompt{border-radius:12px;background:#f0f3e8;padding:21px;display:flex;gap:14px;align-items:center}.diary-prompt{background:#f2f0e7;justify-content:space-between}.note-icon{font-size:30px;color:#b2bc8e;padding:0 5px}.lower-grid h3{font-size:12px;color:#758067;font-weight:500}.lower-grid p{font-size:10px;color:#9caa90;margin-top:5px;line-height:1.9}.diary-prompt h3{color:#91856c}.diary-prompt p{color:#aaa08c}.round-button{border:1px solid #dddccb;background:transparent;color:#98967b;border-radius:50%;width:32px;height:32px;font-size:20px;flex-shrink:0}.bottom-note{font-size:9px;color:#a4ac9d;text-align:center;margin-top:28px}
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px}.settings-card,.privacy-card,.help-card{padding:28px}.settings-card label:not(.checkbox){display:block;font-size:12px;color:#697c67;margin:23px 0 8px}select{border:1px solid #dfe6d8;border-radius:8px;background:#fafcf7;padding:11px 13px;width:100%;color:var(--ink)}.checkbox{display:flex;gap:10px;margin:25px 0;font-size:12px;color:#71836c}.checkbox input{accent-color:var(--green)}#settings-notice{color:#6e8b63;font-size:12px;margin-top:13px}.privacy-card{background:#eff4e9}.privacy-card h2{font-size:20px;margin:16px 0}.privacy-card p,.help-card p{font-size:12px;color:#7c8971;line-height:1.95;margin-top:13px}.privacy-badge{font-size:10px;color:#7a916b;border:1px solid #cfddc4;padding:4px 9px;border-radius:6px}.help-card{margin-top:20px}.help-actions{display:flex;gap:10px;margin-top:19px}
.empty-state{text-align:center;padding:70px 24px}.empty-state>span{font-size:45px;color:#a1b295}.empty-state h2{font-size:20px;margin:12px}.empty-state p{color:#929d88;font-size:12px;margin-bottom:25px}.report-list{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.report-card{padding:24px}.report-date{font-size:12px;color:#819078}.report-card h2{font-size:24px;margin:14px 0}.report-card p{color:#94a087;font-size:11px;margin-bottom:20px}.report-card .button{width:100%}
.alert{margin-top:16px;padding:13px 18px;border-radius:9px;font-size:12px}.error{background:#fae9e3;color:#a54e3d}.demo-banner{background:#f5ecd3;color:#8d6c26;font-size:12px;padding:10px 16px;border-radius:8px;margin-top:16px}dialog{border:1px solid var(--line);border-radius:15px;padding:0;width:min(1040px,94vw);max-height:92vh;background:#f5f8f0}dialog::backdrop{background:#24392b70;backdrop-filter:blur(3px)}.dialog-header{display:flex;justify-content:space-between;align-items:center;padding:14px 21px;background:#fff}.dialog-header>div{display:flex;align-items:center;gap:14px}.dialog-header strong{font-size:14px}iframe{display:block;width:100%;height:72vh;border:0}.dialog-note{font-size:10px;color:#8b9881;text-align:center;padding:9px}#toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);background:#365642;color:white;padding:12px 22px;border-radius:10px;z-index:20;font-size:12px;max-width:90vw}
@media(min-width:1450px){main{padding-left:64px;padding-right:64px}.preview{aspect-ratio:1.9}.illustration svg{max-height:315px}.timer-ring{width:220px;height:220px;margin-top:20px}}
@media(max-width:1150px){.sidebar{width:200px;padding:28px 16px}main{margin-left:200px;padding:0 24px 24px}.brand{font-size:23px}.brand-sub{font-size:8px}.study-grid{gap:16px;grid-template-columns:minmax(0,1.6fr) minmax(255px,1fr)}.control-bar{align-items:flex-start;flex-direction:column}.actions{width:100%;justify-content:flex-end}.timer-ring{width:175px;height:175px}.timer-tip{margin-bottom:17px}.preview{aspect-ratio:1.45}.illustration svg{width:94%}.lower-grid{gap:16px}.report-list{grid-template-columns:1fr 1fr}}
@media(max-width:800px){.sidebar{position:relative;width:100%;height:auto;padding:17px 20px;border-right:0;border-bottom:1px solid var(--line);flex-direction:row;align-items:center;justify-content:space-between}.brand{font-size:23px}.brand-icon{width:35px;height:38px}.brand-sub,.nav-label,.sidebar-bottom{display:none}nav{display:flex;gap:5px}.nav-item{margin:0;padding:10px;gap:6px;font-size:11px;width:auto}.nav-item svg{width:16px}.nav-count{display:none}main{margin:0;padding:0 20px 25px}.topbar{height:54px}.page-heading{margin:26px 0 23px}h1{font-size:27px}.eyebrow{font-size:8px}.study-grid{grid-template-columns:1fr}.preview{aspect-ratio:1.8}.illustration svg{width:70%;max-height:220px}.timer-card{display:grid;grid-template-columns:1fr 1fr}.timer-card>.card-header{grid-column:1/-1}.timer-ring{grid-row:2/4;margin:0 auto 17px}.timer-tip{margin:15px 17px 10px 0}.mini-stats{margin:0 15px 18px 0}.timer-settings{grid-column:1/-1}.settings-grid{grid-template-columns:1fr}.lower-grid{grid-template-columns:1fr}.control-bar{padding:18px}.report-list{grid-template-columns:1fr 1fr}}
@media(max-width:480px){main{padding:0 14px 20px}.sidebar{padding:13px 14px}.nav-item{padding:9px 7px}.nav-item svg{display:none}.brand{gap:7px;font-size:21px}.page-heading .pill{display:none}.page-heading h1{font-size:25px}.page-heading p{font-size:11px}.card-header{padding:16px}.card-header h2{font-size:13px}.preview{margin:0 10px;aspect-ratio:1.4}.illustration svg{width:91%}.posture-status{padding:16px}.actions .button{padding:10px 14px}.actions{justify-content:flex-start}.report-list{grid-template-columns:1fr}.timer-ring{width:158px;height:158px}.timer-text>strong{font-size:33px}.timer-tip{padding:8px}.timer-tip span{display:none}.mini-stats strong{font-size:18px}}
@media(min-width:801px) and (max-height:850px){.topbar{height:62px}.page-heading{margin:23px 0 21px}h1{font-size:27px}.card-header{padding:16px 20px}.preview{aspect-ratio:2.5}.illustration{padding:0 0 13px}.illustration svg{max-height:170px;width:67%}.illustration>span{margin-top:3px}.posture-status{padding:15px 23px;min-height:77px}.timer-ring{width:157px;height:157px;margin:0 auto 9px}.timer-text>strong{font-size:32px}.timer-tip{margin-bottom:14px;padding:8px 11px}.mini-stats{margin-bottom:11px}.timer-settings{padding:10px 0}.control-bar{margin-top:17px;padding:16px 20px}.lower-grid{margin-top:17px}.gentle-note,.diary-prompt{padding:16px 20px}.bottom-note{margin-top:18px}}