/* SPV 41: three role rows. Existing SPV design retained. */
#spv-demo-login .spv-login-card{box-sizing:border-box;max-height:calc(100dvh - 32px);overflow:auto;padding:22px;width:min(100%,440px)}
#spv-demo-login .spv-login-card h1{font-size:28px}
#spv-demo-login .spv-roles{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin-top:16px}
#spv-demo-login .spv-role-card,#spv-demo-login .spv-worker-card{width:100%;box-sizing:border-box;border:1px solid #737989;background:#3a3e4c;border-radius:13px;color:#fff;padding:12px;min-width:0}
#spv-demo-login .spv-role-card{display:flex;gap:12px;align-items:center;text-align:left;margin:0;min-height:72px}
#spv-demo-login .spv-role-card b{margin-left:auto;font-size:24px;color:#f0cc82}
#spv-demo-login .spv-role-emblem{display:grid;place-items:center;flex:0 0 49px;width:49px;height:49px;background:#252935;border-radius:10px;border:1px solid #b49b60;color:#f0d18e;font-size:28px}
#spv-demo-login .spv-role-card strong,#spv-demo-login .spv-worker-heading strong{display:block;color:#fff;font-size:18px}
#spv-demo-login .spv-role-card small,#spv-demo-login .spv-worker-heading small{display:block;color:#d8dbe4;font-size:12px;margin:3px 0 0}
#spv-demo-login .spv-worker-heading{display:flex;align-items:center;gap:12px}
#spv-demo-login .spv-wheel{display:flex;align-items:center;gap:8px;background:#272b37;border-radius:11px;padding:5px;margin-top:12px}
#spv-demo-login .spv-wheel button{width:46px;flex:0 0 46px;margin:0;padding:8px 0;background:#4b5060;border:1px solid #797f91;color:white;font-size:26px;border-radius:9px}
#spv-demo-login .spv-wheel strong{text-align:center;flex:1;color:#fff;overflow-wrap:anywhere;font-size:16px}
#spv-demo-login .spv-worker-count{font-size:11px;text-align:center;color:#d1d5df;margin-top:6px}
#spv-demo-login #spv-worker-enter{display:block;width:100%;box-sizing:border-box;margin:10px 0 0;background:#d9ae59;color:#242632;border-radius:10px;font-size:14px}
#spv-demo-login .spv-role-card:focus-visible,#spv-demo-login .spv-wheel button:focus-visible{outline:3px solid #f7d48c;outline-offset:2px}
@media(max-width:400px){#spv-demo-login .spv-login-card{padding:17px}}
#spv-worker-portal[hidden]{display:none!important}
#spv-worker-portal{position:fixed;inset:0;background:#f1f2f5;color:#303541;z-index:999998;overflow:auto;font-family:system-ui,sans-serif;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}
.spv-w-shell{max-width:750px;margin:auto;padding:18px 13px 35px}
.spv-w-header{background:#3d3f4b;color:white;padding:20px;border-radius:17px;display:flex;align-items:center;justify-content:space-between;gap:10px}.spv-w-header small{color:#f3cf82;font-size:11px;font-weight:800;letter-spacing:1px}.spv-w-header h1{color:#fff;font-size:30px;font-family:system-ui,sans-serif;margin:6px 0}.spv-w-header span{color:#dadee7;font-size:13px}.spv-w-header button{color:white;border:1px solid #7e8291;background:#555968;border-radius:10px;padding:11px;white-space:nowrap}
.spv-w-panel{background:#fff;border:1px solid #d8dde5;border-radius:15px;margin-top:14px;padding:17px}.spv-w-panel h2{font:700 20px system-ui,sans-serif;margin:0 0 15px;color:#2e3541}
.spv-w-week{display:flex;align-items:center;gap:9px;justify-content:space-between;margin:5px 0 14px}.spv-w-week button{width:44px;height:40px;border:1px solid #bfc9d5;border-radius:10px;background:#eff2f7;font-size:24px;color:#273b4c}.spv-w-week strong{font-size:13px;text-align:center}
.spv-w-day{display:grid;grid-template-columns:46px minmax(0,1fr);gap:10px;margin-top:8px}.spv-w-day>span{background:#edf0f5;border-radius:9px;text-align:center;padding:10px 4px}.spv-w-day>span strong,.spv-w-day>span small{display:block}.spv-w-day>span small{color:#728095}.spv-w-activity{padding:10px 13px;border:1px solid #d6dce5;border-radius:10px;display:flex;flex-direction:column;gap:3px;background:#f3f5f8}.spv-w-activity b{font-size:14px}.spv-w-activity small{color:#516173;overflow-wrap:anywhere}.spv-w-site{background:#e5f0fb;border-color:#a6c8e3}.spv-w-leave{background:#e0f2e6;border-color:#94c9a4}.spv-w-off{background:#fae7e7;border-color:#d8aaaa}
.spv-w-tip,.spv-w-notice{font-size:12px;color:#657282;line-height:1.5}.spv-w-panel label{display:block;font-size:13px;color:#344454;font-weight:700;margin:12px 0}.spv-w-panel input,.spv-w-panel select{display:block;width:100%;box-sizing:border-box;background:#fff;color:#2c3c50;border:1px solid #aebccc;border-radius:8px;padding:11px;margin-top:7px;font:inherit}.spv-w-dates{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.spv-w-dates label[hidden]{display:none}.spv-w-submit{width:100%;padding:13px;background:#3d3f4b;color:white;border:0;border-radius:10px;font-weight:800}.spv-w-submit:disabled{opacity:.6}.spv-w-request{display:flex;justify-content:space-between;gap:9px;border-top:1px solid #e0e5ec;padding:11px 0;font-size:13px}.spv-w-request small{display:block;color:#64758a;margin-top:4px}.spv-w-request strong{color:#34485d}
@media(max-width:390px){.spv-w-shell{padding:9px}.spv-w-panel{padding:13px}.spv-w-header{padding:14px}.spv-w-header h1{font-size:25px}}


/* v43: compact stacked worker selector, matching the clean SPV account flow. */
#spv-demo-login .spv-worker-card{padding:12px 13px 14px}
#spv-demo-login .spv-worker-card .spv-wheel{display:flex;width:100%;box-sizing:border-box;margin-top:13px;min-height:48px;gap:7px;padding:5px;background:#272b37}
#spv-demo-login .spv-worker-card .spv-wheel button{width:40px;flex:0 0 40px;min-width:40px;margin:0;padding:5px 0;font-size:25px;line-height:1.1;min-height:38px}
#spv-demo-login .spv-worker-card .spv-wheel strong{flex:1;min-width:0;font-size:16px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;overflow-wrap:normal;text-align:center}
#spv-demo-login .spv-worker-card .spv-worker-count{margin:7px 0 0;text-align:center;color:#cdd3df;font-size:11px}
#spv-demo-login .spv-worker-card #spv-worker-enter{display:block!important;width:100%!important;height:auto!important;min-height:48px!important;max-height:56px!important;margin:12px 0 0!important;padding:12px 14px!important;box-sizing:border-box!important;border-radius:10px!important;background:#d9ae59!important;color:#20242e!important;font-size:14px!important;font-weight:800!important;line-height:1.3!important;white-space:normal!important;text-align:center!important;align-self:auto!important;position:static!important}
#spv-demo-login .spv-worker-card #spv-worker-enter:disabled{background:#ad945f!important;color:#2d3441!important;opacity:.8}
#spv-demo-login .spv-worker-emblem{color:#ffd869;border-color:#b49b60;background:#252935}
#spv-demo-login .spv-worker-emblem svg{width:31px;height:31px;display:block;color:#ffd869;stroke:#ffd869;fill:none}
/* Move the planner title closer to the original SPV logo, without changing the app design. */
#spv-demo-login .spv-login-card{padding:21px 24px 23px;max-height:calc(100dvh - 28px);overflow-y:auto}
#spv-demo-login .spv-login-card img{display:block;max-height:54px;max-width:135px;object-fit:contain;margin:0 0 8px}
#spv-demo-login .spv-login-card > h1{display:none}
#spv-demo-login .spv-login-card > p{font-size:21px;line-height:1.25;font-weight:750;color:#f5f6fa;margin:8px 0 10px}
#spv-demo-login .spv-demo-tag{margin:12px 0}
#spv-demo-login .spv-roles{margin-top:14px}
/* Cinematic SPV intro: lightweight, static HTML/CSS, no app-state changes. */
#spv-premium-intro{position:fixed;inset:0;z-index:2147483640;display:grid;place-items:center;pointer-events:auto;overflow:hidden;background:radial-gradient(ellipse at 51% 41%,#51596c 0%,#343b49 41%,#181e27 100%);color:#f6f2e9;font-family:system-ui,-apple-system,sans-serif;opacity:1;transition:opacity .23s ease}
#spv-premium-intro.spv-intro-out{opacity:0;pointer-events:none}
#spv-premium-intro .spv-intro-inner{width:min(85vw,440px);text-align:center;position:relative;animation:spv-intro-float 1.75s ease-out both}
#spv-premium-intro .spv-intro-mark{font-weight:850;font-size:clamp(65px,17vw,108px);letter-spacing:.09em;line-height:1;color:#f1e1ba;text-shadow:0 2px 30px #e0b86a44;position:relative}
#spv-premium-intro .spv-intro-line{display:block;height:2px;width:0%;margin:12px auto 0;background:linear-gradient(90deg,transparent,#f0d49b,transparent);animation:spv-intro-line 1.45s .22s ease-out both}
#spv-premium-intro .spv-intro-label{font-size:10px;letter-spacing:.22em;color:#dbd0b8;font-weight:750;margin-top:15px}
#spv-premium-intro .spv-intro-sub{font-size:12px;font-weight:700;letter-spacing:.3em;color:#e6ebf2;margin-top:29px;animation:spv-intro-appear .8s .5s both}
#spv-premium-intro .spv-intro-progress{width:0;height:2px;background:#efd291;margin:21px auto 0;animation:spv-intro-load 1.65s .1s linear both}
@keyframes spv-intro-float{from{transform:translateY(16px);opacity:0}20%{opacity:1}to{transform:translateY(0);opacity:1}}
@keyframes spv-intro-line{to{width:72%}}
@keyframes spv-intro-appear{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes spv-intro-load{to{width:64%}}
@media (prefers-reduced-motion:reduce){#spv-premium-intro .spv-intro-inner,#spv-premium-intro .spv-intro-line,#spv-premium-intro .spv-intro-sub,#spv-premium-intro .spv-intro-progress{animation:none}#spv-premium-intro .spv-intro-line{width:72%}}
@media(max-width:390px){#spv-demo-login .spv-login-card{padding:16px 17px 19px}#spv-demo-login .spv-login-card > p{font-size:19px}#spv-demo-login .spv-worker-card .spv-wheel button{width:37px;min-width:37px;flex-basis:37px}}


/* SPV v47: one definitive Workers layout. Keep original Steve/Mark card styles. */
#spv-demo-login .spv-worker-card{
 display:flex!important;flex-direction:column!important;align-items:stretch!important;
 width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;
 gap:0!important;padding:13px 14px 15px!important;box-sizing:border-box!important;
 justify-content:flex-start!important;grid-template:none!important;
}
#spv-demo-login .spv-worker-card .spv-worker-heading{
 margin:0 0 14px!important;display:flex!important;align-items:center!important;
 min-height:48px!important;gap:12px!important;
}
#spv-demo-login .spv-worker-card .spv-wheel{
 display:flex!important;flex:0 0 50px!important;align-items:center!important;
 justify-content:space-between!important;width:100%!important;box-sizing:border-box!important;
 height:50px!important;min-height:50px!important;max-height:50px!important;
 margin:0!important;padding:4px 6px!important;gap:10px!important;
}
#spv-demo-login .spv-worker-card .spv-wheel button{
 flex:0 0 38px!important;width:38px!important;min-width:38px!important;
 min-height:38px!important;height:38px!important;max-height:38px!important;
 margin:0!important;padding:0!important;
}
#spv-demo-login .spv-worker-card .spv-wheel strong{
 flex:1!important;min-width:0!important;text-align:center!important;
 font-size:17px!important;overflow:hidden!important;text-overflow:ellipsis!important;
 white-space:nowrap!important;
}
#spv-demo-login .spv-worker-card .spv-worker-count{
 order:2!important;display:block!important;text-align:center!important;
 margin:11px 0 0!important;min-height:17px!important;padding:0!important;
 line-height:1.5!important;color:#e4e6ed!important;
}
#spv-demo-login .spv-worker-card #spv-worker-enter{
 order:3!important;display:block!important;position:static!important;
 width:100%!important;max-width:none!important;box-sizing:border-box!important;
 height:47px!important;min-height:47px!important;max-height:47px!important;
 flex:0 0 47px!important;margin:12px 0 0!important;padding:10px 12px!important;
 text-align:center!important;font-size:14px!important;line-height:1.25!important;
 color:#252635!important;background:#d9ae59!important;border-radius:10px!important;
}
#spv-demo-login .spv-version-indicator{
 display:block;color:#d7b66e!important;text-align:right;font-size:10px!important;
 margin-top:9px!important;letter-spacing:.02em;
}
/* Intro reveal lasts the complete 2.5 second splash. */
#spv-premium-intro .spv-intro-inner{animation-duration:1.85s!important}
#spv-premium-intro .spv-intro-line{animation-duration:1.65s!important;animation-delay:.2s!important}
#spv-premium-intro .spv-intro-sub{animation-duration:.85s!important;animation-delay:.45s!important}
#spv-premium-intro .spv-intro-progress{animation-duration:2.05s!important;animation-delay:.1s!important}
#spv-premium-intro{transition:opacity .25s ease!important}

/* v48: mobile Safari date inputs can have intrinsic width larger than grid tracks. */
.spv-w-shell,.spv-w-panel,.spv-w-dates,.spv-w-dates label{min-width:0;max-width:100%;box-sizing:border-box}
.spv-w-dates{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:start;width:100%}
.spv-w-dates label{margin:8px 0 14px;overflow:hidden}
.spv-w-dates input[type=date]{display:block;min-width:0;max-width:100%;width:100%;box-sizing:border-box;font-size:16px;-webkit-appearance:none;appearance:none;padding:12px 8px;line-height:1.4;height:49px}
@media (max-width:540px){.spv-w-dates{grid-template-columns:minmax(0,1fr);gap:2px}.spv-w-dates label{width:100%;margin:6px 0}.spv-w-dates input[type=date]{width:100%;padding:12px}}

/* v56: Demo-only worker accounts. No changes to Steve/Mark planner design. */
.spv-worker-demo-shade[hidden]{display:none!important}
.spv-worker-demo-shade{position:fixed;inset:0;z-index:2147483600;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(14,18,25,.78);font-family:system-ui,sans-serif}
.spv-worker-demo-box{width:min(100%,380px);box-sizing:border-box;text-align:center;padding:27px 23px 23px;background:#343744;color:#f6f4ef;border:1px solid #b99c61;border-radius:18px;box-shadow:0 16px 50px #0008}
.spv-worker-demo-symbol{font-size:27px;color:#f0c875}.spv-worker-demo-box h2{font-size:23px;margin:8px 0 14px;color:#f3d08b}.spv-worker-demo-box p{margin:10px 0;font-size:15px;line-height:1.55;color:#fff}.spv-worker-demo-box .spv-worker-demo-secondary{color:#d7dbe3;font-size:13px}
#spv-worker-demo-ok{background:#d9ae59;color:#242632;border:0;border-radius:10px;padding:13px 20px;margin-top:13px;min-height:45px;width:100%;font-weight:800;font-size:15px}

/* v57: demo sign-in panels fit on narrow phones */
.spv-demo-auth[hidden]{display:none!important}
.spv-demo-auth{position:fixed;inset:0;z-index:2147483620;background:rgba(14,18,25,.88);display:flex;align-items:center;justify-content:center;padding:16px;box-sizing:border-box;font-family:system-ui,-apple-system,sans-serif}
.spv-demo-auth-panel{background:#343744;color:#fff;border:1px solid #c3a669;border-radius:17px;padding:20px;width:min(100%,400px);max-height:calc(100dvh - 32px);overflow-y:auto;box-sizing:border-box;box-shadow:0 18px 55px #0009}
.spv-demo-auth-panel h2{font-size:23px;color:#f4d592;margin:0 0 5px}.spv-demo-auth-panel p{color:#e3e6ed;margin:7px 0 12px;font-size:13px;line-height:1.5}.spv-demo-auth-panel ul{margin:9px 0 16px;padding-left:21px;color:#e7e9ee;font-size:13px;line-height:1.55}.spv-demo-auth-panel li{margin:3px 0}.spv-demo-auth-panel label{font-size:13px;color:#f3d9a1;display:block;margin:11px 0 6px}.spv-demo-auth-panel input{font-size:16px;box-sizing:border-box;width:100%;min-height:46px;border-radius:9px;padding:9px 12px;border:1px solid #9ca5b3;background:#f8f9fc;color:#20242d}.spv-demo-auth-panel .spv-auth-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:13px}.spv-demo-auth-panel button{min-height:43px;border-radius:9px;border:1px solid #8d95a2;background:#555f70;color:#fff;font-weight:750}.spv-demo-auth-panel button[type=submit]{background:#d9ae59;color:#252735;border-color:#d9ae59}.spv-demo-auth-panel .spv-auth-error{color:#ffb6b6;font-size:12px;min-height:18px}.spv-w-off{background:#e9edf2;color:#344656}

/* v58: Larger, legible manager demo information, no automatic keyboard popup */
.spv-demo-auth-panel{width:min(100%,440px);padding:22px 21px;max-height:calc(100dvh - 28px);overscroll-behavior:contain}
.spv-demo-auth-panel h2{font-size:26px;line-height:1.2;margin-bottom:8px}
.spv-demo-auth-panel p{font-size:15px;line-height:1.55;margin:10px 0 14px}
.spv-demo-auth-panel ul{font-size:15px;line-height:1.55;margin:11px 0 17px;padding-left:23px}
.spv-demo-auth-panel li{margin:6px 0}
.spv-demo-auth-panel label{font-size:16px;line-height:1.35;font-weight:750;margin:13px 0 8px}
.spv-demo-auth-panel input{font-size:17px;min-height:49px}
.spv-demo-auth-panel .spv-auth-actions{gap:12px;margin-top:16px}
.spv-demo-auth-panel button{min-height:49px;font-size:16px}
.spv-demo-auth-panel .spv-auth-error{font-size:14px}
@media(max-width:380px){.spv-demo-auth{padding:10px}.spv-demo-auth-panel{padding:16px;max-height:calc(100dvh - 20px)}.spv-demo-auth-panel h2{font-size:23px}.spv-demo-auth-panel ul{font-size:14px}.spv-demo-auth-panel p{font-size:14px}}