body[data-auth]{background:#0e335b;color:#183049;min-height:100dvh;position:relative}body[data-auth]::before{content:"";position:fixed;width:330px;height:330px;right:-170px;top:-160px;background:repeating-conic-gradient(from 4deg,#f5d46b2b 0 1deg,transparent 1.5deg 20deg);border-radius:50%;pointer-events:none}body[data-auth]::after{content:"";position:fixed;width:115px;height:115px;right:-42px;top:-40px;border-radius:50%;background:#e7ce6840;pointer-events:none}body[data-auth]>header{display:none}body[data-auth] main{width:auto;max-width:100%;margin:0;padding:30px 18px 0}body[data-auth] footer{font-size:11px;color:#c9d7e5;padding:24px 15px}body[data-auth] #login{max-width:410px;margin:0 auto}body[data-auth] #app{display:none}.auth-brand{text-align:center;color:#c5d5e1;margin:0 0 28px}.auth-brand svg{display:block;width:255px;height:65px;margin:0 auto 17px}.auth-brand>span{font-size:11px;font-weight:700;letter-spacing:.22em}.auth-card{background:#fffefa;border:1px solid #f4f0e4;border-radius:24px;padding:26px 24px;box-shadow:0 16px 40px #001b3438}.auth-card h2{font-size:25px;letter-spacing:-.035em;margin:8px 0 10px}.auth-eyebrow{font-size:9px;font-weight:700;letter-spacing:.11em;color:#5d7488;margin:24px 0 0}.auth-description,.auth-note{color:#71808a;line-height:1.5}.auth-description{font-size:13px;margin:0 0 24px}.auth-note{font-size:11px}.auth-card label{display:block;font-size:12px;font-weight:550;margin-top:17px;color:#293e4c}.auth-card input,.auth-card select{background:#fffefa;border:1px solid #d9ddd9;border-radius:16px;min-height:46px;padding:11px 14px;box-shadow:0 2px 3px #18364a0a;margin:5px 0 0;font-size:15px}.auth-card input:focus,.auth-card select:focus{outline:3px solid #f4d97977;border-color:#b6a04e}.auth-card small{display:block;color:#7b858c;font-size:10px;line-height:1.4;margin-top:6px}.auth-card .auth-submit{display:flex;align-items:center;justify-content:center;gap:14px;width:100%;margin-top:24px;border-radius:18px;min-height:48px;background:#103963;color:white}.auth-submit span{font-size:18px}.auth-switch{display:flex;padding:4px;border-radius:14px;background:#f0eee7;gap:4px}.auth-switch button{flex:1;padding:10px 4px;background:transparent;color:#6a7b88;font-size:12px;border-radius:11px;box-shadow:none}.auth-switch button[aria-pressed=true]{color:#0d355c;background:white;box-shadow:0 2px 4px #1d30441a}.auth-bottom{text-align:center;font-size:11px;color:#c4d2df;margin:22px 0 0}.auth-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.auth-success-mark{border-radius:50%;width:50px;height:50px;display:grid;place-items:center;background:#e4f2e9;color:#14764b;font-size:25px;margin-top:24px}#registrationSuccess p{font-size:13px;line-height:1.6}#registrationMessage{color:#a13242;font-size:12px}#registrationSuccess[hidden],#registrationPanel[hidden],#loginPanel[hidden],#registrationForm[hidden]{display:none}body[data-auth] button:disabled{opacity:.6;cursor:wait}.access-request{margin-bottom:14px}.access-request .notice-meta{margin-bottom:15px}.access-request dl{display:grid;grid-template-columns:100px minmax(0,1fr);gap:8px;font-size:14px}.access-request dt{color:#687d8e}.access-request dd{margin:0;overflow-wrap:anywhere}.access-request textarea{width:100%;font:inherit;padding:12px;border:1px solid #ccdae5;border-radius:12px;margin:8px 0 14px}.access-request .request-contact-note{font-size:12px;color:#96712b}.access-request button{margin:0 8px 8px 0}.access-status{padding:5px 10px;border-radius:18px;background:#fff2bc;color:#785f0d;font-size:12px}.access-status[data-status=approved]{background:#e7f4ec;color:#246043}.access-status[data-status=rejected]{background:#fae9e6;color:#a33b3b}@media(max-width:500px){body[data-auth] main{padding-top:28px}.auth-brand{margin-bottom:25px}.auth-brand svg{width:230px;height:60px}.auth-card{padding:24px 22px;border-radius:23px}.auth-card h2{font-size:24px}}@media(prefers-reduced-motion:reduce){body[data-auth] *{scroll-behavior:auto!important}}
.staff-details{display:grid;grid-template-columns:minmax(100px,180px) minmax(0,1fr);gap:12px 16px;padding:18px 0;line-height:1.5}.staff-details dt{color:#6c7d8b}.staff-details dd{margin:0;overflow-wrap:anywhere}.staff-directory-row{display:flex;justify-content:space-between;align-items:center;gap:15px}.staff-directory-row h3{overflow-wrap:anywhere}.staff-directory-row small{color:#617b8e}#staffSearch{margin-top:10px}#staffProfileEditor .shift-editor{margin-top:20px}#staffTab[hidden],#registrationTab[hidden]{display:none}@media(max-width:500px){.staff-details{grid-template-columns:1fr;gap:4px}.staff-details dd{margin-bottom:12px}.staff-directory-row{display:block}.staff-directory-row button{margin-top:12px}.access-request dl{grid-template-columns:1fr;gap:4px}.access-request dd{margin-bottom:10px}}
body[data-auth] #login{padding:0;border:0;box-shadow:none;background:transparent}body[data-auth] #login .auth-switch button{width:auto;margin:0}body[data-auth] #login .auth-submit{margin-top:24px}
@media(max-width:700px){body[data-view] nav{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;scrollbar-width:thin}body[data-view] nav button{flex:0 0 74px;min-width:74px;max-width:90px}}

body[data-view] nav button.nav-secondary{display:none!important}.home-checklists progress{width:100%;height:10px;accent-color:#0b6e64}.home-checklists>div+div{margin-top:20px}.home-checklists strong{font-size:23px;color:#133d67}.home-checklists .muted{font-size:13px;line-height:1.5}@media(max-width:700px){body[data-view] nav{overflow-x:hidden;justify-content:space-around}body[data-view] nav button:not(.nav-secondary){flex:1 1 0;min-width:0;max-width:none;font-size:10px}}

.hero-tools{display:flex;align-items:center;gap:8px}#homeBell{display:flex;align-items:center;gap:4px}#homeBell svg{width:21px;height:21px}#account{display:flex;gap:8px}.notification-top{position:relative}body[data-view] nav button[data-tab=methodical]{display:flex}

.method-sections{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin:18px 0}.method-sections button{text-align:left;white-space:normal;line-height:1.4;padding:16px}.method-sections button[aria-pressed=true]{background:#103b63;color:white}@media(max-width:500px){.method-sections{grid-template-columns:1fr}}
/* Shared visual language of the home dashboard across working sections. */
body[data-view]{background:#f8f5ec;color:#20364a}body[data-view]:not([data-view=home]) header{background:#10345b;color:#fff;border:0;border-radius:0 0 28px 28px;box-shadow:0 8px 28px #16354a12}body[data-view]:not([data-view=home]) header .brand-logo{filter:brightness(0) invert(1)}body[data-view]:not([data-view=home]) header h1,body[data-view]:not([data-view=home]) header p{color:#d9e6ef}body[data-view] #content>.card,body[data-view] #content>section.card{background:#fffefa;border:1px solid #ece8dc;border-radius:24px;box-shadow:0 4px 16px #283e570b;padding:26px}body[data-view] #content h2{color:#153957;font-size:clamp(22px,3vw,29px);letter-spacing:-.035em}body[data-view] #content h3{color:#203e57;letter-spacing:-.02em}body[data-view] #content .muted{color:#75828a;line-height:1.6}body[data-view] #content input,body[data-view] #content select,body[data-view] #content textarea{background:#fffefb;border:1px solid #dce0da;border-radius:14px;box-shadow:0 2px 4px #20364a05;font:inherit}body[data-view] #content input:focus,body[data-view] #content select:focus,body[data-view] #content textarea:focus{outline:3px solid #f3d56b55;border-color:#c0a84b}body[data-view] #content button{background:#103b63;border-radius:18px;box-shadow:none}body[data-view] #content button.secondary{background:#f0eee4;color:#31556a}body[data-view] #content button.home-link{background:transparent}body[data-view] #content button:hover:not(:disabled){box-shadow:0 3px 10px #193b5617}body[data-view] #content .shift-editor,body[data-view] #content .schedule-preview,body[data-view] #content .child-row,body[data-view] #content .program-row{background:#faf9f3;border:1px solid #e8e5d9;border-radius:18px}body[data-view] #content table{background:#fffefa;border-radius:14px;overflow:hidden}body[data-view] #content th{background:#f2eedf;color:#24455c;font-size:13px}body[data-view] #content td,body[data-view] #content th{border-bottom:1px solid #ebe8dd;padding:13px 12px}body[data-view] #content .broadcast-now{background:#fffdf4;border-left-color:#f4cf55}body[data-view] #content .broadcast-next{background:#eef5f3;border-left-color:#66bac0}body[data-view] #content .export-link{background:#f2e9c9;color:#365267;border-radius:16px;padding:12px 16px;display:inline-block;text-decoration:none;margin:10px 0}body[data-view] #content .method-sections button[aria-pressed=true]{background:#ffedaa;color:#25455d}body[data-view] #content details summary{cursor:pointer;line-height:1.5}body[data-view] #content details p{line-height:1.7}body[data-view] .notice-eyebrow{color:#8b793f;letter-spacing:.13em}body[data-view] #content .check-task{border-radius:12px;padding:12px;background:#fffefa;margin:6px 0}body[data-view] #content .check-task input{accent-color:#0d6d60;box-shadow:none}body[data-view] #content .notice-new{border-left:5px solid #f4cf55}body[data-view] #content .notice-item,body[data-view] #content .notice-compose,body[data-view] #content .access-request{background:#fffefa;border-color:#ece8dc;border-radius:22px}body[data-view] footer{color:#8c9696}@media(max-width:700px){body[data-view]:not([data-view=home]) header{padding:20px 18px 24px;border-radius:0 0 24px 24px}body[data-view] #content>.card,body[data-view] #content>section.card{padding:20px 18px;border-radius:22px}body[data-view] #content td,body[data-view] #content th{padding:10px;font-size:13px}}

/* Preserve the source logo's transparent white rendering; keep header text clear. */
body[data-view]:not([data-view=home]) header .brand-logo{filter:none;width:min(270px,100%);max-height:64px}body[data-view]:not([data-view=home]) header{padding-bottom:28px;overflow:visible;align-items:flex-start;gap:20px}body[data-view]:not([data-view=home]) header:after{display:none}body[data-view] #account .notification-top{display:none}body[data-view]:not([data-view=home]) header .brand-block{flex:1;min-width:0}body[data-view]:not([data-view=home]) header h1{font-size:13px;line-height:1.5;margin-top:12px}body[data-view]:not([data-view=home]) header p{line-height:1.5}@media(max-width:700px){body[data-view]:not([data-view=home]) header{padding:20px 18px 24px;gap:14px}body[data-view]:not([data-view=home]) header .brand-logo{width:100%;max-width:245px;max-height:58px}body[data-view]:not([data-view=home]) #account{margin-top:0}body[data-view]:not([data-view=home]) #account button{padding:9px 12px}body[data-view]:not([data-view=home]) header h1{font-size:11px}}

.profile-logout{margin-top:32px;padding-top:24px;border-top:1px solid #ece8dc}.profile-logout button{width:100%;color:#9b3843!important;background:#faeeeb!important}#profileLogoutStatus{color:#9b3843;font-size:13px}
/* Keep the home hero and quick links distinct from generic section controls. */
body[data-view=home] #content .home-hero h2{color:#fff}body[data-view=home] #content .home-access>button{background:#f4f1e7;color:#244660}body[data-view=home] #content .home-access>button svg,body[data-view=home] #content .home-access>button span{color:inherit}body[data-view=home] #content .home-primary{background:#103b63;color:#fff}body[data-view=home] #content .home-hero .hero-chip{color:#5a4815}body[data-view]:not([data-view=home]) header{display:flex;justify-content:center;text-align:center}body[data-view]:not([data-view=home]) header .brand-block{flex:0 1 420px;margin:0 auto;text-align:center}body[data-view]:not([data-view=home]) header .brand-logo{margin:0 auto}body[data-view]:not([data-view=home]) #account{display:none}

body[data-view] #content .child-row button[data-child]{background:#12656b;color:#fff;border:1px solid #12656b;font-weight:700;box-shadow:0 3px 8px #12656b18}body[data-view] #content .child-row button[data-child]:hover{background:#0d5358;border-color:#0d5358;color:#fff}body[data-view] #content .child-row button[data-child]:focus-visible{outline:3px solid #edc84f;outline-offset:3px}

body[data-view] #content .child-row{padding:18px!important;margin:12px 0;gap:18px;box-sizing:border-box}body[data-view] #content .child-row>div{min-width:0;overflow-wrap:anywhere}body[data-view] #content .child-row button[data-child]{flex-shrink:0;margin:0;align-self:center}body[data-view] #content .child-row p{line-height:1.5}@media(max-width:380px){body[data-view] #content .child-row{flex-wrap:wrap}body[data-view] #content .child-row>div{flex:1 1 100%}body[data-view] #content .child-row button[data-child]{margin-left:auto}}

/* Coastal interface, shared by every staff section. */
:root{--coast-ink:#17384b;--coast-teal:#087b80;--coast-gold:#f6cd52;--coast-line:#e1e9e7;--coast-shadow:0 8px 30px #163e4b08;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body[data-view]{background:radial-gradient(ellipse at 95% 0,#e4f1ee 0,transparent 45%),#f5f6f2;color:var(--coast-ink)}
body[data-view] main{max-width:1240px}
body[data-view]:not([data-view=home]) header{background:radial-gradient(ellipse at 85% 0,#1d6975 0,transparent 60%),linear-gradient(125deg,#102e50,#164b63);border-bottom:3px solid #e8c563;border-radius:0 0 32px 32px;box-shadow:0 12px 35px #123d5010}
body[data-view] #content>.card,body[data-view] #content>section.card,body[data-view] #content .home-dashboard .card{background:#ffffff;border:1px solid var(--coast-line);border-radius:26px;box-shadow:var(--coast-shadow);padding:26px}
body[data-view] #content h2{font-size:clamp(23px,2.6vw,30px);line-height:1.2;letter-spacing:-.04em;font-weight:750;color:var(--coast-ink)}
body[data-view] #content h3{line-height:1.35;font-weight:700;color:var(--coast-ink)}
body[data-view] #content .muted{color:#607780;line-height:1.55}
body[data-view] #content button{min-height:44px;border-radius:14px;background:#12666e;color:#fff;font-weight:650;transition:background .18s,box-shadow .18s,transform .18s;box-shadow:0 3px 8px #0b626b10}
body[data-view] #content button:hover:not(:disabled){background:#0d535e;box-shadow:0 5px 14px #0b626b24;transform:translateY(-1px)}
body[data-view] #content button:active:not(:disabled){transform:translateY(1px)}
body[data-view] #content button.secondary{background:#eaf2f1;color:#245b63;box-shadow:none}
body[data-view] #content button.secondary:hover{background:#daeae7}
body[data-view] #content button:focus-visible,body[data-view] nav button:focus-visible{outline:3px solid #e8bc39;outline-offset:3px}
body[data-view] #content input,body[data-view] #content select,body[data-view] #content textarea{min-height:48px;padding:13px 14px;background:#f7faf9;border:1px solid #d6e3e1;border-radius:13px;box-shadow:none;color:#183c4c;font-size:16px;max-width:100%}
body[data-view] #content input[type=checkbox],body[data-view] #content input[type=radio]{min-height:0;width:auto;padding:0;accent-color:#087b80}
body[data-view] #content input:focus,body[data-view] #content select:focus,body[data-view] #content textarea:focus{outline:3px solid #0b85871c;border-color:#25898e;background:#fff}
body[data-view] #content label{font-size:14px;font-weight:650;line-height:1.5;color:#365a67}
body[data-view] #content .shift-card,body[data-view] #content .child-row,body[data-view] #content .program-row,body[data-view] #content .notice-item,body[data-view] #content .access-request{background:#fff;border:1px solid #dfe9e5;border-radius:20px;box-shadow:0 3px 12px #173b4d04}
body[data-view] #content .child-row{padding:22px!important;margin:14px 0;gap:24px}
body[data-view] #content .child-row>div{flex:1;min-width:0}
body[data-view] #content .child-row h3{margin-top:0}
body[data-view] #content .child-row button[data-child]{background:#12666e;color:white;padding:13px 18px;border-radius:14px;min-height:46px}
body[data-view] #content .shift-editor,body[data-view] #content .schedule-preview{background:#f2f7f5;border:1px solid #dce9e4;border-radius:20px}
body[data-view] #content th{background:#eaf3f0;color:#28565f;font-weight:700;text-transform:none}
body[data-view] #content td,body[data-view] #content th{border-bottom:1px solid #e4ece8;padding:15px 13px;line-height:1.45}
body[data-view] #content tbody tr:nth-child(even){background:#f8faf9}
body[data-view] #content details{border-radius:16px}
body[data-view] #content details summary{font-weight:650;padding:10px 0;color:#275b65}
body[data-view] #content .check-task{background:#f4f8f6;border:1px solid #e5ede8;border-radius:14px;padding:15px;margin:8px 0}
body[data-view] #content .broadcast-now{background:linear-gradient(125deg,#eef9f5,#fff);border:1px solid #c8e6dc;border-left:4px solid #159b83;border-radius:20px}
body[data-view] #content .broadcast-next{background:#f2f6fb;border:1px solid #dce6f0;border-left:4px solid #568db3;border-radius:20px}
body[data-view] #content .home-card-title h2{font-size:20px;letter-spacing:-.03em;margin-bottom:0}
body[data-view] #content button.home-link{background:transparent;color:#117079;box-shadow:none;padding:8px 0;font-size:13px;min-height:44px;white-space:nowrap}
body[data-view] #content .home-access>button{background:#f1f6f4;color:#234d5b;border:1px solid #e0eae5;border-radius:16px;box-shadow:none}
body[data-view] #content .home-access>button:hover{background:#e6f1ed}
body[data-view] #content .home-primary{background:#12666e;color:#fff;border-radius:15px;min-height:48px}
body[data-view] #content .home-hero h2,body[data-view] #content .hero-shift h2{color:#fff}
body[data-view] #content .hero-shift{background:linear-gradient(125deg,#ffffff20,#ffffff0c);border-color:#ffffff40;border-radius:24px;box-shadow:0 10px 30px #00152b18}
body[data-view] #content .hero-role{font-weight:750}
body[data-view] #content .home-weather{background:#fffef8}
body[data-view] #content .badge{border-radius:9px;font-weight:650}
body[data-view] nav{background:#ffffffed;backdrop-filter:blur(18px);border-color:#e1e8e4;box-shadow:0 -4px 24px #173b4b06}
body[data-view] nav button{border-radius:17px;color:#58707a;transition:background .2s,color .2s;font-weight:550}
body[data-view] nav button.active{background:#fff0ac;color:#173e51;box-shadow:inset 0 0 0 1px #eace6d55}
body[data-view] nav button.active svg{stroke-width:2.2}
body[data-view] #content .profile-logout button{background:#fff0ef!important;color:#a64243!important}
body[data-view] footer{font-size:12px;color:#7a8a8e}
.auth-card{border-radius:26px;box-shadow:0 25px 80px #001b3333;border:1px solid #ffffff88}
@media(max-width:700px){body[data-view] #content>.card,body[data-view] #content>section.card,body[data-view] #content .home-dashboard .card{padding:21px 18px;border-radius:23px}body[data-view] #content .home-card-title{gap:8px}body[data-view] #content .home-card-title h2{font-size:19px}body[data-view] #content .child-row{padding:20px 16px!important;gap:16px}body[data-view] nav button{font-size:10px;gap:6px}body[data-view] #content .hero-shift h2{font-size:21px}body[data-view] #content .hero-content{padding-left:22px;padding-right:22px}}
@media(prefers-reduced-motion:no-preference){body[data-view] #content>.card,body[data-view] #content>.home-dashboard{animation:coast-arrive .3s ease-out}@keyframes coast-arrive{from{opacity:.6;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}}
@media(prefers-reduced-motion:reduce){body[data-view] #content button{transition:none;transform:none!important}}
body[data-view=home] #content .home-hero .hero-day-theme{color:#fff;font-weight:700;line-height:1.4}body[data-view=home] #content .home-hero .hero-quote{color:#f4f8ff}body[data-view=home] #content .home-hero button{background:#ffffff18;border:1px solid #ffffff40;color:#fff}
/* Workspace is opened from the upper-right menu. Native dialog manages focus. */
.hero-tools{display:flex;align-items:center;gap:8px}#homeMenu svg{width:22px;height:22px}#homeMenu{display:grid;place-items:center;min-width:44px;min-height:44px;padding:10px}
body.workspace-open{overflow:hidden}
body[data-view] #content dialog.workspace-drawer{position:fixed;inset:0 0 0 auto;width:min(400px,92vw);height:100dvh;max-height:100dvh;max-width:92vw;margin:0;padding:0;border:0;border-radius:26px 0 0 26px;background:#fff;box-shadow:-15px 0 70px #082c4933;color:#17384b;overflow:auto;overscroll-behavior:contain}
.workspace-drawer::backdrop{background:#09283e80;backdrop-filter:blur(4px)}
body[data-view] #content .workspace-drawer .home-access{border:0;border-radius:0;box-shadow:none;padding:calc(28px + env(safe-area-inset-top)) 22px calc(28px + env(safe-area-inset-bottom));background:#fff;position:relative}
body[data-view] #content .workspace-drawer h2{padding-right:36px;font-size:24px;margin-top:8px}
body[data-view] #content .workspace-drawer .workspace-close{position:absolute;top:calc(20px + env(safe-area-inset-top));right:14px;min-width:44px;min-height:44px;width:44px;padding:0;border:0;background:#edf4f2;color:#275c65;font-size:28px;display:grid;place-items:center}
@media(max-width:420px){.hero-brand{gap:8px}.hero-brand>span{font-size:9px;padding-left:8px;letter-spacing:.12em}.hero-brand svg{width:110px}.hero-tools{gap:6px}body[data-view=home] #content .home-hero .hero-tools button{padding:9px;min-width:40px}}
@media(prefers-reduced-motion:no-preference){.workspace-drawer[open]{animation:workspace-slide .23s ease-out}@keyframes workspace-slide{from{transform:translateX(100%)}to{transform:translateX(0)}}}
/* One-second camp greeting after each authenticated entry. */
dialog.camp-welcome{position:fixed;inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;overflow:hidden;background:linear-gradient(135deg,var(--welcome-a),var(--welcome-b),var(--welcome-c));background-size:220% 220%;color:var(--welcome-ink);z-index:1000;--welcome-a:#133e60;--welcome-b:#8b5973;--welcome-c:#e7a275;--welcome-ink:#fff9ee;animation:welcome-gradient 5s ease infinite;transition:opacity .22s,transform .22s}
.camp-welcome::backdrop{background:#10334d}.camp-welcome[data-period=morning]{--welcome-a:#d6edf0;--welcome-b:#f6d9ad;--welcome-c:#f3b48e;--welcome-ink:#193f53}.camp-welcome[data-period=day]{--welcome-a:#c5eaf2;--welcome-b:#e9f4dc;--welcome-c:#8acfd3;--welcome-ink:#164656}.camp-welcome[data-period=night]{--welcome-a:#091b39;--welcome-b:#18345d;--welcome-c:#314c72;--welcome-ink:#f1f5ff}
.welcome-content{position:relative;z-index:1;min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:calc(24px + env(safe-area-inset-top)) 24px calc(24px + env(safe-area-inset-bottom));box-sizing:border-box;max-width:650px;margin:auto}.welcome-brand{font-size:11px;font-weight:750;letter-spacing:.26em;opacity:.8;margin:0 0 28px}.welcome-content h2{font-size:clamp(28px,5vw,42px);line-height:1.18;letter-spacing:-.035em;margin:0;color:inherit}.welcome-content h2 span{font-weight:800}.welcome-art{width:min(360px,85vw);max-height:36dvh;margin:18px 0;color:var(--welcome-ink);flex-shrink:1}.welcome-quote{font-size:clamp(17px,3vw,22px);font-weight:600;line-height:1.5;margin:8px 0 22px;max-width:100%}.welcome-orb{position:absolute;width:75vw;height:75vw;top:-20vw;right:-25vw;border-radius:50%;background:#ffffff10;box-shadow:0 0 100px #fff1}.welcome-line{height:3px;width:80px;border-radius:4px;background:currentColor;opacity:.55;transform-origin:left;animation:welcome-progress 1s linear both}.welcome-moon,.welcome-stars{display:none}.camp-welcome[data-period=night] .welcome-sun{display:none}.camp-welcome[data-period=night] .welcome-moon,.camp-welcome[data-period=night] .welcome-stars,.camp-welcome[data-period=evening] .welcome-stars{display:block}.welcome-fire{transform-origin:247px 240px;animation:welcome-flicker .5s ease-in-out infinite alternate}.welcome-sparks{animation:welcome-sparks 1.1s ease-out infinite}.welcome-sound{animation:welcome-call .8s ease-in-out infinite alternate}.camp-welcome.welcome-leaving{opacity:0;transform:scale(1.025)}
@keyframes welcome-gradient{0%,100%{background-position:0 0}50%{background-position:100% 100%}}@keyframes welcome-flicker{to{transform:scale(.97,1.04)}}@keyframes welcome-sparks{to{transform:translateY(-18px);opacity:0}}@keyframes welcome-call{to{opacity:.3;transform:translateX(3px)}}@keyframes welcome-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(prefers-reduced-motion:reduce){dialog.camp-welcome,.camp-welcome *{animation:none!important;transition:none!important}}
@media(max-height:520px){.welcome-content{padding:12px}.welcome-brand{margin-bottom:10px}.welcome-art{margin:4px 0;max-height:30dvh}.welcome-quote{margin:4px 0 10px}}
/* Coastal photograph greeting: logo above, handwriting central, name below left. */
dialog.camp-welcome{background:#143f5a;color:#fff;animation:none}
.welcome-seascape{position:absolute;left:50%;top:50%;width:max(100vw,100dvh);height:max(100vw,100dvh);transform:translate(-50%,-50%);background-image:url('/welcome-sea.jpg');background-size:200% 200%;background-position:0 0;animation:welcome-sea-breathe 8s ease-out both}
[data-period=day] .welcome-seascape{background-position:100% 0}[data-period=evening] .welcome-seascape{background-position:0 100%}[data-period=night] .welcome-seascape{background-position:100% 100%}
.welcome-shade{position:absolute;inset:0;background:linear-gradient(180deg,#062a4e75,transparent 32%,#102e4e24 50%,#09243ee6);pointer-events:none}
.welcome-coast-content{position:relative;width:100%;height:100%;padding:calc(42px + env(safe-area-inset-top)) clamp(26px,6vw,80px) calc(58px + env(safe-area-inset-bottom));display:flex;flex-direction:column;justify-content:space-between;box-sizing:border-box}
.welcome-emblem{width:min(300px,65vw);height:70px;max-height:12dvh;align-self:center;filter:drop-shadow(0 2px 12px #09243e66)}
.camp-welcome .welcome-quote{align-self:center;font-family:'Segoe Print','Bradley Hand','Chalkboard SE',cursive;font-size:clamp(29px,5.5vw,54px);font-weight:400;font-style:italic;line-height:1.5;text-align:center;color:#fff8e6;text-shadow:0 2px 14px #07223e88;margin:20px 0;max-width:100%;letter-spacing:-.025em}
.welcome-quote span{display:block;clip-path:inset(0 100% 0 0);animation:welcome-handwrite .85s linear forwards}.welcome-quote span+span{animation-delay:.85s}
.welcome-coast-content h2{color:#fff;font-size:clamp(27px,4vw,43px);line-height:1.22;letter-spacing:-.03em;margin:0;text-align:left;max-width:100%;overflow-wrap:anywhere;text-shadow:0 2px 12px #09243e66;font-weight:500}.welcome-coast-content h2 span{font-weight:800}
@keyframes welcome-handwrite{to{clip-path:inset(0 0 0 0)}}@keyframes welcome-sea-breathe{to{transform:translate(-50%,-50%) scale(1.045)}}
@media(prefers-reduced-motion:reduce){.welcome-quote span{clip-path:none!important}}
@media(max-height:500px){.welcome-coast-content{padding-top:18px;padding-bottom:22px}.welcome-emblem{height:42px}.camp-welcome .welcome-quote{font-size:27px;line-height:1.25;margin:8px 0}.welcome-coast-content h2{font-size:24px}}
/* Navigation follows the real sky phase used by the home greeting. */
body[data-view][data-sky] nav{background:var(--nav-sky);border-color:#ffffff26;transition:background 1.5s ease;box-shadow:0 -4px 24px #0b254b1a;--nav-sky:linear-gradient(115deg,#0c1b38,#15355e);--nav-label:#e5edf6}
body[data-view][data-sky=dawn] nav{--nav-sky:linear-gradient(115deg,#e39783,#f7c47b);--nav-label:#25364e}
body[data-view][data-sky=day] nav{--nav-sky:linear-gradient(115deg,#237eb4,#87bcd6);--nav-label:#102e48}
body[data-view][data-sky=sunset] nav{--nav-sky:linear-gradient(115deg,#334870,#b56e78);--nav-label:#fff}
body[data-view][data-sky] nav button{background:transparent;color:var(--nav-label)}
body[data-view][data-sky] nav button.active{background:#ffdf75;color:#18394e;box-shadow:0 2px 12px #071f4220}
@media(prefers-reduced-motion:reduce){body[data-view][data-sky] nav{transition:none}}
.camp-welcome .welcome-emblem{width:min(410px,86vw);height:auto;max-height:16dvh;object-fit:contain;filter:drop-shadow(0 3px 12px #09243e44);flex-shrink:0}
.welcome-coast-content h2{text-align:center;align-self:center;width:100%;font-size:clamp(34px,6vw,52px);line-height:1.2;font-weight:600}
dialog.camp-welcome{inset:0;min-width:100%;min-height:100%;height:100dvh;border-radius:0}
@supports(height:100lvh){dialog.camp-welcome{height:100lvh}.welcome-seascape{width:max(100vw,100lvh);height:max(100vw,100lvh)}}
@media(max-height:500px){.welcome-coast-content h2{font-size:30px}.camp-welcome .welcome-emblem{max-height:14dvh}}
.camp-welcome.welcome-guest .welcome-coast-content{justify-content:center;align-items:center}
.camp-welcome.welcome-guest .welcome-emblem{width:min(500px,86vw);max-height:24dvh;animation:welcome-logo-in .7s ease-out both}
@keyframes welcome-logo-in{from{opacity:0;transform:translateY(10px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}
.welcome-coast-content{opacity:1;transition:opacity .25s ease}
.welcome-coast-content.welcome-content-fading,.welcome-coast-content.welcome-content-entering{opacity:0}
.camp-welcome.welcome-leaving{transition:opacity .25s ease;transform:none}
/* Personalized stage: greeting in the center, handwritten phrase at the bottom. */
.welcome-coast-content #campWelcomeHeading{order:2}
.welcome-coast-content .welcome-emblem{order:1}
.welcome-coast-content .welcome-quote{order:3;margin:12px 0 0}
.welcome-coast-content{justify-content:flex-start}
.welcome-coast-content #campWelcomeHeading{margin:24px 0 0}
.welcome-coast-content .welcome-quote{margin-top:auto;padding-top:22px}
@media(max-height:500px){.welcome-coast-content #campWelcomeHeading{margin-top:10px}.welcome-coast-content .welcome-quote{padding-top:10px}}
/* Compact mobile dock; keep all five labels centered in the usable row. */
@media(max-width:700px){body[data-view] nav{height:auto;min-height:0;padding:4px 6px min(20px,env(safe-area-inset-bottom,0px));align-items:center;justify-content:space-around;overflow-x:hidden;border-radius:0;gap:2px}body[data-view] nav button{height:52px;min-height:52px;max-width:none;flex:1 1 0;padding:5px 1px;gap:4px;border-radius:14px;line-height:1.1}body[data-view] nav button svg{width:22px;height:22px}body[data-view] nav button span{font-size:10px;line-height:1.15}}
/* Two moving wave layers shape the inner section header. */
body[data-view]:not([data-view=home]) header{position:relative;isolation:isolate;overflow:hidden;border:0;border-radius:0;padding-bottom:52px;box-shadow:none}
body[data-view]:not([data-view=home]) header .brand-block{position:relative;z-index:2}
body[data-view]:not([data-view=home]) header::before,body[data-view]:not([data-view=home]) header::after{content:"";display:block;position:absolute;pointer-events:none;left:0;right:0;top:auto;bottom:-1px;width:100%;border-radius:0;background-repeat:repeat-x;background-size:700px 100%;transform:none}
body[data-view]:not([data-view=home]) header::before{height:44px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='700' height='44' viewBox='0 0 700 44'%3E%3Cpath d='M0 18 Q87.5 0 175 18 T350 18 T525 18 T700 18 V44 H0Z' fill='%2384c4c9' fill-opacity='.38'/%3E%3C/svg%3E");animation:section-wave 16s linear infinite reverse}
body[data-view]:not([data-view=home]) header::after{height:29px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='700' height='29' viewBox='0 0 700 29'%3E%3Cpath d='M0 14 Q87.5 0 175 14 T350 14 T525 14 T700 14 V29 H0Z' fill='%23f5f6f2'/%3E%3C/svg%3E");animation:section-wave 22s linear infinite}
@keyframes section-wave{to{background-position:700px 0}}
@media(prefers-reduced-motion:reduce){body[data-view]:not([data-view=home]) header::before,body[data-view]:not([data-view=home]) header::after{animation:none}}
/* Section headers share the home sky; wave edges have no brand stripes. */
body[data-view]:not([data-view=home]) header::before,body[data-view]:not([data-view=home]) header::after{border:0!important;box-shadow:none!important}
body[data-view][data-sky]:not([data-view=home]) header{background:linear-gradient(180deg,#0c1b38,#15355e 70%,#31506a);transition:background 1.5s ease}
body[data-view][data-sky=dawn]:not([data-view=home]) header{background:linear-gradient(115deg,#536b9c,#e39783 68%,#f7c47b)}
body[data-view][data-sky=day]:not([data-view=home]) header{background:linear-gradient(115deg,#237eb4,#87bcd6 70%,#c7dfda)}
body[data-view][data-sky=sunset]:not([data-view=home]) header{background:linear-gradient(115deg,#334870,#b56e78 64%,#f6af6c)}
body[data-view][data-sky]:not([data-view=home]) header h1,body[data-view][data-sky]:not([data-view=home]) header p{color:#fff;text-shadow:0 1px 8px #102f5055}
body[data-view]:not([data-view=home]) header .brand-logo{filter:drop-shadow(0 1px 5px #102f5033)}
@media(prefers-reduced-motion:reduce){body[data-view][data-sky]:not([data-view=home]) header{transition:none}}

.class-child-stats{margin-top:24px}
.class-child-row{padding:16px 0;border-top:1px solid #dbe5e5}
.class-child-row h4{margin:0 0 12px;color:#193b50;font-size:16px;overflow-wrap:anywhere}
.class-child-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.class-child-grid>div{background:#edf3f6;border-radius:16px;padding:14px 8px;display:flex;flex-direction:column;gap:6px;text-align:center}
.class-child-grid>div:nth-child(2){background:#fbefef}
.class-child-grid>div:nth-child(3){background:#eaf3f8}
.class-child-grid strong{font-size:28px;color:#125668;line-height:1.1}
.class-child-grid span{font-size:12px;color:#446173}
.class-child-row p{font-size:13px;margin:10px 0 0}
#homeChildStats #refreshChildStats{color:#125668;background:transparent}

.class-child-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.class-child-grid>div{padding:12px 3px;min-width:0;border-radius:12px;justify-content:center}
.class-child-grid>div:first-child{background:#e7f1ef}
.class-child-grid>div:nth-child(2){background:#edf3f6}
.class-child-grid>div:nth-child(3){background:#eaf3f8}
.class-child-grid>div:nth-child(4){background:#fbefef}
.class-child-grid span{font-size:clamp(9px,2.6vw,12px);white-space:nowrap}
.class-child-grid strong{font-size:clamp(18px,5.6vw,27px);overflow-wrap:anywhere}
.employee-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 16px;border:1px solid #dbe5e5;background:#f8faf7;border-radius:20px;margin:12px 0}
.employee-row>div{min-width:0}.employee-row h3{margin:0 0 8px;overflow-wrap:anywhere}.employee-row p{margin:6px 0;overflow-wrap:anywhere}
.employee-row button{flex-shrink:0;background:#12666e;color:#fff;min-height:46px;padding:12px 20px}
@media(max-width:420px){.employee-row{flex-wrap:wrap;gap:12px}.employee-row button{margin-left:auto}}
