:root{color-scheme:dark;--bg:#041d2b;--surface:#0b3042;--surface2:#113c4f;--ink:#f5fbff;--muted:#9db7c5;--cyan:#25c9c3;--blue:#44b9f2;--dry:#4bbbe9;--slight:#efb547;--heavy:#ff767e;--ok:#21bd93;--line:rgba(255,255,255,.10);font-family:Inter,"Noto Sans SC","Microsoft YaHei",system-ui,sans-serif}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 18% -5%,#0d4b61 0,transparent 38%),linear-gradient(145deg,#031925,#062a3b 68%,#062333);color:var(--ink)}button,input,select{font:inherit}.hidden{display:none!important}.ambient{position:fixed;border-radius:50%;filter:blur(80px);opacity:.16;pointer-events:none}.ambient-a{width:28rem;height:28rem;background:#08b9c4;top:-14rem;right:-8rem}.ambient-b{width:24rem;height:24rem;background:#0878c9;bottom:-14rem;left:-10rem}.glass{background:linear-gradient(145deg,rgba(18,61,79,.89),rgba(7,37,51,.9));border:1px solid var(--line);box-shadow:0 24px 80px rgba(0,0,0,.18);backdrop-filter:blur(18px)}.auth-layout{position:relative;z-index:1;min-height:100vh;display:grid;grid-template-columns:1.1fr minmax(320px,470px);gap:8vw;align-items:center;max-width:1160px;margin:auto;padding:6vw}.auth-brand h1{font-size:clamp(3.3rem,8vw,6.6rem);letter-spacing:.08em;margin:.1em 0}.lead{font-size:clamp(1.15rem,2vw,1.6rem);color:#c5dde9}.eyebrow{margin:0;color:#6fd8db;font-size:.78rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase}.brand-mark{position:relative;width:78px;height:78px;border-radius:24px;background:linear-gradient(145deg,#35d2cd,#1595ce);box-shadow:0 18px 45px rgba(25,188,202,.25)}.brand-mark span{position:absolute;inset:17px 25px 23px;border-radius:50% 50% 48% 52%;background:white;transform:rotate(45deg)}.brand-mark i{position:absolute;width:32px;height:6px;border-radius:5px;background:#0b829c;bottom:18px;left:23px}.trust-list{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:2rem}.trust-list span,.badge{padding:.55rem .8rem;border-radius:999px;background:rgba(255,255,255,.08);color:#c9dee7;font-size:.83rem}.auth-card{border-radius:28px;padding:2rem}.tabs{display:grid;grid-template-columns:1fr 1fr;background:rgba(0,0,0,.16);padding:.3rem;border-radius:14px;margin-bottom:1.6rem}.tab{border:0;background:transparent;color:var(--muted);padding:.75rem;border-radius:11px;cursor:pointer}.tab.active{background:#174b60;color:white}.form-stack{display:grid;gap:1rem}.form-stack label,.panel label{display:grid;gap:.5rem;color:#c6d8e1;font-size:.88rem}input,select{width:100%;border:1px solid var(--line);border-radius:13px;background:rgba(2,22,31,.55);color:white;padding:.9rem 1rem;outline:none}input:focus,select:focus{border-color:#3fcbd0;box-shadow:0 0 0 3px rgba(63,203,208,.12)}button{cursor:pointer}.primary,.secondary,.ghost{border:0;border-radius:13px;padding:.85rem 1rem;font-weight:800}.primary{background:linear-gradient(120deg,#25c9c3,#2aa8e8);color:#022432}.secondary{background:rgba(74,191,224,.14);color:#80d8f1;border:1px solid rgba(86,202,232,.22)}.ghost{background:transparent;color:var(--muted)}.message{min-height:1.2em;color:#ffaaa9;font-size:.88rem}.message.success{color:#61dfba}.privacy-note{color:#6f94a5;font-size:.75rem;line-height:1.6;margin:1.4rem 0 0}.app{position:relative;z-index:1;max-width:1260px;margin:auto;padding:1.1rem 1.5rem 5rem}.topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;padding:.65rem 0 1.5rem}.compact-brand{display:flex;align-items:center;gap:.65rem;color:white;text-decoration:none}.compact-brand small{color:var(--muted)}.mini-mark{width:36px;height:36px;border-radius:12px;background:linear-gradient(145deg,#35d2cd,#1595ce)}.recipient-picker{display:flex;align-items:center;gap:.7rem;color:var(--muted);font-size:.78rem}.recipient-picker select{min-width:170px;padding:.55rem .8rem}.user-area{justify-self:end;display:flex;align-items:center;gap:.5rem;color:#bfd4dd}.nav{position:sticky;top:12px;z-index:5;display:flex;width:max-content;margin:0 auto 2.3rem;padding:.35rem;border-radius:18px}.nav-item{display:flex;align-items:center;gap:.45rem;border:0;background:transparent;color:var(--muted);padding:.7rem 1.25rem;border-radius:14px}.nav-item.active{background:#174b60;color:white}.nav-item span{font-size:1.15rem}.page{display:none}.active-page{display:block}.hero{display:grid;grid-template-columns:1.35fr 1fr;gap:2rem;border-radius:30px;padding:clamp(1.5rem,4vw,3.2rem);min-height:315px;align-items:center;overflow:hidden;position:relative}.hero:after{content:"";position:absolute;width:290px;height:290px;border:55px solid rgba(42,190,206,.05);border-radius:50%;right:-90px;top:-90px}.state-title{display:flex;align-items:center;gap:1.2rem}.state-title h2{font-size:clamp(2.8rem,7vw,5.8rem);margin:.12em 0}.state-icon{display:grid;place-items:center;width:84px;height:84px;border-radius:28px;background:rgba(255,118,126,.12);color:var(--heavy);font-size:3rem}.state-advice{font-size:1.1rem;color:#c3d8e1}.state-meta{position:relative;z-index:1}.badge{display:inline-flex;align-items:center;gap:.4rem}.badge.online{color:#6ce0bd;background:rgba(33,189,147,.12)}.badge.offline{color:#b1c1c8}.state-meta dl{display:grid;gap:.75rem}.state-meta dl div{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--line);padding:.8rem 0}.state-meta dt{color:var(--muted)}.state-meta dd{margin:0;font-weight:800}.range-row,.section-heading{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin:2.5rem 0 1rem}.range-row h2,.section-heading h2{margin:.35rem 0 0}.segmented{display:flex;background:rgba(0,0,0,.18);padding:.25rem;border-radius:13px}.segmented button{border:0;background:transparent;color:var(--muted);padding:.6rem .9rem;border-radius:10px}.segmented button.active{background:#1a5369;color:white}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.metric{border-radius:23px;padding:1.35rem;min-height:190px}.metric p{color:#bdd0d9}.metric strong{display:block;font-size:2.15rem;margin:.8rem 0}.metric small{color:var(--muted);line-height:1.5}.metric-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;font-size:1.35rem}.metric-icon.dry{color:var(--dry);background:rgba(75,187,233,.12)}.metric-icon.slight{color:var(--slight);background:rgba(239,181,71,.12)}.metric-icon.heavy{color:var(--heavy);background:rgba(255,118,126,.12)}.metric-icon.change{color:var(--cyan);background:rgba(37,201,195,.12)}.timeline{border-radius:24px;padding:.5rem 1.3rem}.event{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;padding:1.1rem 0;border-bottom:1px solid var(--line)}.event:last-child{border-bottom:0}.event-dot{width:14px;height:14px;border-radius:50%}.event-main strong{display:block}.event-main small,.event-side{color:var(--muted);font-size:.82rem}.event-side{text-align:right}.empty{text-align:center;color:var(--muted);padding:3rem}.family-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:1rem}.panel{border-radius:24px;padding:1.5rem}.panel h3{margin-top:0}.panel p,.plain-list{color:var(--muted);line-height:1.7}.panel .primary{margin-top:1rem}.invite-result{display:flex;gap:.6rem;margin-top:1rem}.invite-result code{flex:1;padding:.9rem;border-radius:12px;background:rgba(0,0,0,.25);overflow:auto;color:#77e0dc}.plain-list{padding-left:1.2rem}.setup-dialog{width:min(92vw,470px);border:1px solid var(--line);border-radius:24px;background:#0a2c3d;color:white;padding:1.7rem}.setup-dialog::backdrop{background:rgba(0,14,21,.72);backdrop-filter:blur(8px)}.setup-dialog h2{margin-top:0}
@media(max-width:850px){.auth-layout{grid-template-columns:1fr;gap:2rem}.auth-brand h1{font-size:4rem}.auth-brand{padding-top:2rem}.topbar{grid-template-columns:1fr auto}.recipient-picker{grid-column:1/-1;grid-row:2}.user-area{grid-column:2}.hero{grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(2,1fr)}.family-grid{grid-template-columns:1fr}}
@media(max-width:560px){.app{padding:.8rem .9rem 6rem}.auth-layout{padding:1.2rem}.auth-brand{padding:1.5rem .4rem 0}.auth-brand h1{font-size:3rem}.auth-card{padding:1.25rem;border-radius:23px}.topbar{padding-bottom:1rem}.compact-brand small,.user-area span{display:none}.recipient-picker{justify-content:space-between}.recipient-picker select{min-width:0;flex:1}.nav{position:fixed;top:auto;bottom:max(10px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:calc(100% - 1.8rem);justify-content:space-around;margin:0}.nav-item{flex:1;justify-content:center;padding:.75rem .4rem}.hero{border-radius:24px;padding:1.4rem;min-height:390px}.state-title h2{font-size:3.3rem}.state-icon{width:67px;height:67px;border-radius:22px}.range-row{align-items:flex-start;flex-direction:column}.stats-grid{grid-template-columns:1fr 1fr;gap:.7rem}.metric{padding:1rem;min-height:175px}.metric strong{font-size:1.65rem}.event{grid-template-columns:auto 1fr}.event-side{grid-column:2;text-align:left}.family-grid{grid-template-columns:1fr}}