:root{color:#1a1a1a;background:#f6f7f9;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.5}*{box-sizing:border-box}body{min-height:100vh;margin:0}button{font:inherit;cursor:pointer}.family-clock{--cu-base:#b9743f;--cu-hi:#f7d3a8;--cu-mid:#cf8c58;--cu-lo:#8a4d28;--cu-deep:#5b3015;--cu-engrave:#3c2110;--grain:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'220'%20height%3D'220'%3E%3Cfilter%20id%3D'n'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'0.012%200.5'%20numOctaves%3D'3'%20seed%3D'7'%2F%3E%3CfeColorMatrix%20type%3D'saturate'%20values%3D'0'%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D'100%25'%20height%3D'100%25'%20filter%3D'url(%23n)'%2F%3E%3C%2Fsvg%3E");color:#e9e2d4;-webkit-font-smoothing:antialiased;background:radial-gradient(120% 90% at 50% 28%,#2a2723 0%,#1c1a17 52%,#100f0d 100%);border-radius:8px;justify-content:center;align-items:center;width:100%;padding:clamp(18px,6%,44px);font-family:Georgia,Times New Roman,serif;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff0d}.family-clock:before{content:"";pointer-events:none;background:radial-gradient(60% 40% at 50% 84%,#0000008c,#0000 70%);position:absolute;inset:0}.family-clock .scene{z-index:1;flex-direction:column;align-items:center;gap:22px;width:100%;display:flex;position:relative}.family-clock .clock{aspect-ratio:1;filter:drop-shadow(0 24px 34px #0009)drop-shadow(0 6px 10px #0006);border-radius:50%;width:100%;max-width:420px;position:relative;container-type:size}.family-clock .disc{transform-origin:50%;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.family-clock .layer{transform-origin:50%;width:100%;height:100%;transition:transform var(--spin,1.7s) cubic-bezier(.62, .02, .27, 1);will-change:transform;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(0)}.family-clock .frame{background:conic-gradient(from 0deg, var(--cu-lo), var(--cu-hi) 18%, var(--cu-mid) 32%, var(--cu-lo) 50%, var(--cu-hi) 70%, var(--cu-mid) 83%, var(--cu-lo) 100%), radial-gradient(circle at 38% 30%, var(--cu-hi), var(--cu-base) 55%, var(--cu-deep) 100%);background-blend-mode:soft-light, normal;width:100%;height:100%;box-shadow:inset 0 0 0 2px #00000040,inset 0 3px 9px #ffffff59,inset 0 -8px 22px #0000008c,inset 0 0 60px #0000004d}.family-clock .frame-lip{background:radial-gradient(circle at 42% 36%, var(--cu-hi), var(--cu-mid) 60%, var(--cu-deep) 100%);box-shadow:inset 0 0 0 1px #0006,inset 0 6px 14px #0009,0 0 0 1px #0000004d}.family-clock .dial-spoke{transform-origin:50%;pointer-events:none;position:absolute;inset:0}.family-clock .track{background:0 0;border-radius:50%;box-shadow:0 0 0 1px #00000029,inset 0 0 0 1px #00000024,0 1px #ffffff0a}.family-clock .dial-sym{transition:transform var(--spin,1.7s) cubic-bezier(.62, .02, .27, 1);will-change:transform;justify-content:center;align-items:center;display:flex;position:absolute;left:50%}.family-clock .dial-sym svg{width:70%;height:70%;color:var(--cu-engrave);stroke-width:1.8px;opacity:.42;filter:drop-shadow(0 1px #ffffff42)drop-shadow(0 -1px 1px #00000080);transition:opacity .7s,color .7s,filter .7s}.family-clock .dial-sym.active svg{color:var(--cu-hi);opacity:1;stroke-width:2.1px;filter:drop-shadow(0 0 7px #f7d3a899)drop-shadow(0 1px 1px #00000080)}.family-clock .top-pointer{z-index:6;pointer-events:none;filter:drop-shadow(0 2px 4px #0000008c);flex-direction:column;align-items:center;display:flex;position:absolute;top:1.5%;left:50%;transform:translate(-50%)}.family-clock .pointer-gem{background:radial-gradient(circle at 38% 32%, #fff0d8, var(--cu-hi) 42%, var(--cu-lo) 100%);border-radius:50%;width:1.9cqmin;height:1.9cqmin;margin-bottom:-.2cqmin;box-shadow:inset 0 0 0 1px #0000004d,inset 0 1px 1px #fff9,0 0 9px #f7d3a880}.family-clock .pointer-stem{background:linear-gradient(90deg, var(--cu-lo), var(--cu-hi) 45%, var(--cu-mid) 55%, var(--cu-deep));border-radius:2px 2px 0 0;width:.8cqmin;height:3cqmin}.family-clock .pointer-tip{border-left:1.5cqmin solid #0000;border-right:1.5cqmin solid #0000;border-top:2.6cqmin solid var(--cu-hi);width:0;height:0}.family-clock .wood{--base:#7a3322;--dark:#4f1d12;--light:#9a4a34;background:repeating-radial-gradient(circle at 50% 50%, #0000000e 0 1px, transparent 1px 5px), repeating-radial-gradient(circle at 50% 50%, #ffffff0b 0 1px, transparent 1px 9px), radial-gradient(circle at 50% 50%, var(--light) 0%, var(--base) 52%, var(--dark) 100%);box-shadow:inset 0 0 26px #0000006b,inset 0 2px 3px #ffffff24,0 5px 16px #00000080,0 0 0 1px #00000059}.family-clock .wood:after{content:"";background-image:var(--grain);opacity:.16;mix-blend-mode:overlay;background-size:cover;border-radius:50%;position:absolute;inset:0}.family-clock .sheen{pointer-events:none;mix-blend-mode:soft-light;background:radial-gradient(58% 50% at 36% 26%,#ffffff38,#0000 60%),radial-gradient(70% 60% at 64% 88%,#0000004d,#0000 62%);border-radius:50%;position:absolute;inset:0}.family-clock .fixed-names{pointer-events:none;z-index:5;position:absolute;inset:0}.family-clock .name-tag{white-space:nowrap;background:radial-gradient(circle at 40% 30%, var(--cu-hi), var(--cu-mid) 55%, var(--cu-deep) 100%);border-radius:999px;align-items:center;gap:.38em;padding:.2em .6em;display:flex;position:absolute;left:50%;transform:translate(-50%,-50%);box-shadow:inset 0 1px #ffffff73,inset 0 -2px 4px #00000073,0 2px 5px #00000080}.family-clock .name-tag .dot{border-radius:50%;width:.6em;height:.6em;box-shadow:inset 0 0 0 1px #00000059,0 0 4px #0000004d}.family-clock .name-tag span{letter-spacing:.05em;color:var(--cu-engrave);text-shadow:0 1px #fff6;font-size:clamp(8px,4cqmin,16px);font-weight:700}.family-clock .medallion{background:radial-gradient(circle at 40% 32%, var(--cu-hi), var(--cu-mid) 52%, var(--cu-lo) 80%, var(--cu-deep) 100%);justify-content:center;align-items:center;display:flex;box-shadow:inset 0 0 0 2px #0000004d,inset 0 2px 4px #fff6,inset 0 -6px 14px #0000008c,0 6px 16px #0000008c}.family-clock .medallion .crest{object-fit:contain;opacity:.86;filter:drop-shadow(0 1px #ffffff52)drop-shadow(0 -1px 1px #0000006b);width:64%;height:78%;display:block}.family-clock .legend{z-index:1;flex-wrap:wrap;justify-content:center;gap:clamp(12px,2vw,24px);display:flex;position:relative}.family-clock .leg{align-items:center;gap:.55em;display:flex}.family-clock .leg .sw{border-radius:3px;width:.95em;height:.95em;box-shadow:inset 0 0 0 1px #0006,0 1px 2px #0006}.family-clock .leg .who{letter-spacing:.04em;color:#efe8da;font-size:clamp(13px,1.4vw,18px);font-weight:700}.family-clock .leg .st{color:#b9ad97;font-size:clamp(12px,1.3vw,16px);font-style:italic}.family-clock .leg .arrow-sep{color:#6f6757}@media (prefers-reduced-motion:reduce){.family-clock .layer,.family-clock .dial-sym,.family-clock .dial-sym svg{transition:none}}.app{flex-direction:column;max-width:640px;min-height:100vh;margin:0 auto;padding:24px 16px 20px;display:flex}.app--landing{max-width:none;padding:20px 0 0}.app-header{justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px;display:flex}.app--landing .app-header{width:min(1120px,100% - 32px);margin:0 auto 28px}.brand{color:#15202b;letter-spacing:0;white-space:nowrap;align-items:center;gap:10px;font-size:18px;font-weight:800;text-decoration:none;display:inline-flex}.brand-mark{border-radius:10px;width:34px;height:34px;display:block}.app-nav{align-items:center;gap:14px;display:flex}.app-main{flex:1}.app--landing .app-main{width:100%}.app-footer{color:#888;text-align:center;margin-top:32px;font-size:12px}.app--landing .app-footer{width:min(1120px,100% - 32px);margin:20px auto 0;padding:20px 0}.muted{color:#777}.error{color:#d32f2f;margin-top:12px}.card{background:#fff;border:1px solid #e6e8eb;border-radius:8px;padding:24px}.login h2{margin:0 0 4px}.login form{flex-direction:column;gap:8px;margin-top:16px;display:flex}.login label{color:#333;font-size:13px;font-weight:600}.login input{border:1px solid #ddd;border-radius:8px;padding:12px 14px;font-size:16px}.login button[type=submit]{color:#fff;background:#2196f3;border:none;border-radius:8px;margin-top:8px;padding:12px 14px;font-weight:600}.login-sent{flex-direction:column;gap:8px;margin-top:16px;display:flex}.login-sent button:not(.link){color:#fff;background:#2196f3;border:none;border-radius:8px;padding:12px 14px;font-weight:600}.login button:disabled{opacity:.5}button.link{color:#2196f3;background:0 0;border:none;padding:6px 0;font-weight:600}a.link{color:#2196f3;font-weight:600;text-decoration:none}.button-link{color:#fff;background:#2196f3;border:1px solid #2196f3;border-radius:8px;justify-content:center;align-items:center;min-height:46px;padding:0 18px;font-weight:800;line-height:1;text-decoration:none;display:inline-flex;box-shadow:0 12px 24px #2196f338}.button-link--compact{min-height:38px;box-shadow:none;padding:0 14px}.landing{color:#15202b}.landing-hero{grid-template-columns:minmax(0,1fr) 420px;align-items:center;gap:52px;width:min(1120px,100% - 32px);min-height:calc(100vh - 144px);margin:0 auto;padding:28px 0 64px;display:grid}.landing-copy{max-width:650px}.eyebrow{color:#2196f3;letter-spacing:.08em;text-transform:uppercase;margin:0 0 12px;font-size:12px;font-weight:800}.landing h1,.landing h2{letter-spacing:0;margin:0;line-height:1.05}.landing h1{max-width:760px;font-size:clamp(44px,7vw,76px)}.landing h2{font-size:clamp(30px,4vw,46px)}.hero-text{color:#435464;max-width:660px;margin:22px 0 0;font-size:20px;line-height:1.55}.hero-actions{flex-wrap:wrap;align-items:center;gap:18px;margin-top:30px;display:flex}.trust-strip{flex-wrap:wrap;gap:10px;margin-top:30px;display:flex}.trust-strip span{color:#1266a8;background:#eaf5ff;border:1px solid #cce8ff;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:800}.hero-showcase{border-radius:8px;box-shadow:0 24px 70px #2e547029}.landing-section{grid-template-columns:.8fr 1.2fr;gap:32px;width:min(1120px,100% - 32px);margin:0 auto;padding:72px 0;display:grid}.privacy-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;display:grid}.privacy-card{background:#fff;border:1px solid #e0e8ef;border-radius:8px;padding:20px}.privacy-card span{color:#2196f3;font-size:12px;font-weight:800}.privacy-card p{color:#33485a;margin:18px 0 0;font-weight:650}.landing-section--split{border-top:1px solid #e0e8ef;grid-template-columns:minmax(0,1fr) minmax(320px,420px);align-items:start}.signin-copy{max-width:560px}.signin-copy .muted{margin-top:16px;font-size:18px;line-height:1.6}@media (width<=900px){.landing-hero,.landing-section,.landing-section--split{grid-template-columns:1fr}.landing-hero{gap:36px;min-height:0;padding-top:18px}.hero-showcase{justify-self:stretch}.privacy-grid{grid-template-columns:1fr}}@media (width<=620px){.app{padding-left:12px;padding-right:12px}.app--landing{padding-left:0;padding-right:0}.app-header{flex-direction:column;align-items:flex-start}.app--landing .app-header{width:min(100% - 24px,1120px)}.app-nav{flex-wrap:wrap}.brand{font-size:17px}.landing-hero,.landing-section{width:min(100% - 24px,1120px)}.landing h1{font-size:42px}.hero-text{font-size:17px}.landing-section{padding:52px 0}.landing-section--split{grid-template-columns:1fr}.landing-section--split .login{min-width:0}.app--landing .app-footer{width:min(100% - 24px,1120px)}}.status-list{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.status-row{background:#fff;border:1px solid #e6e8eb;border-radius:12px;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:14px 16px;display:grid}.status-row .dot{border-radius:50%;width:12px;height:12px;display:inline-block}.status-row .member{font-weight:600}.status-row .status{text-align:right;color:#333;font-weight:600}.status-row .meta{text-align:right;color:#888;grid-column:1/4;justify-content:flex-end;gap:10px;font-size:12px;display:flex}.status-row .note.stale{color:#b26a00}.status-row .note.unknown{color:#9e9e9e}.clock-simulator{flex-direction:column;gap:18px;display:flex}.simulator-token{flex-direction:column;gap:10px;display:flex}.simulator-token h2,.simulator-header h2{margin:0}.simulator-token label{font-size:13px;font-weight:600}.simulator-token input{border:1px solid #ddd;border-radius:10px;padding:12px 14px;font-size:16px}.simulator-token button{color:#fff;background:#2196f3;border:none;border-radius:10px;padding:12px 14px;font-weight:600}.simulator-token button:disabled{opacity:.5}.simulator-header{justify-content:space-between;align-items:center;gap:16px;display:flex}.clock-ring{aspect-ratio:1;background:#fff;border:1px solid #d5dce3;border-radius:50%;align-self:center;width:min(320px,88vw);position:relative}.clock-ring-slot{color:#1a1a1a;border:1px solid #cbd5e1;border-radius:50%;place-items:center;width:44px;height:44px;margin:-22px 0 0 -22px;font-weight:700;display:grid;position:absolute}.clock-ring-center{text-align:center;place-items:center;width:84px;height:68px;display:grid;position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.clock-ring-center strong{font-size:28px;line-height:1}.clock-ring-center span{color:#777;font-size:12px}.simulator-members{margin-top:4px}
