:root{color-scheme:light;--bg:#f6f5f2;--surface:rgba(255,255,255,.9);--tile:rgba(255,255,255,.48);--ink:#14202c;--muted:#65707c;--line:rgba(30,40,50,.14);--accent:#82052e;--accent-ink:#fff;--alert:#a00632;--alert-bg:rgba(255,223,225,.64);--logo:#14202c;--shadow:0 16px 55px #20160c20}html[data-theme=dark]{color-scheme:dark;--bg:#17130f;--surface:rgba(27,22,17,.91);--tile:rgba(38,33,26,.55);--ink:#fff8ed;--muted:#c2b5a7;--line:rgba(255,233,200,.23);--accent:#ff9c4e;--accent-ink:#231307;--alert:#ff705d;--alert-bg:rgba(132,51,22,.26);--logo:#fff2df;--shadow:0 16px 55px #0005}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}a{color:inherit}button{cursor:pointer;color:inherit}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:4px}button{background:var(--tile);border:1px solid var(--line);border-radius:10px}h1,h2,h3,p{margin:0 0 16px}h1{font-size:clamp(44px,4.5vw,76px);line-height:1.02;letter-spacing:-.03em}h2{font-size:clamp(28px,3vw,42px);line-height:1.15;letter-spacing:-.025em}h3{font-size:21px;line-height:1.25}small{font-size:13px}.muted{color:var(--muted)}.ico{width:25px;height:25px;flex-shrink:0;vertical-align:middle}.wordmark{display:block;width:210px;height:55px;background:var(--logo);-webkit-mask:url(assets/control-freak-corporate-wordmark-white.svg) center/contain no-repeat;mask:url(assets/control-freak-corporate-wordmark-white.svg) center/contain no-repeat}.brand{display:inline-block;flex-shrink:0}.topbar{position:absolute;z-index:4;top:16px;left:3%;width:94%;padding:10px 24px;display:flex;align-items:center;justify-content:space-between;gap:24px;background:var(--surface);border:1px solid var(--line);border-radius:18px;backdrop-filter:blur(20px)}nav{display:flex;gap:35px;margin-left:auto}nav a{text-decoration:none;font-size:16px}.nav-actions{display:flex;align-items:center;gap:14px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:12px 28px;border-radius:12px;font-weight:600;text-decoration:none;border:1.5px solid var(--accent)}.primary{background:var(--accent);color:var(--accent-ink)}.outline{color:var(--accent);background:transparent}.theme-toggle{display:flex;align-items:center;justify-content:center;width:44px;height:44px;flex-shrink:0}.theme-toggle .ico{width:21px}.theme-toggle .ico:first-child{display:none}[data-theme=dark] .theme-toggle .ico:first-child{display:block}[data-theme=dark] .theme-toggle .ico:last-child{display:none}.hero{position:relative;min-height:980px;min-height:100svh;display:flex;align-items:center;padding:160px 3% 110px}.scene{position:absolute;inset:0;z-index:0;display:block;overflow:hidden}.scene img{width:100%;height:100%;object-fit:cover}.hero-grid{width:100%;position:relative;display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(45px,10vw,180px);align-items:center}.glass{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);backdrop-filter:blur(20px);border-radius:24px}.hero-copy{padding:40px}.eyebrow{text-transform:uppercase;letter-spacing:.28em;font-size:13px;font-weight:600;margin-bottom:24px}.lead{font-size:clamp(19px,1.5vw,25px);line-height:1.45;margin:24px 0 28px}.actions{display:flex;gap:15px;margin-bottom:18px}.hero-copy hr{margin:28px 0 12px}.hero-copy .brand .wordmark{height:44px;width:220px}.hero-copy>.brand+p{font-size:14px;margin:8px 0}.hero-copy small{font-size:12px}hr{border:0;border-top:1px solid var(--line);margin:16px 0}.preview{padding:24px}.panel-title{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px}.panel-title h2,.panel-title h1{font-size:21px;line-height:1.2;letter-spacing:-.025em;margin:0}.pills{display:flex;gap:5px}.pills span,.pill{display:inline-block;white-space:nowrap;padding:4px 11px;border-radius:30px;background:var(--line);font-size:11px;font-weight:500}.pills span:last-child{background:var(--accent);color:var(--accent-ink)}.readings{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}.readings>div{display:flex;align-items:center;gap:20px;border:1px solid var(--line);background:var(--tile);border-radius:12px;padding:14px}.readings small{display:block;line-height:1.4;min-height:38px}.readings strong{display:block;font-size:clamp(22px,1.8vw,31px);white-space:nowrap;line-height:1.3;margin-top:8px;letter-spacing:-.02em}.alert{display:flex;gap:18px;align-items:center;background:var(--alert-bg);color:var(--alert);border:1px solid color-mix(in srgb,var(--alert) 23%,transparent);padding:16px 20px;border-radius:12px;margin-bottom:12px}.alert>.ico{width:34px;height:34px;border:2px solid currentColor;border-radius:50%;padding:3px}.alert strong{font-size:21px;line-height:1.2;display:block}.alert small{display:block;color:var(--ink);margin-top:4px}.preview .alert small{display:none}.info-row{display:flex;align-items:center;gap:20px;padding:10px 18px;font-size:15px;line-height:1.4}.preview .info-row{padding:10px 12px}.info-row .pill{margin-left:8px}.preview-outputs{display:flex;gap:10px;margin-top:16px}.preview-outputs .info-row{background:var(--tile);border:1px solid var(--line);border-radius:12px;flex:1;font-size:13px;gap:10px}.band{padding:85px 6%}.band:nth-of-type(odd){background:var(--tile)}.wrap{max-width:1240px;margin:auto}.wrap>h2{max-width:800px;margin-bottom:32px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.cards article{padding:30px;border:1px solid var(--line);border-radius:20px;background:var(--tile)}.cards .ico{color:var(--accent);width:32px;height:32px;margin-bottom:25px}.cards p{color:var(--muted);margin:0}.beta{text-align:center}.beta h2{margin:0 auto 20px}.beta .muted{font-size:13px;margin-top:25px}iframe{display:block;width:100%;height:1030px;border:1px solid var(--line);border-radius:24px;margin-top:24px}footer{padding:40px 6%;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:30px}footer p{font-size:13px;margin:0}.skip{position:fixed;top:-90px;left:20px;z-index:50;background:var(--bg);padding:12px}.skip:focus{top:10px}.demo-body{min-height:100svh}.demo-body>.scene{position:fixed}.demo-top{position:relative;z-index:2;margin:14px 20px;display:flex;align-items:center;gap:18px;background:var(--surface);backdrop-filter:blur(20px);border:1px solid var(--line);border-radius:16px;padding:6px 16px}.demo-name{font-size:30px;font-weight:600;letter-spacing:-.03em}.demo-top .nav-actions{margin-left:auto}.demo-main{position:relative;z-index:1;display:flex;justify-content:flex-end;padding:0 20px 24px}.cfd-device{width:min(630px,47vw);padding:24px}.cfd-device .panel-title h1{font-size:clamp(20px,1.75vw,28px);letter-spacing:-.03em}.cfd-device>.panel-title{flex-wrap:wrap;gap:10px;margin-bottom:16px}.modes{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px}.modes button{display:flex;flex-direction:column;align-items:center;gap:7px;padding:14px 8px;font-size:14px}.modes .ico{width:30px;height:30px}.modes [aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);box-shadow:0 3px 16px color-mix(in srgb,var(--accent) 20%,transparent)}[data-theme=dark] .modes [aria-pressed=true]{background:#65360e70;color:var(--accent);box-shadow:0 0 15px #ff9b4c40}.demo-readings{grid-template-columns:repeat(2,1fr);gap:8px}.demo-readings>div{padding:10px 20px}.demo-readings small{min-height:0;font-size:14px}.demo-readings strong{font-size:27px;margin:0}.outputs{border:1px solid var(--line);border-radius:12px;background:var(--tile);overflow:hidden}.outputs .panel-title{padding:10px 16px;margin:0}.outputs h2{font-size:17px}.output{display:flex;gap:18px;align-items:center;padding:10px 16px;border-top:1px solid var(--line)}.output>div{flex:1}.output strong,.output small{display:block}.output strong{font-size:15px}.output small{font-size:13px;color:var(--muted)}.output>b{font-size:12px;min-width:24px}.switch{width:45px;height:25px;border-radius:30px;padding:3px;border:0;background:var(--muted);flex-shrink:0}.switch span{display:block;width:19px;height:19px;border-radius:50%;background:white;transition:transform .18s}.switch[aria-checked=true]{background:var(--accent)}.switch[aria-checked=true] span{transform:translateX(20px)}.cfd-device>.info-row{margin-top:8px;border:1px solid var(--line);border-radius:10px;background:var(--tile);padding:8px 16px;font-size:14px}.scenario,.notifications{padding:10px 14px;margin-top:8px;border:1px solid var(--line);border-radius:12px;background:var(--tile)}.scenario h2,.notifications h2{font-size:16px;margin:0 0 8px}.alert-buttons{display:grid;grid-template-columns:repeat(3,1fr) .7fr;gap:7px}.alert-buttons button{border:1px solid var(--accent);font-size:12px;padding:8px 5px;border-radius:8px}.scenario p{font-size:11px;color:var(--muted);margin:8px 0 0;min-height:16px}.channels{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.channels button{padding:7px;font-size:12px;display:flex;gap:6px;align-items:center;justify-content:center}.channels .ico{width:16px;height:16px}.channels [aria-checked=true]{border-color:var(--accent);color:var(--accent)}.channels [aria-checked=false]{opacity:.55}.notifications small{display:block;font-size:12px;text-align:center;margin:6px 0}.notifications>button{display:block;margin:auto;font-size:12px;padding:5px 12px}.demo-caption{position:fixed;left:20px;bottom:20px;width:41%;z-index:1;padding:14px 18px;border-radius:16px}.demo-caption strong,.demo-caption small{display:block}.demo-caption strong{font-size:14px}.demo-caption small{font-size:12px;margin-top:4px}dialog{background:var(--bg);color:var(--ink);border:1px solid var(--line);border-radius:24px;padding:30px;max-width:min(480px,90vw)}dialog::backdrop{background:#0009}dialog form{margin-top:20px}dialog h2{font-size:25px}
@media(min-width:1450px){.hero-copy{padding:44px}.hero{min-height:100svh}.preview{padding:24px}.cfd-device{width:620px}.demo-main{padding-top:0}.demo-top{background:var(--surface);border:1px solid var(--line)}.demo-top .brand,.demo-top .demo-name,.demo-top .nav-actions{background:var(--surface);border-radius:12px;padding:3px 10px}.demo-top .demo-name{margin-left:-18px}}
@media(max-width:1100px){nav{gap:18px}nav a{font-size:13px}.topbar .wordmark{width:160px}.topbar{gap:16px;padding:10px 16px}.button{padding:10px 20px}.hero-grid{gap:35px;grid-template-columns:1.1fr 1fr}.hero-copy{padding:28px}.preview{padding:18px}.readings{grid-template-columns:repeat(2,1fr)}.readings small{min-height:0}.readings strong{font-size:24px}.hero-copy .lead{font-size:20px}.hero-copy h1{font-size:50px}.preview .panel-title{flex-wrap:wrap}.preview .info-row{font-size:13px}.cfd-device{width:55vw}.demo-caption{width:38%}.demo-name{font-size:23px}.demo-top .wordmark{width:170px}.cfd-device .pills span{font-size:9px}.demo-main{padding-top:8px}}
@media(max-width:760px){nav{display:none}.topbar{left:4%;width:92%}.topbar .nav-actions{gap:7px}.topbar .button{padding:9px 12px;font-size:13px}.topbar .wordmark{width:145px}.hero{padding:135px 5% 55px}.hero-grid{grid-template-columns:1fr;gap:24px}.hero-copy{padding:28px}.hero-copy h1{font-size:52px}.preview .readings{grid-template-columns:repeat(4,1fr)}.preview .readings>div{padding:12px}.preview .readings strong{font-size:22px}.preview .readings small{font-size:12px;min-height:35px}.preview .panel-title{flex-wrap:nowrap}.band{padding:60px 6%}.cards{grid-template-columns:1fr;gap:16px}.cards article{padding:26px}.cards .ico{margin-bottom:16px}footer{flex-direction:column;align-items:flex-start;gap:15px}.demo-top{margin:10px;padding:8px;gap:8px}.demo-top .wordmark{width:115px;height:38px}.demo-name{font-size:18px}.demo-top .button{font-size:12px;padding:8px 10px;min-height:38px}.demo-top .nav-actions{gap:7px}.demo-main{padding:8px 12px 25px}.cfd-device{width:100%}.demo-caption{position:static;width:auto;margin:0 12px 20px}.demo-body>.scene{position:absolute;height:360px}.demo-body .demo-main{padding-top:240px}.demo-top{background:var(--surface)}.cfd-device .panel-title h1{font-size:24px}.demo-body .scene:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 65%,var(--bg))}}
@media(max-width:600px){.hero:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 0%,color-mix(in srgb,var(--bg) 32%,transparent) 25%,var(--bg) 95%)}.hero-grid{z-index:1}.hero .scene{height:820px}.hero-copy{padding:26px 22px}.hero-copy h1{font-size:46px;letter-spacing:-.03em}.hero-copy h1 br{display:none}.hero-copy .lead{font-size:19px}.actions{gap:10px;flex-wrap:wrap}.actions .button{font-size:14px;padding:12px 17px}.eyebrow{font-size:11px;letter-spacing:.22em}.hero-copy .muted{font-size:14px}.preview{padding:19px}.preview .panel-title{flex-wrap:wrap}.preview .readings{grid-template-columns:repeat(2,1fr)}.preview .readings small{min-height:0}.preview .readings strong{font-size:25px}.preview-outputs{flex-wrap:wrap}.demo-top .demo-name{display:none}.demo-top .wordmark{width:136px}.demo-top .theme-toggle{width:36px;height:36px}.cfd-device{padding:16px;border-radius:20px}.cfd-device>.panel-title{margin-bottom:14px}.cfd-device .panel-title h1{font-size:22px}.pills span{font-size:9px;padding:3px 9px}.modes{gap:7px}.modes button{padding:12px 5px;font-size:12px}.modes .ico{width:26px;height:26px}.demo-readings>div{padding:10px 12px;gap:13px}.demo-readings .ico{width:22px}.demo-readings strong{font-size:23px}.demo-readings small{font-size:13px}.alert{padding:14px 12px;gap:12px}.alert strong{font-size:18px}.alert small{font-size:12px}.output{padding:10px;gap:10px}.output strong{font-size:14px}.output small{font-size:11px}.output>b{display:none}.outputs .panel-title{padding:10px}.outputs h2{font-size:14px}.cfd-device>.info-row{font-size:12px;gap:12px;padding:9px 10px}.scenario,.notifications{padding:10px}.alert-buttons{grid-template-columns:repeat(2,1fr)}.alert-buttons button{min-height:38px}.channels{gap:5px}.channels button{font-size:11px;padding:8px 3px;gap:4px}.demo-caption strong{font-size:12px}.demo-caption small{font-size:11px}.demo-body .demo-main{padding-top:230px}.demo-body>.scene{height:340px}.notifications>button{min-height:35px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

.preview-outputs .info-row:after{content:"";display:block;flex-shrink:0;width:29px;height:18px;border-radius:20px;background:var(--accent);margin-left:auto;box-shadow:inset -12px 0 0 2px var(--accent-ink)}