:root{/* Colours: the only colour codes in Metode's own CSS (docs/ui-regler.md). */--ink:#132b24;--muted:#55655e;--ink-accent:#0d7a54;--ink-on-strong:#ffffff;--ink-on-strong-muted:#dcf7e9;--ink-success:#0d7a54;--ink-warning:#80561a;--ink-critical:#a8322a;--ink-info:#2f5aa8;--ink-purple:#6a3fa0;--ink-faint:#9fb0a8;--bg:#f5f9f7;--panel:#ffffff;--panel-sunken:#ecf2ef;--panel-soft:#f9fbfa;--panel-selected:#e5f6ed;--strong:#0d7a54;--strong-hover:#0a6243;--highlight:#d4f7e4;--line-on-strong:#4fb38a;--dot:#10a06c;--bg-success:#e3f4ea;--bg-warning:#fdf2df;--bg-critical:#fdeceb;--bg-info:#eaf1fd;--bg-purple:#f3ecfb;--line:#e3ebe7;--line-strong:#d0ddd6;--line-hover:#8fcfb1;--line-success:#bfe3cf;--line-warning:#ecd3a6;--line-critical:#efc0bb;--strong-critical:#a8322a;--shadow-soft:rgba(19,43,36,.05);--shadow-pop:rgba(19,43,36,.22);--fade:rgba(255,255,255,.87);--text-xs:12px;--text-sm:13px;--text-md:14px;--text-lg:16px;--text-xl:20px;--text-2xl:24px;--text-3xl:32px;--sidebar:232px;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);font-size:var(--text-md);line-height:1.5}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a,input,select,textarea,summary{-webkit-tap-highlight-color:transparent}button,a,summary{touch-action:manipulation}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--line-hover);outline-offset:4px}input:focus,select:focus,textarea:focus{outline:2px solid var(--line-hover);outline-offset:1px}h1,h2,h3,p{margin:0}h1{font-size:var(--text-3xl);letter-spacing:-.6px;line-height:1.2;font-weight:600}h2{font-size:var(--text-lg);letter-spacing:-.4px;font-weight:600}h3{font-size:var(--text-lg);font-weight:600}small{font-size:var(--text-sm)}.muted{color:var(--muted)}.small-text{font-size:var(--text-sm)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip-link{position:fixed;top:-60px;left:240px;background:var(--ink);color:var(--ink-on-strong);padding:12px;z-index:99}.skip-link:focus{top:10px}
.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);padding:32px 20px 16px;background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:5}.brand{display:flex;gap:12px;align-items:center;font-size:28px;font-weight:750;line-height:1;letter-spacing:-1.2px;margin:0 8px}.brand-symbol{width:39px;height:42px;display:grid;place-items:center;background:var(--strong);color:var(--highlight);border-radius:12px;font-size:37px;line-height:1;padding-bottom:6px}.brand-sub{display:block;font-size:var(--text-sm);font-weight:500;letter-spacing:3.4px;margin-top:6px}.workspace-switch{display:flex;align-items:center;gap:10px;border:1px solid var(--line);padding:10px 10px;border-radius:9px;margin:32px 0 28px;font-size:var(--text-sm);font-weight:600}.workspace-switch>span:nth-child(2){flex:1}.workspace-switch span span{display:block;font-size:var(--text-xs);font-weight:400;color:var(--muted);margin-top:2px}.workspace-icon{display:grid;place-items:center;width:29px;height:29px;border:1px solid var(--line-strong);background:var(--panel-sunken);border-radius:7px;font-size:var(--text-md)}.nav-label{font-size:var(--text-xs);letter-spacing:1.7px;color:var(--muted);font-weight:600;margin:0 12px 10px}.nav-item{display:flex;align-items:center;gap:12px;padding:12px 12px;margin:4px 0;border-radius:8px;color:var(--muted);font-size:var(--text-sm);font-weight:600;transition:background .15s}.nav-item:hover{background:var(--panel-sunken);color:var(--ink)}.nav-item.active{background:var(--panel-selected);color:var(--strong)}.nav-item.active .nav-icon{color:var(--ink-accent)}.nav-icon{font-size:var(--text-xl);width:19px;text-align:center;line-height:1}.sidebar-bottom{margin-top:auto;padding-top:28px}.demo-note{font-size:var(--text-xs);font-weight:600;letter-spacing:.2px;border:1px solid var(--line);border-radius:9px;padding:12px;background:var(--panel-soft)}.demo-note p{font-weight:400;font-size:var(--text-xs);line-height:1.7;color:var(--muted);margin-top:6px}.live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--ink-accent);margin-right:6px}.sidebar-user{display:flex;align-items:center;gap:10px;margin-top:20px;padding:16px 2px 6px;border-top:1px solid var(--line)}.sidebar-user strong{font-size:var(--text-sm);display:block}.sidebar-user div span{font-size:var(--text-xs);color:var(--muted)}.logout{font-size:var(--text-xs);color:var(--muted);border:0;background:none;display:flex;justify-content:space-between;width:100%;padding:8px 0}.avatar{width:33px;height:33px;border-radius:50%;display:inline-grid;place-items:center;flex-shrink:0;background:var(--panel-sunken);color:var(--ink-accent);font-size:var(--text-xs);font-weight:600;border:2px solid var(--panel)}.avatar.small{width:27px;height:27px;font-size:var(--text-xs)}.tone-beige{background:var(--bg-critical);color:var(--ink-warning)}.tone-green{background:var(--panel-sunken);color:var(--ink-accent)}
.shell{margin-left:var(--sidebar)}.topbar{height:70px;border-bottom:1px solid var(--line);padding:0 32px;display:flex;align-items:center;justify-content:space-between;background:var(--panel);font-size:var(--text-sm)}.crumb-separator{color:var(--ink-faint);margin:0 12px}.topbar-right{display:flex;align-items:center;gap:20px}.date{font-size:var(--text-sm);color:var(--muted);text-transform:capitalize}.environment{font-size:var(--text-xs);font-weight:600;border:1px solid var(--line-strong);color:var(--muted);background:var(--panel-soft);padding:4px 8px;border-radius:5px;white-space:nowrap}main{padding:32px 32px 20px;max-width:1700px;margin:0 auto}.page-heading{display:flex;justify-content:space-between;gap:24px;align-items:center;margin-bottom:28px}.eyebrow{font-size:var(--text-xs);letter-spacing:1.8px;font-weight:600;color:var(--muted);margin-bottom:12px}.heading-dot{color:var(--dot)}.lead{color:var(--muted);font-size:var(--text-sm);line-height:1.7;margin-top:10px}.button{display:inline-flex;align-items:center;justify-content:center;gap:12px;white-space:nowrap;padding:10px 16px;border-radius:7px;border:1px solid transparent;font-size:var(--text-sm);font-weight:600;line-height:1.5;min-height:38px}.button.primary{background:var(--strong);color:var(--ink-on-strong)}.button.primary:hover{background:var(--strong-hover)}.button.secondary{background:var(--panel);border-color:var(--line)}.button.light{background:var(--panel-selected);color:var(--ink)}.full-width{width:100%}
.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:24px}.metric{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:16px 20px;min-height:142px;transition:border-color .15s}.metric:hover{border-color:var(--line-hover)}.metric-label{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:var(--text-xs);font-weight:500}.metric-label>span{font-size:var(--text-md);color:var(--muted)}.metric-label .metric-alert{display:grid;place-items:center;width:17px;height:17px;border-radius:50%;color:var(--ink-critical);background:var(--bg-critical);font-size:var(--text-xs)}.metric>strong{display:block;font-size:var(--text-3xl);letter-spacing:-1.5px;font-weight:600;line-height:1.2;margin:12px 0 8px}.metric p{font-size:var(--text-xs);color:var(--muted)}.metric>strong.rust{color:var(--ink-critical)}.metric strong small{font-size:var(--text-lg);color:var(--muted);letter-spacing:-.5px}.progress-metric{background:var(--panel);border-color:var(--line)}.progress-track{height:4px;background:var(--panel-sunken);overflow:hidden;border-radius:8px}.progress-track span{height:100%;display:block;background:var(--ink-accent);border-radius:8px}.progress-metric .progress-track{background:var(--panel-sunken);margin:4px 0 8px}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1fr) 277px;gap:20px;align-items:start}.main-column,.side-column{display:flex;flex-direction:column;gap:20px;min-width:0}.panel{background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden}.panel-heading{padding:20px 20px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px}.panel-heading p{font-size:var(--text-xs);color:var(--muted);margin-top:4px}.text-link{font-size:var(--text-xs);font-weight:600;white-space:nowrap}.text-link span{margin-left:6px}.tabs{display:flex;gap:24px;padding:0 20px;border-bottom:1px solid var(--line)}.tabs a{font-size:var(--text-sm);color:var(--muted);padding:0 0 12px;position:relative}.tabs a.selected{font-weight:600;color:var(--ink)}.tabs a.selected:after{content:"";height:2px;background:var(--strong);position:absolute;left:0;right:0;bottom:-1px}.table-scroll{overflow-x:auto}.task-table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap}.task-table th{font-weight:500;font-size:var(--text-xs);color:var(--muted);background:var(--panel);padding:12px 12px;border-bottom:1px solid var(--line)}.task-table th:first-child,.task-table td:first-child{padding-left:20px}.task-table th:last-child,.task-table td:last-child{padding-right:16px}.task-table td{padding:16px 12px;border-bottom:1px solid var(--line);font-size:var(--text-xs)}.task-table tr:last-child td{border-bottom:0}.task-table tbody tr:hover{background:var(--panel-soft)}.task-name{display:flex;align-items:flex-start;gap:10px}.task-name>div{white-space:normal;min-width:160px}.task-name a{font-size:var(--text-sm);font-weight:600;line-height:1.5;display:inline-block;max-width:275px}.task-name a:hover{text-decoration:underline}.subline{font-size:var(--text-xs);color:var(--muted);margin-top:4px;line-height:1.6}.subline span{margin:0 4px}.task-indicator{width:14px;height:14px;border:1px solid var(--line-strong);border-radius:4px;margin-top:2px;flex-shrink:0}.task-indicator.completed{background:var(--bg-success);border-color:var(--line-success);color:var(--ink-success);display:grid;place-items:center;font-size:var(--text-xs)}.badge{display:inline-flex;align-items:center;justify-content:center;gap:4px;padding:4px 6px;border-radius:5px;font-size:var(--text-xs);font-weight:500;line-height:1.4;white-space:nowrap;background:var(--panel-sunken);color:var(--muted)}.badge>span:empty{width:4px;height:4px;background:currentColor;border-radius:50%}.badge.todo{background:var(--panel-sunken);color:var(--muted)}.badge.in_progress{background:var(--bg-info);color:var(--ink-info)}.badge.waiting_customer{background:var(--bg-warning);color:var(--ink-warning)}.badge.waiting_source{background:var(--bg-purple);color:var(--ink-purple)}.badge.review{background:var(--panel-selected);color:var(--ink-accent)}.badge.done{background:var(--bg-success);color:var(--ink-success)}.badge.large{padding:6px 10px;font-size:var(--text-sm)}.overdue,.overdue small{color:var(--ink-critical)!important}.date-cell{font-weight:500;font-size:var(--text-xs)}.task-table td>small{display:block;font-size:var(--text-xs);margin-top:3px;white-space:nowrap}.assignee{display:flex;gap:6px;align-items:center;font-size:var(--text-xs)}.unassigned{font-size:var(--text-xs);color:var(--muted)}.arrow-link{font-size:var(--text-lg);color:var(--muted);display:grid;place-items:center;width:21px;height:25px}.arrow-link:hover{color:var(--strong)}.empty-state{text-align:center;padding:48px 24px;white-space:normal}.empty-state>span{display:block;font-size:var(--text-2xl);color:var(--muted);margin-bottom:10px}.empty-state h3{font-size:var(--text-lg)}.empty-state p{color:var(--muted);font-size:var(--text-sm);margin:8px 0 16px}.empty-state.compact{padding:16px}
.team-panel .panel-heading{padding-bottom:8px}.subtle-icon{color:var(--muted)}.team-row{display:flex;align-items:center;padding:12px 20px;gap:8px}.team-row:hover{background:var(--panel-soft)}.team-name{flex:1}.team-name strong{display:block;font-size:var(--text-sm);font-weight:600}.team-name small{display:block;font-size:var(--text-xs);color:var(--muted);margin-top:3px}.team-count{font-size:var(--text-md);font-weight:600}.unassigned-link{display:flex;justify-content:space-between;font-size:var(--text-xs);color:var(--muted);padding:12px 20px;border-top:1px solid var(--line);margin-top:6px}.timeline{padding:2px 20px 20px}.timeline-item{display:flex;gap:12px;position:relative;padding-bottom:20px}.timeline-item:last-child{padding-bottom:0}.timeline-item:not(:last-child):before{content:"";position:absolute;left:4px;top:11px;bottom:0;width:1px;background:var(--panel-sunken)}.timeline-dot{width:9px;height:9px;flex-shrink:0;border-radius:50%;border:2px solid var(--line-strong);background:var(--panel-selected);margin-top:4px;z-index:1}.timeline-item a,.timeline-item strong{font-size:var(--text-xs);font-weight:600}.timeline-item p{font-size:var(--text-xs);line-height:1.7;color:var(--muted);margin-top:3px}.timeline-item small{font-size:var(--text-xs);color:var(--muted)}.automation-banner{border-radius:10px;background:var(--panel-selected);border:1px solid var(--line);padding:24px;display:flex;gap:16px;align-items:center;color:var(--ink);position:relative;overflow:hidden}.automation-banner .eyebrow{color:var(--ink-accent);font-size:var(--text-xs);margin-bottom:8px;letter-spacing:1.5px}.automation-banner h3{font-size:var(--text-lg);letter-spacing:-.3px}.automation-banner p:not(.eyebrow){font-size:var(--text-sm);color:var(--muted);margin-top:6px;max-width:340px}.automation-mark{font-size:var(--text-3xl);color:var(--ink-accent);align-self:flex-start}.automation-banner .button{margin-left:auto;padding:8px 12px;font-size:var(--text-xs)}.page-footer{display:flex;justify-content:space-between;gap:16px;padding-top:28px;margin-top:4px;color:var(--muted);font-size:var(--text-xs)}.page-footer .muted{margin:0 8px}
.filter-bar{display:flex;align-items:center;gap:10px;margin-bottom:20px;flex-wrap:wrap}.search-field{position:relative;display:flex;align-items:center;flex:1;min-width:200px}.search-field>span{position:absolute;left:12px;font-size:var(--text-2xl);color:var(--muted);pointer-events:none}.search-field input:not([type=checkbox]):not([type=radio]){padding-left:40px;width:100%}input:not([type=checkbox]):not([type=radio]),select,textarea{color:var(--ink);background:var(--panel);border:1px solid var(--line-strong);border-radius:6px;padding:10px 10px;font-size:var(--text-sm);min-height:39px}input::placeholder,textarea::placeholder{color:var(--ink-faint)}select{max-width:100%;font-size:var(--text-sm)}textarea{resize:vertical;line-height:1.6}input:disabled,select:disabled{background:var(--bg);color:var(--muted)}.clear-filter{font-size:var(--text-sm);text-decoration:underline;color:var(--muted)}.messages{margin-bottom:20px}.message{padding:12px 16px;border-radius:7px;font-size:var(--text-sm);background:var(--panel-selected);border:1px solid var(--line-strong);margin-bottom:8px}.message.error{background:var(--bg-critical);color:var(--ink-critical);border-color:var(--line-critical)}.errorlist{list-style:none;margin:0 0 16px;padding:12px;background:var(--bg-critical);color:var(--ink-critical);border-radius:6px;font-size:var(--text-sm)}.field .errorlist{margin-top:6px;padding:6px}
.back-link{display:inline-block;font-size:var(--text-sm);color:var(--muted);margin-bottom:24px}.detail-heading h1{font-size:var(--text-3xl);letter-spacing:-.5px}.inline-separator{margin:0 12px;color:var(--ink-faint)}.lead>a:hover{text-decoration:underline}.detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:24px;align-items:start}.panel-body{padding:0 20px 20px}.panel-body>.description{font-size:var(--text-sm);color:var(--muted);line-height:1.8;margin:0 0 20px}.completion-label{font-size:var(--text-md);color:var(--ink-accent)}.checks{margin-top:12px}.check-row{display:flex;align-items:center;gap:12px;padding:16px 0;border-bottom:1px solid var(--line)}.check-circle{height:20px;width:20px;border:1px solid var(--line-strong);border-radius:50%;flex-shrink:0;display:grid;place-items:center;font-size:var(--text-sm)}.check-circle.checked{background:var(--bg-success);border-color:var(--line-success);color:var(--ink-success)}.check-row>div{flex:1}.check-row strong{font-size:var(--text-sm);font-weight:500;display:block}.check-row small{font-size:var(--text-xs);color:var(--muted);margin-top:4px;display:block}.text-button{border:0;background:none;color:var(--ink-accent);font-size:var(--text-xs);text-decoration:underline;padding:6px 0 6px 8px}.context-note{padding:12px;background:var(--panel-soft);color:var(--muted);font-size:var(--text-xs);line-height:1.8;border-radius:6px;margin-top:20px}.field{margin-bottom:16px}.field label{display:block;font-size:var(--text-sm);font-weight:600;margin-bottom:6px}.field input:not([type=checkbox]):not([type=radio]),.field select,.field textarea{width:100%}.stack-form{margin-top:6px}.count-tag{font-size:var(--text-xs);background:var(--panel-sunken);padding:3px 6px;border-radius:4px;color:var(--muted);margin-left:6px;vertical-align:middle}.evidence-row{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.evidence-row:last-child{border:0}.document-icon{font-size:var(--text-xl);color:var(--muted);background:var(--panel-selected);width:37px;height:40px;flex-shrink:0;display:grid;place-items:center;border-radius:6px}.evidence-row strong{font-size:var(--text-sm);font-weight:600}.evidence-row p{font-size:var(--text-sm);color:var(--muted);overflow-wrap:anywhere}.evidence-row small{font-size:var(--text-xs);color:var(--muted)}.evidence-row .evidence-note{font-size:var(--text-xs);margin-top:6px}.evidence-details{margin-top:16px;font-size:var(--text-sm)}.evidence-details summary{cursor:pointer;color:var(--ink-accent);font-weight:600;padding:8px 0}.evidence-details form{padding-top:12px}.form-help{font-size:var(--text-xs);color:var(--muted);margin-top:12px;line-height:1.7}.full-timeline{padding-top:3px}.full-timeline .timeline-item strong{font-size:var(--text-sm)}.full-timeline .timeline-item p{font-size:var(--text-sm);white-space:pre-line}.full-timeline .timeline-item small{display:block;margin-top:6px}.method-note{padding:20px;color:var(--muted)}.method-note>span{font-size:var(--text-3xl);color:var(--muted)}.method-note h3{font-size:var(--text-md);color:var(--ink-accent);margin:8px 0}.method-note p{font-size:var(--text-sm);line-height:1.9;margin-bottom:12px}.method-note small{display:block;font-size:var(--text-xs);line-height:1.7}.method-note a{display:block;font-size:var(--text-xs);color:var(--ink-accent);margin-top:16px}.simulation-card{display:flex;align-items:center;gap:16px;padding:20px;background:var(--panel-selected);border:1px solid var(--line-strong);border-radius:10px}.simulation-card h3{font-size:var(--text-md);margin-bottom:8px}.simulation-card p{font-size:var(--text-sm);color:var(--muted)}.simulation-card>div{flex:1}.simulation-card .button{font-size:var(--text-xs)}.read-only{font-size:var(--text-sm);color:var(--muted)}.read-only p{margin:0 0 12px}.facts dt{font-size:var(--text-xs);color:var(--muted);margin-top:16px}.facts dd{margin:3px 0;font-size:var(--text-sm)}
.create-layout{display:grid;grid-template-columns:minmax(0,760px) 270px;gap:24px}.create-layout .panel-body{padding-top:20px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.span-two{grid-column:1/-1}.form-actions{display:flex;justify-content:flex-end;gap:10px;border-top:1px solid var(--line);padding-top:20px}.customer-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.customer-card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:20px;transition:transform .15s,border-color .15s}.customer-card:hover{border-color:var(--line-hover);transform:translateY(-2px)}.customer-card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.company-avatar{width:42px;height:42px;background:var(--panel-selected);border-radius:10px;display:grid;place-items:center;font-weight:600;font-size:var(--text-md);color:var(--ink-accent)}.company-avatar.doctor{background:var(--bg-info);color:var(--ink-info)}.company-avatar.holding{background:var(--bg-critical);color:var(--ink-warning)}.customer-card h2{font-size:var(--text-lg)}.customer-card>p{font-size:var(--text-sm);color:var(--muted);margin-top:4px}.customer-card-bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:16px;margin-top:20px;font-size:var(--text-xs);color:var(--muted)}.customer-card-bottom strong{font-size:var(--text-lg);color:var(--ink);margin-right:4px}.customer-facts{display:grid;grid-template-columns:1fr .6fr 2fr;border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:20px;margin-bottom:24px;gap:20px}.customer-facts small{display:block;color:var(--muted);font-size:var(--text-xs)}.customer-facts strong{font-size:var(--text-sm);display:block;margin-top:6px;font-weight:600}.engagement-card{padding:24px;margin-top:20px}.engagement-card p{font-size:var(--text-sm);color:var(--muted);margin:10px 0}.engagement-card small{color:var(--muted)}.notice{background:var(--panel-soft);color:var(--muted);font-size:var(--text-sm);padding:12px 16px;border-radius:7px;margin-bottom:24px;border:1px solid var(--line)}.method-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.method-card{padding:24px}.method-card-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.method-symbol{font-size:var(--text-2xl);color:var(--ink-accent)}.method-card .eyebrow{margin-bottom:6px}.method-card>p:not(.eyebrow){font-size:var(--text-sm);color:var(--muted);margin-top:10px;line-height:1.8;max-width:450px}.method-checks{list-style:none;padding:0;margin:20px 0}.method-checks li{font-size:var(--text-sm);border-top:1px solid var(--line);padding:10px 0;color:var(--muted)}.method-checks li>span{margin-right:8px;color:var(--muted)}.method-checks small{display:block;font-size:var(--text-xs);margin-left:20px;color:var(--muted)}.method-card-footer{font-size:var(--text-xs);display:flex;justify-content:space-between;color:var(--muted);background:var(--panel-soft);padding:8px;border-radius:5px}.source-reference{display:block;color:var(--muted);margin-top:12px;font-size:var(--text-xs)}
.login-page{background:var(--panel-soft)}.login-layout{padding:0;margin:0;max-width:none;min-height:100vh;display:grid;grid-template-columns:1fr 1fr}.login-story{background:var(--strong);color:var(--ink-on-strong);padding:56px 64px;display:flex;flex-direction:column;justify-content:space-between;min-height:100vh}.login-story .brand{margin:0}.login-story .brand-symbol{background:var(--highlight);color:var(--strong)}.login-story h1{font-size:45px;letter-spacing:-1.5px;line-height:1.3;margin-bottom:20px}.login-story .eyebrow{color:var(--ink-on-strong-muted);font-size:var(--text-xs)}.login-story p:not(.eyebrow){color:var(--ink-on-strong-muted);max-width:360px;line-height:1.9;font-size:var(--text-md)}.login-story>small{color:var(--ink-on-strong-muted)}.login-decoration{display:flex;align-items:center;gap:16px;margin-top:48px;font-size:var(--text-xs);color:var(--ink-on-strong-muted)}.login-decoration span{border:1px solid var(--line-on-strong);padding:10px 16px;border-radius:6px}.login-decoration i{font-style:normal;color:var(--ink-on-strong-muted)}.login-form-panel{display:grid;place-items:center;padding:40px}.login-form-inner{width:100%;max-width:340px}.login-form-inner h2{font-size:var(--text-3xl);letter-spacing:-1px;margin-top:24px}.login-form-inner .lead{margin-bottom:28px}.login-form-inner .field{margin-bottom:20px}.login-form-inner .button{margin-top:8px;justify-content:space-between;font-size:var(--text-sm)}.login-demo{margin-top:28px;border-top:1px solid var(--line);padding-top:20px;color:var(--muted);font-size:var(--text-sm)}.login-demo strong{color:var(--muted);font-weight:500}.login-demo p{margin:8px 0 12px;line-height:1.9}.login-demo code{color:var(--ink-accent)}.login-demo small{font-size:var(--text-xs)}
@media(min-width:1550px){.dashboard-grid{grid-template-columns:minmax(0,1fr) 310px}.task-table td{padding-top:20px;padding-bottom:20px}.task-name a{max-width:360px;font-size:var(--text-sm)}.task-table td,.date-cell,.assignee{font-size:var(--text-sm)}.task-table th{font-size:var(--text-xs)}.badge{font-size:var(--text-xs)}.subline{font-size:var(--text-xs)}}
@media(max-width:1200px){:root{--sidebar:212px}main{padding:24px 24px 16px}.topbar{padding:0 24px}.sidebar{padding-left:16px;padding-right:16px}.dashboard-grid{grid-template-columns:minmax(0,1fr) 245px;gap:16px}.panel-heading{padding-left:16px;padding-right:16px}.task-table td,.task-table th{padding-left:8px;padding-right:8px}.task-table td:first-child,.task-table th:first-child{padding-left:16px}.task-name>div{min-width:142px}.task-name{gap:6px}.task-name a{max-width:200px}.task-table .assignee{font-size:0}.metric{padding:16px}.automation-banner{padding:20px}.automation-mark{display:none}.customer-grid{grid-template-columns:1fr 1fr}.detail-grid{grid-template-columns:minmax(0,1fr) 275px}.simulation-card{flex-direction:column;align-items:flex-start}.create-layout{grid-template-columns:minmax(0,1fr) 220px}}
@media(max-width:1000px){.dashboard-grid{grid-template-columns:1fr}.side-column{display:grid;grid-template-columns:1fr 1fr;align-items:start}.detail-grid .side-column{display:flex}.task-table .assignee{font-size:var(--text-xs)}.detail-grid{grid-template-columns:minmax(0,1fr) 270px}.metric{padding:16px}.metric-label{font-size:var(--text-xs)}.metric>strong{font-size:var(--text-3xl)}.task-name a{max-width:260px}.create-layout{grid-template-columns:1fr}.create-layout>.method-note{display:none}.login-story{padding:48px 32px}.login-story h1{font-size:var(--text-3xl)}.login-decoration{gap:8px}.login-decoration span{padding:8px}}
@media(max-width:760px){:root{--sidebar:0px}.sidebar{position:static;width:auto;padding:16px 16px;display:block;border-right:0;border-bottom:1px solid var(--line)}.brand{font-size:23px;margin:0}.brand-symbol{height:34px;width:34px;font-size:30px}.brand-sub{font-size:var(--text-xs);letter-spacing:2.9px;margin-top:4px}.workspace-switch,.nav-label,.sidebar-bottom{display:none}.sidebar nav{display:flex;gap:4px;margin-top:16px;overflow:auto}.nav-item{margin:0;padding:8px 10px;white-space:nowrap;font-size:var(--text-sm);gap:6px}.nav-icon{font-size:var(--text-lg);width:14px}.topbar{height:49px;padding:0 16px}.date{display:none}main{padding:24px 16px 16px}h1{font-size:var(--text-3xl)}.page-heading{align-items:flex-start;gap:12px;margin-bottom:20px}.page-heading .button{padding:8px 10px;font-size:var(--text-xs)}.eyebrow{font-size:var(--text-xs)}.lead{font-size:var(--text-sm)}.metrics{grid-template-columns:1fr 1fr;gap:10px}.metric{min-height:127px}.metric-label{font-size:var(--text-xs)}.side-column{grid-template-columns:1fr 1fr;gap:12px}.task-table{min-width:580px}.panel-heading h2{font-size:var(--text-lg)}.text-link{font-size:var(--text-xs)}.automation-banner{flex-wrap:wrap}.automation-banner .button{margin-left:0}.detail-grid{display:flex;flex-direction:column}.detail-grid>.main-column,.detail-grid>.side-column{width:100%}.detail-heading h1{font-size:var(--text-2xl)}.detail-heading .badge{align-self:flex-start;font-size:var(--text-xs)}.detail-heading{flex-direction:column}.panel-body{padding:0 16px 16px}.customer-grid{gap:12px}.customer-card{padding:16px}.customer-card-top{flex-wrap:wrap;gap:10px}.customer-card h2{font-size:var(--text-md)}.customer-facts{grid-template-columns:1fr 1fr;padding:16px}.customer-facts>div:last-child{grid-column:1/-1}.method-grid{grid-template-columns:1fr}.filter-bar select{flex:1;min-width:125px}.filter-bar .search-field{flex-basis:100%}.page-footer{font-size:var(--text-xs);gap:16px}.form-grid{grid-template-columns:1fr}.span-two{grid-column:auto}.login-layout{display:flex;min-height:100vh;flex-direction:column}.login-story{min-height:auto;padding:24px;gap:32px}.login-story h1{font-size:var(--text-2xl);margin-bottom:12px}.login-story>small,.login-decoration{display:none}.login-story p:not(.eyebrow){font-size:var(--text-sm)}.login-form-panel{padding:32px 24px}.login-form-inner{max-width:450px}.skip-link{left:15px}}
@media(max-width:440px){.side-column{display:flex}.customer-grid{grid-template-columns:1fr}.page-heading .button{min-width:88px}.nav-item{padding:8px;font-size:var(--text-xs)}.nav-icon{display:none}.topbar-right{gap:8px}.page-footer{flex-direction:column;gap:4px}.check-row{gap:8px}.check-row strong{font-size:var(--text-sm)}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* Keep choice controls compact and align wrapped labels across all forms. */
input:is([type=checkbox],[type=radio]) {
  width:18px;
  height:18px;
  min-height:18px;
  margin:0.2em 0 0;
  padding:0;
  flex:0 0 18px;
  accent-color:var(--strong);
}
/* Django as_p and the shared field template render label and input as siblings. */
:is(.stack-form p,.field):has(> input[type=checkbox]) {
  display:grid;
  grid-template-columns:18px minmax(0,1fr);
  align-items:start;
  column-gap:10px;
}
:is(.stack-form p,.field):has(> input[type=checkbox]) > input[type=checkbox] {
  grid-column:1;
  grid-row:1;
}
:is(.stack-form p,.field):has(> input[type=checkbox]) > label {
  grid-column:2;
  grid-row:1;
  margin:0;
  min-width:0;
  cursor:pointer;
}
:is(.stack-form p,.field):has(> input[type=checkbox]) > :is(.helptext,small,.errorlist) {
  grid-column:2;
}
/* Choice groups and consent fields wrap the control inside its label. */
label:has(> input:is([type=checkbox],[type=radio])) {
  display:grid;
  grid-template-columns:18px minmax(0,1fr);
  align-items:start;
  gap:10px;
  cursor:pointer;
}
.organization-switch{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;margin:-16px 0 20px}.organization-switch label{grid-column:1/-1;font-size:var(--text-sm);font-weight:600}.organization-switch select{width:100%;min-width:0;padding:8px 6px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink);font:inherit;font-size:var(--text-sm)}.organization-switch .button{padding:8px;font-size:var(--text-sm)}.sidebar{overflow-y:auto}@media(max-width:760px){.organization-switch{max-width:330px;margin:16px 0 0}}

/* Secondary destinations remain available without competing with daily work. */
.nav-group{margin:10px 0}.nav-group>summary{padding:10px 12px;cursor:pointer;font-size:var(--text-sm);color:var(--muted);list-style-position:inside}.nav-group[open]>summary{font-weight:600}.nav-group .nav-item{font-size:var(--text-sm);padding-left:20px}.nav-group:has(.active)>summary{color:var(--ink);font-weight:600}.customer-journey-actions{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0}.customer-journey-actions .button{font-size:var(--text-md);min-height:42px}.engagement-card+.panel{margin-top:20px}@media(max-width:760px){.sidebar nav{flex-wrap:wrap;overflow:visible}.nav-group{margin:0}.nav-group>summary{font-size:var(--text-sm);padding:8px}.nav-group[open]{flex-basis:100%}.nav-group .nav-item{display:inline-flex}.customer-journey-actions .button{font-size:var(--text-sm)}}
.sidebar-head,.sidebar-menu{display:contents}.menu-toggle,.mobile-context{display:none}
@media(max-width:760px){.topbar{display:none}.sidebar{position:sticky;top:0;z-index:20;max-height:100vh;overflow-y:auto;padding:10px 16px;background:var(--panel)}.sidebar-head{display:flex;align-items:center;gap:12px}.sidebar .brand{font-size:20px;gap:8px;flex-shrink:0}.sidebar .brand-symbol{width:32px;height:32px;font-size:27px;border-radius:9px;padding-bottom:4px}.sidebar .brand-sub{display:none}.mobile-context{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0;flex:1;font-size:var(--text-sm);line-height:1.2}.mobile-context strong{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.mobile-context .environment{font-size:var(--text-xs);padding:2px 6px}.menu-toggle{display:inline-flex;align-items:center;gap:8px;flex-shrink:0;min-height:40px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--ink);font:inherit;font-size:var(--text-md);font-weight:600;cursor:pointer}.menu-toggle-icon{width:14px;height:2px;background:currentColor;box-shadow:0 -5px 0 currentColor,0 5px 0 currentColor}.sidebar.menu-open .menu-toggle-icon{height:2px;box-shadow:none;transform:rotate(45deg)}.sidebar.menu-open .menu-toggle-icon::after{content:"";display:block;width:14px;height:2px;background:currentColor;transform:rotate(90deg)}.sidebar-menu{display:block;padding:12px 0 4px}.js .sidebar:not(.menu-open) .sidebar-menu{display:none}.sidebar .organization-switch{max-width:none;margin:0 0 12px}.sidebar .organization-switch select,.sidebar .organization-switch .button{font-size:var(--text-md);padding:8px 10px}.sidebar nav{flex-direction:column;flex-wrap:nowrap;gap:2px;margin-top:0;overflow:visible}.sidebar .nav-item,.sidebar .nav-group .nav-item{display:flex;padding:10px 10px;font-size:var(--text-md);gap:12px;white-space:normal}.sidebar .nav-icon{display:inline-block;font-size:var(--text-lg);width:18px}.sidebar .nav-group{margin:0}.sidebar .nav-group>summary{padding:10px 10px;font-size:var(--text-md)}.sidebar .nav-group .nav-item{padding-left:24px}.sidebar-bottom{display:block;padding-top:8px}.sidebar-bottom .demo-note{display:none}.sidebar-user{margin-top:4px;padding-top:12px}.sidebar .logout{font-size:var(--text-md);padding:10px 2px}main{padding:16px 16px 16px}.page-heading{flex-wrap:wrap}.page-heading>div{min-width:0}.page-heading .form-actions,.page-heading>div:last-child:not(:first-child){display:flex;flex-wrap:wrap;gap:8px}}
.table-scroll{position:relative}
@media(max-width:440px){h1{font-size:var(--text-2xl);letter-spacing:-.8px}}
a.workspace-switch{color:inherit;text-decoration:none;transition:background .15s,border-color .15s}a.workspace-switch:hover{background:var(--panel-sunken);border-color:var(--line-strong)}a.workspace-switch.active{border-color:var(--strong);background:var(--panel-sunken)}.workspace-go{font-size:var(--text-xl);color:var(--muted);line-height:1}.topbar a.muted{text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:3px}.topbar a.muted:hover{text-decoration-color:currentColor}.mobile-context a:hover{text-decoration:underline}.mobile-context a{color:inherit;max-width:100%;text-decoration:none}
@media(max-width:760px){.sidebar .workspace-switch{display:flex;margin:0 0 12px;font-size:var(--text-md)}.sidebar .workspace-switch span span{font-size:var(--text-sm)}}
/* Shared form pieces. A long form ends in a bar that stays in view: what is still missing, what is saved, and the one button. */
.save-bar{position:sticky;bottom:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px 16px;margin-top:20px;padding:12px 0;background:var(--panel);border-top:1px solid var(--line);box-shadow:0 -9px 18px var(--fade)}
.save-bar-text{display:grid;gap:8px;min-width:0}.save-bar-text .form-alert{margin:0}
.save-state{margin:0;font-size:var(--text-sm);color:var(--muted)}.save-state strong{display:block;color:var(--ink)}
.save-state [data-kind=saved],.save-state [data-kind=done],.save-state[data-kind=saved]{color:var(--ink-success)}.save-state [data-kind=error],.save-state[data-kind=error]{color:var(--ink-critical)}.save-state [data-kind=busy],.save-state[data-kind=busy]{color:var(--ink-warning)}
.stack-form .note-field{margin-top:8px;padding-top:16px;border-top:1px solid var(--line)}
@media(max-width:700px){.save-bar{gap:10px}.save-bar .button{flex:0 0 auto;max-width:48%;white-space:normal;line-height:1.25}.save-state{font-size:var(--text-sm)}}

/* On a phone the task's status and owner come before its history, not after it. */
@media(max-width:760px){.task-grid>.main-column{display:contents}.task-grid>.side-column{order:1}.task-grid .task-history{order:2}}

/* The component page (/komponenter/): every shared piece with its states. */
.component-index{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px}
.component-index a{font-size:var(--text-sm);padding:6px 12px;border:1px solid var(--line);border-radius:999px;background:var(--panel)}
.component-index a:hover{border-color:var(--line-hover)}
.component-section{margin-bottom:24px;scroll-margin-top:16px}
.component-heading{margin:0 0 16px}
.component-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:16px}
.component-stack{display:grid;gap:24px;padding-top:20px}
.component-states{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.component-states>div{padding:12px;border:1px solid var(--line);border-radius:8px}
.component-state{display:block;color:var(--muted);margin-bottom:4px}
.component-subtitle{margin:24px 0 12px}
.component-save-bar{position:static;box-shadow:none}
.component-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;align-items:start}
.component-cards .customer-card h2,.component-cards .panel h2{margin:0}
.component-example{display:grid;gap:8px;padding-top:16px;border-top:1px solid var(--line)}
.type-scale{display:grid;gap:12px;margin-bottom:20px}
.type-scale>div{display:grid;grid-template-columns:160px minmax(0,1fr);gap:16px;align-items:baseline;padding-bottom:12px;border-bottom:1px solid var(--line)}
.type-scale code{font-size:var(--text-xs);color:var(--muted)}
.type-sample{font-weight:400}
.type-3xl{font-size:var(--text-3xl);font-weight:600;line-height:1.2;letter-spacing:-.5px}
.type-2xl{font-size:var(--text-2xl);font-weight:600;line-height:1.25;letter-spacing:-.3px}
.type-xl{font-size:var(--text-xl);font-weight:600;line-height:1.3}
.type-lg{font-size:var(--text-lg);font-weight:600;line-height:1.4}
.type-md{font-size:var(--text-md)}
.type-sm{font-size:var(--text-sm)}
.type-xs{font-size:var(--text-xs)}
.type-weight-400{font-weight:400}
.type-weight-500{font-weight:500}
.type-weight-600{font-weight:600}
.inline-link{text-decoration:underline;text-underline-offset:2px}
@media(max-width:760px){.type-scale>div{grid-template-columns:1fr;gap:4px}
}

/* One type scale (--text-xs … --text-3xl in :root). On a phone a field is 16 px, so iOS does not zoom in when it gets focus. */
.message .text-button{color:var(--ink)}
@media(max-width:760px){input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:var(--text-lg)!important}
}
.component-form .call-group{margin-bottom:16px}
.handover-preview{margin-top:16px}.handover-preview summary{cursor:pointer;font-size:var(--text-sm);font-weight:600}.handover-text{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;font-size:var(--text-sm);line-height:1.7;background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:12px;margin-top:8px}