body:has(.demo-page){height:auto;min-height:100%;overflow-y:auto}.demo-page{min-height:100vh;padding:14px;background:var(--bg-primary);color:var(--text)}.demo-topbar{display:flex;align-items:center;gap:18px;padding:8px 20px;border:1px solid var(--line);border-radius:22px;background:var(--panel)}.demo-logo{display:block;width:128px;height:auto}.demo-badge{padding:5px 10px;border-radius:999px;background:var(--bg-secondary);color:var(--muted);font-size:12px}.demo-topbar>div{display:flex;align-items:center;gap:10px;margin-left:auto}.demo-footer>a,.demo-topbar button,.demo-topbar>div>a{display:inline-flex;min-height:44px;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:999px;font-size:13px;font-weight:600;cursor:pointer}.demo-topbar button{border:1px solid var(--line);background:var(--panel);color:var(--text-secondary)}.demo-footer>a,.demo-topbar>div>a{background:var(--accent);color:white}.demo-intro{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:32px 12px 24px}.demo-intro h1{margin:0 0 8px;font-size:clamp(26px,3vw,36px);line-height:1.2;font-weight:700;letter-spacing:-.03em}.demo-intro p{margin:0;font-size:14px;line-height:1.6;color:var(--text-secondary)}.demo-intro .demo-notice{max-width:290px;font-size:12px;color:var(--muted)}.demo-notice span{display:block;margin-bottom:3px;font-weight:600;color:var(--accent)}.demo-section-nav{display:flex;flex-wrap:wrap;gap:6px;padding:7px;border:1px solid var(--line);border-radius:22px;background:var(--panel)}.demo-section-nav a{display:flex;align-items:center;justify-content:center;flex:1 0 auto;min-height:44px;padding:10px 16px;border-radius:999px;font-size:13px;font-weight:600;color:var(--text-secondary);transition:background .15s,color .15s}.demo-section-nav a:hover{background:var(--bg-secondary);color:var(--text)}.demo-section-nav a[aria-current=page]{background:var(--accent);color:white}.demo-section{padding-top:20px;scroll-margin-top:16px}.demo-section-heading{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 16px;padding:0 10px 14px}.demo-section-heading h2{margin:0;font-size:18px;font-weight:600}.demo-section-heading p{margin:0;max-width:760px;font-size:13px;line-height:1.6;color:var(--muted)}.demo-app-surface{height:max(620px,calc(100dvh - 260px));display:flex;flex-direction:column;position:relative}.demo-app-surface,.demo-app-surface>*{min-height:0;min-width:0}.demo-app-arshjul{height:820px}.demo-app-surface .classes-mobile-content,.demo-app-surface .mobile-day-scroll,.demo-app-surface .results-mobile-content,.demo-app-surface .schedule-wrap,.demo-app-surface .workgroups-layout{overscroll-behavior-y:auto}.demo-peer-planning{display:flex;flex-direction:column;flex:1;min-height:0;padding:12px}.demo-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:24px;padding:24px;border:1px solid var(--line);border-radius:22px;background:var(--panel)}.demo-footer h2{margin:0 0 6px;font-size:20px;font-weight:600}.demo-footer p{margin:0;font-size:13px;color:var(--muted)}.demo-footer>a{flex-shrink:0}.demo-loading{padding:60px;text-align:center}.demo-page :is(a,button):focus-visible{outline:2px solid var(--accent);outline-offset:3px}.demo-skip-link{position:fixed;left:24px;top:-100px;z-index:30000;padding:12px 18px;border-radius:12px;background:var(--panel);color:var(--accent)}.demo-skip-link:focus{top:20px}@media (max-width:760px){.demo-page{padding:8px}.demo-topbar{padding:8px 12px;gap:8px;flex-wrap:wrap}.demo-logo{width:112px}.demo-badge{margin-left:auto}.demo-topbar>div{flex-basis:100%;margin:0}.demo-topbar>div>*{flex:1;padding-inline:10px;font-size:12px}.demo-intro{align-items:flex-start;flex-direction:column;gap:14px;padding:24px 8px 20px}.demo-intro .demo-notice{max-width:none}.demo-section-nav{gap:4px}.demo-section-nav a{flex-basis:calc(50% - 4px);padding-inline:8px;font-size:12px}.demo-section-heading{display:block;padding-inline:8px}.demo-section-heading p{margin-top:5px}.demo-app-surface{height:max(620px,calc(100dvh - 140px))}.demo-app-arshjul{height:780px}.demo-app-arbetsgrupper{height:1000px}.demo-footer{align-items:stretch;flex-direction:column;padding:20px}}@media (prefers-reduced-motion:reduce){.demo-section-nav a{transition:none}}