@charset "UTF-8";
:root{--ink:#182a2a;--muted:#61716d;--paper:#f5f4ed;--green:#244e44;--mint:#b6dfcc;--line:#d7ddd5;--danger:#a83535;font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,.button{min-height:48px;border:1px solid var(--line);border-radius:12px;padding:12px 19px;cursor:pointer;color:var(--ink);background:white;font-weight:600;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:18px}button:hover,.button:hover{filter:brightness(.96)}button:disabled{opacity:.55;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #b18539;outline-offset:4px}.primary{background:var(--green);color:white;border-color:var(--green)}.secondary{background:transparent}.danger{color:var(--danger);background:#fff6f3;border-color:#e1b4ad}.site-header{height:100px;max-width:1400px;margin:auto;padding:0 6%;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{font-size:23px;font-weight:750;display:flex;align-items:center;gap:11px;letter-spacing:-.8px;color:var(--ink);text-decoration:none}.brand-dot{width:23px;height:23px;background:var(--green);border:6px solid var(--mint);border-radius:50%;display:inline-block;flex-shrink:0}.brand-tag{font-size:9px;font-weight:600;letter-spacing:1.4px;margin-left:18px;border-left:1px solid var(--line);padding-left:20px}.text-link{font-size:14px;color:var(--ink);text-decoration:none}.hero{max-width:1400px;margin:auto;display:grid;grid-template-columns:1fr 1fr;min-height:700px;padding:65px 6% 70px;overflow:hidden}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:750;line-height:1.6;color:var(--green);text-transform:uppercase}.hero h1{font-size:clamp(58px,6.5vw,92px);line-height:1.02;letter-spacing:-5px;font-weight:580;margin:30px 0}.hero h1 em{font-family:Georgia,serif;font-weight:400;color:#4e7664}.lead{font-size:18px;line-height:1.7;max-width:420px;color:#52665e}.hero .button{margin-top:22px}.quiet{color:var(--muted);font-size:13px;line-height:1.6}.hero .quiet{margin-top:20px}.hero-scene{position:relative;min-height:535px;display:flex;align-items:center;justify-content:center}.ball{width:405px;height:405px;border-radius:50%;background:radial-gradient(circle at 35% 25%,#fafbf7 5%,#e8ece5 58%,#a1b1a5 87%,#5d7767);padding:32px;box-shadow:inset -10px -10px 24px #6a7d6477,0 20px 35px #54705712;transform:rotate(-7deg);z-index:2}.ball-face{background:radial-gradient(circle at 40% 30%,#293c39,#101e1d 78%);color:#faf9f1;border-radius:50%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:inset 0 3px 8px #0009;border:5px solid #23312d}.ball-date{font-size:10px;letter-spacing:1.5px;color:#aec8bb}.ball-clock{font-size:82px;letter-spacing:-5px;line-height:1.2;font-weight:400}.pill{padding:7px 13px;border-radius:30px;background:#a7d8bf20;color:#b8dfcb;font-size:11px;margin:8px}.ball-next{display:flex;gap:12px;align-items:center;margin-top:17px}.ball-next img{width:35px;height:35px;filter:brightness(0) invert(1);opacity:.8}.ball-next strong{font-size:13px;font-weight:500;display:block}.ball-next small{color:#90a99e;font-size:10px;display:block;margin-top:5px}.ball-shadow{position:absolute;width:330px;height:45px;background:#71877844;filter:blur(18px);bottom:24px;border-radius:50%}.orbit{position:absolute;border:1px solid #bbcfc055;border-radius:50%;width:510px;height:510px}.orbit-two{width:600px;height:600px}.scene-caption{position:absolute;bottom:-15px;font-size:12px;color:#556c61;z-index:3;text-align:center}.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#729781;margin-right:8px}.example{display:block;font-size:10px;color:#809184;margin-top:8px}.intro-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:30px 6%;display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:30px;align-items:center;max-width:1400px;margin:auto;font-size:13px;line-height:1.6}.intro-strip p{margin:0;font-size:16px}.intro-strip span{display:block;color:#889a8c;font-size:11px;margin-bottom:8px}.story{max-width:1400px;padding:105px 9%;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:13%}h2{font-size:36px;line-height:1.15;letter-spacing:-1.1px;font-weight:550}h3{font-size:18px}.story p,.closing p{color:var(--muted);font-size:15px;line-height:1.8}.steps{list-style:none;padding:0;margin:0}.steps li{display:flex;gap:25px;padding:18px 0;border-bottom:1px solid var(--line)}.steps b{font-size:12px;color:#6d8e78;padding-top:22px}.steps h3{margin-bottom:10px}.steps p{margin-top:0}.interaction{background:#e4ece2;padding:65px 8%;text-align:center}.gesture-grid{max-width:1160px;margin:45px auto 0;display:grid;grid-template-columns:repeat(4,1fr);gap:30px}.gesture-grid>div{border-left:1px solid #cbd7c7;padding:10px 20px}.gesture-grid>div:first-child{border:0}.gesture-grid span{font-size:30px;font-weight:300;color:var(--green)}.gesture-grid p{font-size:13px;line-height:1.6;color:var(--muted)}.closing{padding:85px 25px;max-width:660px;margin:auto;text-align:center}footer{border-top:1px solid var(--line);padding:26px 6%;display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}footer a{color:var(--muted)}.panel{background:#fffef9;border:1px solid var(--line);border-radius:20px;padding:30px}.narrow{max-width:560px;margin:50px auto}.center-page{min-height:100vh;display:grid;place-items:center;padding:20px}.center-page h1,.setup-layout h1{font-size:44px;letter-spacing:-2px;font-weight:550;line-height:1.1}.setup-layout{max-width:1060px;margin:60px auto;padding:0 24px;display:grid;grid-template-columns:1fr 1fr;gap:70px}.setup-layout h1{font-size:62px}.setup-layout .quiet{max-width:340px}label{display:block;font-size:14px;font-weight:600;margin-bottom:19px}input,select,textarea{display:block;width:100%;padding:13px;border:1px solid #c7d0c8;border-radius:9px;background:white;margin-top:8px;min-height:47px;color:var(--ink)}textarea{resize:vertical}fieldset{border:0;border-top:1px solid var(--line);padding:20px 0 5px;margin:20px 0}legend{font-weight:700;padding-right:12px}.check{display:flex;align-items:center;gap:10px;font-weight:450;line-height:1.5}.check input{width:20px;height:20px;min-height:20px;margin:0;flex-shrink:0}.form-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}.form-row .check{align-self:end;min-height:47px}.form-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:25px}.app-main{max-width:1160px;padding:45px 28px 90px;margin:auto}.app-title{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:40px}.app-title h1{font-size:44px;letter-spacing:-1.8px;font-weight:550;margin:10px 0}.tabs{display:flex;gap:7px;border-bottom:1px solid var(--line);padding-bottom:17px;overflow-x:auto}.tabs button{white-space:nowrap;background:transparent;border-color:transparent}.tabs button[aria-pressed=true]{background:var(--green);color:white}.filters{display:flex;gap:20px;margin:26px 0}.filters label{width:220px;color:var(--muted);font-weight:400}.filters select{background:transparent}.entry-card{display:flex;align-items:center;gap:24px;background:#fffef9;border:1px solid var(--line);border-radius:16px;padding:26px;margin:16px 0}.entry-card img{width:52px;height:52px;background:#e9f0e6;padding:11px;border-radius:14px}.entry-info{flex:1;min-width:0;overflow-wrap:anywhere}.entry-info h2{font-size:23px;letter-spacing:-.6px;margin:8px 0}.entry-info p{margin:7px 0;font-size:14px}.entry-info .eyebrow{font-size:10px;color:var(--muted)}.empty{text-align:center;padding:70px 25px;color:var(--muted)}.empty span{font-size:50px;color:#8ca894}.empty h2{font-size:25px;color:var(--ink)}.person-row{display:flex;align-items:center;gap:25px;margin-top:18px}.person-row h3{flex:1}.app-main .panel{margin-bottom:18px}.app-main .panel button{margin:8px 8px 0 0}dialog{max-height:92vh;overflow-y:auto;width:580px;max-width:calc(100% - 24px);border:1px solid var(--line);border-radius:20px;padding:28px;background:var(--paper);color:var(--ink)}dialog::backdrop{background:#10231dc0;backdrop-filter:blur(4px)}.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.dialog-heading h2,dialog h2{font-size:27px}.close{font-size:27px;background:transparent;border:0;padding:3px 14px}details{font-size:13px;margin:0 0 20px}details label{margin-top:20px}summary{cursor:pointer;color:var(--muted)}[role=alert],#message,#form-message,#person-message{color:#7b4035;line-height:1.5;font-size:14px}#message:empty{display:none}[hidden]{display:none!important}
@media(max-width:850px){.brand-tag{display:none}.hero{grid-template-columns:1fr 1fr;min-height:570px;padding-top:30px}.hero h1{font-size:64px}.hero-scene{transform:scale(.78);min-height:470px}.lead{font-size:16px}.intro-strip{grid-template-columns:1fr 1fr}.story{gap:8%;padding:60px 6%}.gesture-grid{gap:10px}.setup-layout{gap:30px}.site-header{height:80px}}
@media(max-width:600px){.site-header{padding:0 22px}.brand{font-size:20px}.text-link{font-size:12px}.hero{display:flex;flex-direction:column;padding:28px 26px 35px}.hero h1{font-size:65px;letter-spacing:-3.5px;margin:20px 0}.hero .lead{max-width:320px}.hero-scene{min-height:445px;margin:-20px -35px -35px;transform:scale(.82)}.ball{flex-shrink:0}.intro-strip{padding:28px;gap:24px}.intro-strip p{font-size:14px}.intro-strip div{font-size:12px}.story{display:block;padding:50px 28px}.story h2,h2{font-size:31px}.steps{margin-top:35px}.interaction{padding:40px 22px}.gesture-grid{grid-template-columns:1fr 1fr}.gesture-grid>div{border:0}.closing{padding:55px 28px}footer{display:block;line-height:2.4;padding:22px 28px}footer a{display:block}.setup-layout{display:block;margin:25px auto;padding:0 20px}.setup-layout h1{font-size:45px}.setup-layout .panel{margin-top:30px;padding:22px}.site-header>span:not(.brand){font-size:11px}.app-main{padding:20px 18px 50px}.app-title{display:block;margin-bottom:24px}.app-title h1{font-size:36px}.app-title>button{width:100%;margin-top:15px}.tabs{gap:0}.tabs button{font-size:13px;padding:12px}.filters{gap:12px;margin-bottom:0}.entry-card{padding:18px 14px;gap:13px;flex-wrap:wrap}.entry-card img{width:42px;height:42px;padding:8px;align-self:flex-start}.entry-card>button{width:100%;min-height:44px}.entry-info h2{font-size:21px}.entry-info{width:calc(100% - 60px)}.form-row{gap:13px}.person-row{display:block}.person-row button{width:100%}.narrow{margin:20px}.panel{padding:24px}.form-actions{flex-wrap:wrap}dialog{padding:20px}.center-page h1{font-size:36px}}

/* Form controls must shrink inside a grid, including iOS native date/time inputs. */
.form-row>*,input,select,textarea{min-width:0;max-width:100%}
input[type=date],input[type=time]{width:100%;min-inline-size:0}
input::-webkit-date-and-time-value{text-align:left;min-height:1.4em}
.check{overflow-wrap:anywhere}.check input{flex:0 0 20px;max-width:20px}
/* The fields scroll; action buttons stay inside the visible dialog. */
dialog{padding:0;overflow:hidden;max-height:calc(var(--dialog-viewport-height,100svh) - 32px)}
dialog>form{display:flex;flex-direction:column;max-height:inherit;margin:0}
.dialog-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:24px 28px}
dialog .form-actions{flex-shrink:0;margin:0;padding:16px 28px;border-top:1px solid var(--line);background:var(--paper)}
body:has(dialog[open]){overflow:hidden}
@media(max-width:600px){
 input,select,textarea{font-size:16px}
 .date-row{grid-template-columns:minmax(0,1fr);gap:0}
 .date-row .check{align-self:start;min-height:32px}
 dialog{top:calc(var(--dialog-viewport-top,0px) + max(12px,env(safe-area-inset-top)));bottom:auto;margin:0 auto;max-height:calc(var(--dialog-viewport-height,100svh) - max(12px,env(safe-area-inset-top)) - max(12px,env(safe-area-inset-bottom)))}
 .dialog-body{padding:18px 20px 8px}
 dialog .form-actions{padding:12px 20px;gap:8px}
 dialog .form-actions button{min-height:48px;flex:1 1 auto}
}