:root{--bg1:#eef4ff;--bg2:#f7edff;--bg3:#ffeef7;--surface:rgba(255,255,255,.68);--surface-border:rgba(255,255,255,.72);--text:#17171b;--soft:#6b6b75;--faint:#92929d;--blue:#4f8cff;--purple:#7a5cff;--pink:#ff5daa;--green:#39b77b;--orange:#f39a45;--shadow1:0 10px 30px rgba(67,69,93,.08);--shadow2:0 28px 80px rgba(67,69,93,.14);--shadow3:0 42px 120px rgba(65,71,105,.18);--container:1180px;--ease:220ms cubic-bezier(.2,.8,.2,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;overflow-x:hidden;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:linear-gradient(145deg,var(--bg1),var(--bg2) 48%,var(--bg3));transition:background 1s ease,color .5s ease}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}.container{width:min(calc(100% - 40px),var(--container));margin-inline:auto}.section{padding-block:110px}.background-orb{position:fixed;z-index:-2;width:520px;height:520px;border-radius:50%;filter:blur(110px);opacity:.38;pointer-events:none;animation:floatOrb 15s ease-in-out infinite alternate}.orb-one{top:-230px;right:-120px;background:#8ba9ff}.orb-two{bottom:-280px;left:-160px;background:#ff8cc7;animation-delay:-5s}@keyframes floatOrb{to{transform:translate3d(70px,35px,0) scale(1.08)}}
.site-header{position:sticky;top:0;z-index:50;padding:18px 0;border-bottom:1px solid transparent;backdrop-filter:blur(18px);transition:var(--ease)}.site-header.scrolled{background:rgba(245,247,255,.66);border-color:rgba(255,255,255,.65)}.nav{display:flex;align-items:center;justify-content:space-between;min-height:52px}.brand{display:inline-flex;align-items:center;gap:11px;font-size:18px;font-weight:800;letter-spacing:-.04em}.brand-logo,.mini-logo{position:relative;display:grid;width:36px;height:36px;place-items:center;overflow:hidden;border-radius:12px;background:linear-gradient(135deg,var(--blue),var(--purple) 52%,var(--pink));box-shadow:0 10px 24px rgba(98,92,245,.26)}.brand-logo span{width:14px;height:14px;border:3px solid rgba(255,255,255,.95);border-top-color:transparent;border-radius:50%;transform:rotate(-32deg)}.nav-links,.nav-actions{display:flex;align-items:center}.nav-links{gap:34px;color:var(--soft);font-size:14px;font-weight:600}.nav-actions{gap:10px}.button{display:inline-flex;min-height:44px;align-items:center;justify-content:center;gap:10px;padding:0 18px;border:0;border-radius:14px;cursor:pointer;font-weight:700;transition:transform var(--ease),box-shadow var(--ease),background var(--ease)}.button:hover{transform:translateY(-2px)}.button:active{transform:scale(.985)}.button-primary{color:#fff;background:#17171a;box-shadow:0 12px 28px rgba(21,21,27,.18)}.button-ghost{background:transparent;color:var(--soft)}.button-glass{background:rgba(255,255,255,.58);border:1px solid var(--surface-border);box-shadow:var(--shadow1);backdrop-filter:blur(16px)}.button-light{color:#17171a;background:#fff}.button-large{min-height:54px;padding-inline:24px;border-radius:17px}.menu-button{display:none;width:44px;height:44px;border:0;border-radius:14px;background:rgba(255,255,255,.58)}.menu-button span{display:block;width:18px;height:2px;margin:5px auto;border-radius:99px;background:var(--text)}.mobile-menu{display:none}
.hero{display:grid;min-height:calc(100vh - 88px);grid-template-columns:.92fr 1.08fr;align-items:center;gap:70px;padding-block:80px 120px}.eyebrow{display:inline-flex;align-items:center;gap:10px;color:#555563;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.eyebrow>span{width:8px;height:8px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--pink));box-shadow:0 0 0 6px rgba(100,116,255,.1)}.hero h1{margin:24px 0 22px;font-size:clamp(55px,6vw,88px);line-height:.98;letter-spacing:-.065em}.hero h1 em{display:block;font-style:normal;color:transparent;background:linear-gradient(100deg,#4f8cff,#805fff 48%,#ff5daa);background-clip:text;-webkit-background-clip:text}.hero-copy>p{max-width:620px;margin:0;color:var(--soft);font-size:19px;line-height:1.7}.hero-buttons{display:flex;gap:12px;margin-top:34px}.trust-line{display:flex;align-items:center;gap:14px;margin-top:34px;color:var(--soft);font-size:13px}.trust-line p{margin:0}.avatar-stack{display:flex;padding-left:8px}.avatar-stack span{display:grid;width:34px;height:34px;margin-left:-8px;place-items:center;border:3px solid rgba(255,255,255,.8);border-radius:50%;color:#fff;background:#222;font-size:11px;font-weight:700}.avatar-stack span:nth-child(2){background:var(--purple)}.avatar-stack span:nth-child(3){background:var(--pink)}
.hero-preview{position:relative;min-height:620px}.preview-glow{position:absolute;top:12%;left:8%;width:84%;height:76%;border-radius:50%;filter:blur(60px);opacity:.42;background:radial-gradient(circle,rgba(90,125,255,.72),rgba(255,102,178,.32),transparent 70%)}.app-card{position:absolute;top:50%;left:50%;width:min(680px,100%);overflow:hidden;border:1px solid var(--surface-border);border-radius:30px;background:rgba(255,255,255,.76);box-shadow:var(--shadow3);transform:translate(-50%,-50%) rotate(1.4deg);backdrop-filter:blur(25px)}.app-topbar{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid rgba(55,55,70,.08)}.mini-brand,.sync-state{display:flex;align-items:center}.mini-brand{gap:9px;font-size:13px}.mini-logo{width:24px;height:24px;border-radius:8px}.mini-logo.big{width:54px;height:54px;border-radius:18px}.sync-state{gap:7px;color:var(--soft);font-size:11px}.sync-state span{width:7px;height:7px;border-radius:50%;background:#35b979;box-shadow:0 0 0 5px rgba(53,185,121,.1)}.app-content{display:flex;min-height:430px}.app-sidebar{display:flex;width:62px;flex-direction:column;align-items:center;gap:18px;padding-top:28px;border-right:1px solid rgba(55,55,70,.07)}.app-sidebar i{width:24px;height:24px;border-radius:8px;background:rgba(102,102,118,.12)}.app-sidebar i.active{background:linear-gradient(135deg,var(--blue),var(--purple));box-shadow:0 8px 18px rgba(86,108,244,.22)}.app-main{flex:1;padding:28px}.app-heading{display:flex;align-items:center;justify-content:space-between}.app-heading small{color:var(--faint)}.app-heading h2{margin:5px 0 0;font-size:25px;letter-spacing:-.04em}.profile-circle{display:grid;width:38px;height:38px;place-items:center;border-radius:50%;background:rgba(23,23,27,.08);font-size:13px;font-weight:700}.shift-card{display:flex;align-items:center;justify-content:space-between;margin-top:24px;padding:24px;border:1px solid rgba(255,255,255,.76);border-radius:24px;background:linear-gradient(135deg,rgba(226,239,255,.9),rgba(245,235,255,.82));box-shadow:0 14px 36px rgba(75,81,120,.08)}.shift-badge{display:inline-flex;padding:7px 10px;border-radius:999px;color:#326eae;background:rgba(255,255,255,.66);font-size:10px;font-weight:800}.shift-card h3{margin:14px 0 6px;font-size:28px;letter-spacing:-.05em}.shift-card p{margin:0;color:var(--soft);font-size:11px}.time-circle{display:grid;width:94px;height:94px;place-content:center;text-align:center;border-radius:50%;background:rgba(255,255,255,.62);box-shadow:0 16px 32px rgba(84,97,147,.11)}.time-circle strong,.time-circle small{display:block}.time-circle small{margin-top:4px;color:var(--faint)}.preview-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:12px;margin-top:14px}.small-card{min-height:105px;padding:18px;border:1px solid rgba(255,255,255,.72);border-radius:20px;background:rgba(255,255,255,.54)}.small-card span,.small-card strong{display:block}.small-card span{color:var(--faint);font-size:9px;font-weight:700;text-transform:uppercase}.small-card strong{margin-top:10px;font-size:17px;line-height:1.3}.small-card.accent{background:linear-gradient(135deg,rgba(255,255,255,.66),rgba(255,235,247,.72))}.progress{height:6px;margin-top:15px;overflow:hidden;border-radius:99px;background:rgba(20,20,30,.08)}.progress i{display:block;width:72%;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--blue),var(--purple))}.week-row{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:14px}.week-row div{padding:13px 8px;text-align:center;border-radius:14px;background:rgba(255,255,255,.46)}.week-row span,.week-row strong{display:block}.week-row span{color:var(--faint);font-size:9px}.week-row strong{margin-top:6px;font-size:10px}.week-row .today{color:#fff;background:#19191d}.week-row .today span{color:rgba(255,255,255,.6)}.floating-card{position:absolute;z-index:4;display:flex;width:250px;align-items:center;gap:12px;padding:16px;border:1px solid var(--surface-border);border-radius:20px;background:rgba(255,255,255,.78);box-shadow:var(--shadow2);backdrop-filter:blur(20px)}.floating-card>span{display:grid;width:38px;height:38px;place-items:center;border-radius:13px;color:#5d48b5;background:linear-gradient(135deg,#e5edff,#f6e8ff)}.floating-card small,.floating-card strong{display:block}.floating-card small{color:var(--faint);font-size:9px;text-transform:uppercase}.floating-card strong{margin-top:5px;font-size:12px;line-height:1.35}.floating-ai{right:-20px;bottom:62px;animation:floatCard 5.4s ease-in-out infinite}.floating-reminder{top:62px;left:-25px;animation:floatCard 6.2s ease-in-out infinite reverse}@keyframes floatCard{50%{transform:translateY(-12px)}}
.industry-strip{padding:26px 30px;border:1px solid rgba(255,255,255,.64);border-radius:22px;background:rgba(255,255,255,.38);box-shadow:var(--shadow1);backdrop-filter:blur(16px)}.industry-strip p{margin:0;text-align:center;color:var(--faint);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.industry-strip div{display:flex;flex-wrap:wrap;justify-content:center;gap:34px;margin-top:18px;color:#555563;font-size:13px;font-weight:700}.section-heading{max-width:720px;margin-bottom:46px}.section-heading h2,.adaptive-copy h2,.premium-card h2,.final-cta h2{margin:18px 0;font-size:clamp(40px,5vw,64px);line-height:1.04;letter-spacing:-.055em}.section-heading p,.adaptive-copy p,.premium-card p,.final-cta p{margin:0;color:var(--soft);font-size:17px;line-height:1.7}.feature-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.feature-card{min-height:330px;padding:34px;border:1px solid var(--surface-border);border-radius:34px;background:var(--surface);box-shadow:var(--shadow1);backdrop-filter:blur(18px);transition:transform var(--ease),box-shadow var(--ease)}.feature-card:hover{transform:translateY(-7px);box-shadow:var(--shadow2)}.feature-wide{grid-column:1/-1;display:grid;min-height:420px;grid-template-columns:.9fr 1.1fr;align-items:center;gap:50px}.feature-icon{display:grid;width:52px;height:52px;margin-bottom:26px;place-items:center;border-radius:17px;font-size:20px;font-weight:800}.feature-icon.blue{color:#356dc5;background:#e4eeff}.feature-icon.pink{color:#b73979;background:#ffe5f2}.feature-icon.purple{color:#6248b8;background:#eee8ff}.feature-icon.green{color:#21895a;background:#e3f6ed}.feature-icon.orange{color:#b66b20;background:#fff0df}.feature-label{color:var(--faint);font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.feature-card h3{margin:12px 0;font-size:28px;line-height:1.18;letter-spacing:-.045em}.feature-card p{margin:0;color:var(--soft);line-height:1.65}.calendar-demo{padding:26px;border:1px solid rgba(255,255,255,.8);border-radius:26px;background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(235,240,255,.66));box-shadow:var(--shadow2)}.calendar-head,.calendar-days{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.calendar-head span{padding-bottom:12px;text-align:center;color:var(--faint);font-size:10px;font-weight:700}.calendar-days span{display:grid;min-height:100px;place-items:end center;padding:12px;border-radius:18px;font-size:11px;font-weight:800}.calendar-days .early{color:#356dc5;background:#e7f1ff}.calendar-days .late{color:#ad651f;background:#fff1df}.calendar-days .night{color:#6049a8;background:#eee9ff}.calendar-days .off{color:#60636b;background:#edf0f3}
.adaptive-panel{display:grid;min-height:580px;grid-template-columns:.9fr 1.1fr;align-items:center;gap:70px;padding:70px;border:1px solid var(--surface-border);border-radius:42px;background:rgba(255,255,255,.52);box-shadow:var(--shadow2);backdrop-filter:blur(22px)}.theme-buttons{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}.theme-buttons button{min-height:42px;padding:0 16px;border:1px solid rgba(30,30,40,.06);border-radius:13px;cursor:pointer;color:var(--soft);background:rgba(255,255,255,.48);font-size:13px;font-weight:700}.theme-buttons button.active{color:#fff;background:#19191d}.theme-preview{display:grid;min-height:390px;place-items:center;border-radius:34px;background:linear-gradient(145deg,#dcecff,#f6e8ff 58%,#ffe8f3);transition:background .6s ease}.theme-card{width:min(330px,78%);padding:32px;border:1px solid rgba(255,255,255,.72);border-radius:28px;background:rgba(255,255,255,.64);box-shadow:var(--shadow2);backdrop-filter:blur(18px)}.theme-time{color:var(--faint);font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.theme-card strong{display:block;margin-top:16px;font-size:28px}.theme-card p{margin:10px 0 0;color:var(--soft);font-size:13px;line-height:1.6}.theme-card>div{display:flex;gap:8px;margin-top:26px}.theme-card i{width:100px;height:38px;border-radius:12px;background:#19191d}.theme-card i:last-child{width:72px;background:rgba(25,25,29,.08)}.premium-card{display:flex;align-items:center;justify-content:space-between;gap:50px;padding:72px;border-radius:42px;color:#fff;background:radial-gradient(circle at 75% 20%,rgba(113,126,255,.8),transparent 30%),radial-gradient(circle at 20% 100%,rgba(255,84,168,.38),transparent 38%),#151519;box-shadow:var(--shadow3)}.eyebrow.light{color:rgba(255,255,255,.58)}.premium-card p{max-width:650px;color:rgba(255,255,255,.68)}.final-cta{display:grid;justify-items:center;padding-bottom:140px;text-align:center}.final-cta h2{max-width:800px;margin-top:26px}.final-cta p{margin-bottom:30px}.footer{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:30px;padding-block:32px;border-top:1px solid rgba(60,60,80,.08);color:var(--soft);font-size:12px}.footer p{margin:0;text-align:center}.footer>div{display:flex;justify-content:flex-end;gap:20px}.toast{position:fixed;bottom:28px;left:50%;z-index:100;padding:13px 18px;border-radius:999px;color:#fff;background:#18181c;opacity:0;pointer-events:none;transform:translate(-50%,18px);transition:var(--ease)}.toast.show{opacity:1;transform:translate(-50%,0)}.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}.reveal.visible{opacity:1;transform:none}.reveal-delay{transition-delay:.14s}
body[data-theme="day"]{--bg1:#e9f4ff;--bg2:#f3f1ff;--bg3:#fff0f7}body[data-theme="evening"]{--bg1:#f1e8ff;--bg2:#ffe8ef;--bg3:#ffe8d8}body[data-theme="night"]{--bg1:#151a33;--bg2:#241b42;--bg3:#38203d;--text:#f4f4f8;--soft:rgba(244,244,248,.68);--faint:rgba(244,244,248,.46);--surface:rgba(32,33,49,.64);--surface-border:rgba(255,255,255,.08)}body[data-theme="night"] .site-header.scrolled{background:rgba(19,20,33,.72)}body[data-theme="night"] .app-card,body[data-theme="night"] .floating-card,body[data-theme="night"] .industry-strip,body[data-theme="night"] .feature-card,body[data-theme="night"] .adaptive-panel{background:rgba(31,32,48,.74)}
@media(max-width:1050px){.nav-links{display:none}.hero{grid-template-columns:1fr;gap:20px;text-align:center}.hero-copy{display:grid;justify-items:center}.hero-preview{width:min(760px,100%);margin-inline:auto}.trust-line{justify-content:center}.feature-wide,.adaptive-panel{grid-template-columns:1fr}.adaptive-panel{padding:46px}}@media(max-width:760px){.container{width:min(calc(100% - 28px),var(--container))}.section{padding-block:78px}.nav-actions{display:none}.menu-button{display:block}.mobile-menu{position:fixed;top:82px;right:14px;left:14px;z-index:60;display:grid;gap:8px;padding:18px;border:1px solid var(--surface-border);border-radius:24px;background:rgba(255,255,255,.92);box-shadow:var(--shadow2);opacity:0;pointer-events:none;transform:translateY(-12px);transition:var(--ease)}.mobile-menu.open{opacity:1;pointer-events:auto;transform:none}.mobile-menu a{padding:13px 12px;border-radius:12px;font-weight:700}.hero{min-height:auto;padding-top:50px}.hero h1{font-size:clamp(50px,14vw,70px)}.hero-copy>p{font-size:16px}.hero-buttons{width:100%;flex-direction:column}.hero-buttons .button{width:100%}.hero-preview{min-height:540px}.app-card{width:105%}.app-sidebar{display:none}.app-main{padding:20px}.floating-card{width:210px}.floating-reminder{left:-8px}.floating-ai{right:-8px}.feature-grid{grid-template-columns:1fr}.feature-wide{grid-column:auto}.calendar-demo{overflow-x:auto}.calendar-head,.calendar-days{min-width:480px}.adaptive-panel{padding:30px 22px;border-radius:30px}.premium-card{align-items:flex-start;flex-direction:column;padding:44px 28px;border-radius:30px}.footer{grid-template-columns:1fr;justify-items:center;text-align:center}.footer>div{justify-content:center}}@media(max-width:520px){.hero-preview{min-height:500px}.preview-grid{grid-template-columns:1fr}.small-card.accent{display:none}.floating-card{display:none}.feature-card{padding:26px}.section-heading h2,.adaptive-copy h2,.premium-card h2,.final-cta h2{font-size:39px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:1ms!important;transition-duration:1ms!important}}


/* === ShiftFlow v0.2 additions === */
body[data-theme="blue"]{--background-start:#dff2ff;--background-middle:#e6efff;--background-end:#edf8ff;--blue:#3f9cff;--purple:#597dff;--pink:#68cfff}
body[data-theme="pink"]{--background-start:#ffe7f2;--background-middle:#f4e9ff;--background-end:#ffe8f8;--blue:#ff6fb3;--purple:#d46dff;--pink:#ff9acb}
body[data-theme="green"]{--background-start:#e5fff4;--background-middle:#e9fff8;--background-end:#e8f7ff;--blue:#42c992;--purple:#58d8b4;--pink:#8ee7c7}
body[data-theme="orange"]{--background-start:#fff0df;--background-middle:#fff5e8;--background-end:#ffe9dc;--blue:#ff9955;--purple:#ffb25c;--pink:#ffd09c}
.theme-switcher{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1px solid var(--surface-border);border-radius:14px;background:rgba(255,255,255,.46);cursor:pointer;font-weight:700;color:var(--text-soft);backdrop-filter:blur(16px)}
.theme-switcher span{width:11px;height:11px;border-radius:999px;background:linear-gradient(135deg,var(--blue),var(--pink));box-shadow:0 0 0 4px rgba(100,116,255,.08)}
.theme-popover{position:fixed;top:78px;right:max(20px,calc((100vw - var(--container))/2));z-index:90;width:180px;padding:10px;border:1px solid var(--surface-border);border-radius:20px;background:rgba(255,255,255,.86);box-shadow:var(--shadow-medium);opacity:0;pointer-events:none;transform:translateY(-10px);transition:var(--transition);backdrop-filter:blur(24px)}
.theme-popover.open{opacity:1;pointer-events:auto;transform:none}
.theme-popover button{display:flex;align-items:center;gap:10px;width:100%;min-height:40px;padding:0 12px;border:0;border-radius:12px;background:transparent;cursor:pointer;color:var(--text-soft);font-weight:700;text-align:left}
.theme-popover button:hover{background:rgba(20,20,30,.06);color:var(--text)}
.theme-popover i{width:12px;height:12px;border-radius:999px}.dot-violet{background:#8b63ff}.dot-blue{background:#4aa6ff}.dot-pink{background:#ff69ad}.dot-green{background:#4fd19a}.dot-orange{background:#ffa25f}
.cursor-glow{position:fixed;z-index:-2;width:360px;height:360px;border-radius:999px;filter:blur(85px);opacity:.14;pointer-events:none;background:var(--purple);transform:translate(-50%,-50%)}
.app-window{transition:transform .22s var(--transition)}
.progress-fill,.progress i{transition:width 1.2s cubic-bezier(.2,.8,.2,1)}
.feature-card:nth-child(2){transition-delay:60ms}.feature-card:nth-child(3){transition-delay:100ms}.feature-card:nth-child(4){transition-delay:140ms}.feature-card:nth-child(5){transition-delay:180ms}
@media(max-width:760px){.theme-switcher{display:none}.theme-popover{right:14px;left:14px;width:auto}}


/* =========================
   ShiftFlow v0.4 Theme System
   ========================= */

:root,
html[data-mode="dark"] {
  --app-bg-1: #111428;
  --app-bg-2: #1c1d3a;
  --app-bg-3: #31244f;
  --app-text: #f7f7fb;
  --app-text-soft: rgba(247, 247, 251, .70);
  --app-text-faint: rgba(247, 247, 251, .44);
  --app-surface: rgba(28, 29, 52, .74);
  --app-surface-2: rgba(255,255,255,.06);
  --app-border: rgba(255,255,255,.09);
  --app-input: rgba(255,255,255,.055);
  --app-input-focus: rgba(255,255,255,.08);
  --app-shadow: 0 30px 90px rgba(0,0,0,.30);
  color-scheme: dark;
}

html[data-mode="light"] {
  --app-bg-1: #eef3ff;
  --app-bg-2: #f4edff;
  --app-bg-3: #ffeef7;
  --app-text: #17171b;
  --app-text-soft: rgba(23,23,27,.68);
  --app-text-faint: rgba(23,23,27,.42);
  --app-surface: rgba(255,255,255,.72);
  --app-surface-2: rgba(255,255,255,.62);
  --app-border: rgba(60,60,80,.08);
  --app-input: rgba(255,255,255,.76);
  --app-input-focus: #fff;
  --app-shadow: 0 30px 90px rgba(67,69,93,.14);
  color-scheme: light;
}

html[data-accent="violet"] {
  --accent-a: #5c7cff;
  --accent-b: #9b61ff;
  --accent-c: #ff6bb5;
}
html[data-accent="blue"] {
  --accent-a: #4ca7ff;
  --accent-b: #6b8eff;
  --accent-c: #69d4ff;
}
html[data-accent="pink"] {
  --accent-a: #ff64ad;
  --accent-b: #f687ff;
  --accent-c: #ffb0d4;
}
html[data-accent="green"] {
  --accent-a: #54d49a;
  --accent-b: #69e4c0;
  --accent-c: #a8f0cf;
}
html[data-accent="orange"] {
  --accent-a: #ff9f55;
  --accent-b: #ffca6b;
  --accent-c: #ffd7a1;
}

body {
  color: var(--app-text) !important;
  background:
    radial-gradient(circle at 85% 10%, color-mix(in srgb, var(--accent-a) 22%, transparent), transparent 30%),
    radial-gradient(circle at 15% 90%, color-mix(in srgb, var(--accent-c) 20%, transparent), transparent 34%),
    linear-gradient(145deg, var(--app-bg-1), var(--app-bg-2) 48%, var(--app-bg-3)) !important;
  transition: background .55s ease, color .35s ease;
}

.site-header.scrolled {
  background: color-mix(in srgb, var(--app-bg-1) 76%, transparent) !important;
  border-color: var(--app-border) !important;
}

.nav-links,
.nav-login,
.hero-copy > p,
.hero-meta,
.proof-strip,
.section-heading p,
.adaptive-copy p,
.premium-card p,
.final-cta p,
.footer,
.back-link {
  color: var(--app-text-soft) !important;
}

.feature-card,
.adaptive-panel,
.proof-strip,
.auth-card,
.auth-benefits article,
.demo-card,
.settings-card,
.dashboard-shell,
.dashboard-widget {
  background: var(--app-surface) !important;
  border-color: var(--app-border) !important;
  box-shadow: var(--app-shadow) !important;
}

input,
select,
textarea {
  color: var(--app-text) !important;
  background: var(--app-input) !important;
  border-color: var(--app-border) !important;
}

input:focus,
select:focus,
textarea:focus {
  background: var(--app-input-focus) !important;
}

.theme-panel,
.mobile-menu {
  background: color-mix(in srgb, var(--app-bg-1) 92%, transparent) !important;
}

.brand-mark,
.dashboard-logo,
.large-logo {
  background: linear-gradient(135deg, var(--accent-a), var(--accent-b) 55%, var(--accent-c)) !important;
}

.theme-dot {
  background: linear-gradient(135deg, var(--accent-a), var(--accent-c)) !important;
}

.button-accent {
  color: #fff;
  background: linear-gradient(135deg, var(--accent-a), var(--accent-b));
  box-shadow: 0 16px 34px color-mix(in srgb, var(--accent-b) 28%, transparent);
}

html[data-mode="light"] .button-dark {
  color: white;
  background: #17171b;
}

html[data-mode="dark"] .button-light {
  color: var(--app-text);
  background: rgba(255,255,255,.10);
}

html[data-mode="light"] .button-light {
  color: #20202a;
  background: rgba(255,255,255,.82);
}

html[data-mode="light"] .auth-tabs button.active,
html[data-mode="light"] .adaptive-buttons button.active {
  color: white;
  background: #17171b;
}

html[data-mode="dark"] .auth-tabs button.active,
html[data-mode="dark"] .adaptive-buttons button.active {
  color: #17171b;
  background: white;
}

html[data-mode="light"] .auth-form input[type="text"],
html[data-mode="light"] .auth-form input[type="email"],
html[data-mode="light"] .auth-form input[type="password"] {
  color: #17171b !important;
  background: rgba(255,255,255,.84) !important;
}

html[data-mode="light"] .auth-form input::placeholder {
  color: rgba(23,23,27,.34);
}

html[data-mode="dark"] .auth-form input[type="text"],
html[data-mode="dark"] .auth-form input[type="email"],
html[data-mode="dark"] .auth-form input[type="password"] {
  color: #fff !important;
  background: rgba(255,255,255,.055) !important;
}

html[data-mode="dark"] .auth-form input::placeholder {
  color: rgba(255,255,255,.32);
}


/* ShiftFlow 1.0 Cloud */
html.cloud-checking body {
  cursor: progress;
}

html.cloud-checking .app-main,
html.cloud-checking .planner-main,
html.cloud-checking .calendar-main,
html.cloud-checking .vacation-main,
html.cloud-checking .salary-main,
html.cloud-checking .settings-page {
  opacity: .35;
  pointer-events: none;
}

.single-auth-layout {
  grid-template-columns: 1fr;
  justify-items: center;
}

.reset-card {
  justify-self: center;
}

/* ShiftFlow 2.3.2 – Native Auswahlfelder */
[data-theme="dark"] select,
body.dark select,
html.dark select {
  color-scheme: dark;
}

[data-theme="dark"] select option,
[data-theme="dark"] select optgroup,
body.dark select option,
body.dark select optgroup,
html.dark select option,
html.dark select optgroup {
  color: #f7f7fb;
  background-color: #24243f;
}

/* ShiftFlow 2.3.3 – Globale native Formularelemente */

:root {
  color-scheme: light dark;
}

html[data-theme="dark"],
body[data-theme="dark"],
html.dark,
body.dark {
  color-scheme: dark;
}

html[data-theme="light"],
body[data-theme="light"],
html.light,
body.light {
  color-scheme: light;
}

select,
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
input[type="number"],
input[type="color"] {
  color: var(--app-text);
  background-color: var(--app-input);
  border-color: var(--app-border);
}

select option,
select optgroup {
  color: #f7f7fb;
  background-color: #24243f;
}

input[type="date"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator,
input[type="month"]::-webkit-calendar-picker-indicator,
input[type="week"]::-webkit-calendar-picker-indicator {
  cursor: pointer;
  opacity: .9;
  filter: invert(1);
}

html[data-theme="light"] select option,
html[data-theme="light"] select optgroup,
body[data-theme="light"] select option,
body[data-theme="light"] select optgroup,
html.light select option,
html.light select optgroup,
body.light select option,
body.light select optgroup {
  color: #171722;
  background-color: #ffffff;
}

html[data-theme="light"] input[type="date"]::-webkit-calendar-picker-indicator,
html[data-theme="light"] input[type="time"]::-webkit-calendar-picker-indicator,
html[data-theme="light"] input[type="datetime-local"]::-webkit-calendar-picker-indicator,
html[data-theme="light"] input[type="month"]::-webkit-calendar-picker-indicator,
html[data-theme="light"] input[type="week"]::-webkit-calendar-picker-indicator,
body[data-theme="light"] input[type="date"]::-webkit-calendar-picker-indicator,
body[data-theme="light"] input[type="time"]::-webkit-calendar-picker-indicator,
body[data-theme="light"] input[type="datetime-local"]::-webkit-calendar-picker-indicator,
body[data-theme="light"] input[type="month"]::-webkit-calendar-picker-indicator,
body[data-theme="light"] input[type="week"]::-webkit-calendar-picker-indicator {
  filter: none;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  opacity: .8;
}

input[type="range"] {
  color-scheme: inherit;
}

input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--accent-b);
}

select:focus,
input[type="date"]:focus,
input[type="time"]:focus,
input[type="datetime-local"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="color"]:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--accent-b) 55%, var(--app-border));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-b) 14%, transparent);
}

@media (prefers-color-scheme: dark) {
  html[data-theme="system"],
  body[data-theme="system"] {
    color-scheme: dark;
  }

  html[data-theme="system"] select option,
  html[data-theme="system"] select optgroup,
  body[data-theme="system"] select option,
  body[data-theme="system"] select optgroup {
    color: #f7f7fb;
    background-color: #24243f;
  }

  html[data-theme="system"] input[type="date"]::-webkit-calendar-picker-indicator,
  html[data-theme="system"] input[type="time"]::-webkit-calendar-picker-indicator,
  html[data-theme="system"] input[type="datetime-local"]::-webkit-calendar-picker-indicator,
  html[data-theme="system"] input[type="month"]::-webkit-calendar-picker-indicator,
  html[data-theme="system"] input[type="week"]::-webkit-calendar-picker-indicator,
  body[data-theme="system"] input[type="date"]::-webkit-calendar-picker-indicator,
  body[data-theme="system"] input[type="time"]::-webkit-calendar-picker-indicator,
  body[data-theme="system"] input[type="datetime-local"]::-webkit-calendar-picker-indicator,
  body[data-theme="system"] input[type="month"]::-webkit-calendar-picker-indicator,
  body[data-theme="system"] input[type="week"]::-webkit-calendar-picker-indicator {
    filter: invert(1);
  }
}

@media (prefers-color-scheme: light) {
  html[data-theme="system"],
  body[data-theme="system"] {
    color-scheme: light;
  }

  html[data-theme="system"] select option,
  html[data-theme="system"] select optgroup,
  body[data-theme="system"] select option,
  body[data-theme="system"] select optgroup {
    color: #171722;
    background-color: #ffffff;
  }

  html[data-theme="system"] input[type="date"]::-webkit-calendar-picker-indicator,
  html[data-theme="system"] input[type="time"]::-webkit-calendar-picker-indicator,
  html[data-theme="system"] input[type="datetime-local"]::-webkit-calendar-picker-indicator,
  html[data-theme="system"] input[type="month"]::-webkit-calendar-picker-indicator,
  html[data-theme="system"] input[type="week"]::-webkit-calendar-picker-indicator,
  body[data-theme="system"] input[type="date"]::-webkit-calendar-picker-indicator,
  body[data-theme="system"] input[type="time"]::-webkit-calendar-picker-indicator,
  body[data-theme="system"] input[type="datetime-local"]::-webkit-calendar-picker-indicator,
  body[data-theme="system"] input[type="month"]::-webkit-calendar-picker-indicator,
  body[data-theme="system"] input[type="week"]::-webkit-calendar-picker-indicator {
    filter: none;
  }
}

/* ShiftFlow 11.5.1 – stabile öffentliche Startseite */
.hero-preview{position:relative;min-width:0;overflow:visible}
.hero-preview .app-card{max-height:620px}
.hero-preview .app-content{min-height:430px}
.hero-preview .app-sidebar{position:static!important;display:flex!important;width:62px!important;min-width:62px!important;height:auto!important;max-height:none!important;padding:28px 0 0!important;border-radius:0!important;overflow:hidden!important;background:transparent!important}
.hero-preview .app-main{min-width:0!important;padding:28px!important;overflow:hidden!important}
@media(max-width:1050px){.hero-preview{overflow:hidden;border-radius:34px}.hero-preview .app-card{width:min(680px,94%)}}
@media(max-width:760px){.hero-preview .app-sidebar{display:none!important}.hero-preview .app-card{width:96%;max-height:540px}}