/*!
 * Copyright © 2026 Roy Jonskås. Alle rettigheter reservert.
 * Proprietær programvare – se LICENSE for vilkår.
 * Uautorisert kopiering, distribusjon eller modifikasjon er forbudt.
 */
:root{--bg:#f5f5f7;--card:#fff;--text:#1d1d1f;--muted:#6e6e73;--line:#d2d2d7;--blue:#0071e3;--danger:#b42318}
*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}
header{position:sticky;top:0;background:rgba(245,245,247,.92);backdrop-filter:blur(20px);border-bottom:1px solid var(--line);z-index:10}.shell{max-width:1100px;margin:auto;padding:0 18px}.header-inner{min-height:72px;display:flex;align-items:center;justify-content:space-between}
main{padding-top:18px;padding-bottom:60px}.card,.metric,.panel{background:var(--card);border:1px solid var(--line);border-radius:22px}.card{padding:20px;margin-bottom:16px}.panel{padding:16px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
h1,h2,h3{margin:4px 0 12px}.grid{display:grid;gap:14px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.room-fields{grid-template-columns:1fr 110px}
label{display:block;font-size:13px;font-weight:700;margin:10px 0 6px}input,select,textarea{width:100%;padding:13px;border:1px solid var(--line);border-radius:13px;background:#fff;color:var(--text);font:inherit}textarea{resize:vertical}.field-help{font-size:12px;color:var(--muted);margin-top:5px}
button{border:0;background:var(--blue);color:white;padding:12px 15px;border-radius:13px;font-weight:750;cursor:pointer}button:hover{filter:brightness(.97)}button.secondary{background:#fff;color:var(--text);border:1px solid var(--line)}button.link{background:transparent;color:var(--blue)}button.danger{background:#ffe7e5;color:var(--danger)}
.actions{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin-top:14px}.actions.end{justify-content:flex-end}.hidden{display:none!important}.muted{color:var(--muted)}.hero,.toolbar,.dialog-head,.section-head{display:flex;justify-content:space-between;gap:14px;align-items:center}
.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}.metric{padding:17px}.metric span{display:block;color:var(--muted);font-size:13px}.metric strong{display:block;font-size:24px;margin-top:5px}.toolbar{align-items:stretch}.toolbar input{flex:1}.toolbar select{width:210px}.checks{margin-top:10px;font-size:13px;line-height:1.7}.ok{color:#16794a}.bad{color:#b42318}
.room-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}.room-card{position:relative;border:1px solid var(--line);border-radius:18px;padding:16px;background:linear-gradient(180deg,#fff,#fafafa);cursor:pointer;min-height:145px;display:flex;flex-direction:column;justify-content:space-between}.room-card:hover{border-color:#aeb8c4;transform:translateY(-1px)}.room-icon{font-size:34px}.room-icon-image{display:block;width:34px;height:34px;object-fit:cover;border-radius:50%}.room-name{font-size:19px;font-weight:800;margin-top:8px}.room-stats{font-size:13px;color:var(--muted);line-height:1.5}.room-edit{position:absolute;right:10px;top:10px;background:#fff;color:var(--text);border:1px solid var(--line);padding:7px 10px;border-radius:10px}
.room-icon-field{min-width:0}.room-icon-choices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:10px}.room-icon-choice{display:flex;flex-direction:column;align-items:center;gap:4px;min-height:68px;padding:7px 3px;border:1px solid var(--line);border-radius:11px;background:#fff;color:var(--text);font-size:10px;font-weight:700;line-height:1.1}.room-icon-choice:hover{border-color:#082c62;background:#f3f7fc}.room-icon-choice.selected{border-color:#082c62;box-shadow:0 0 0 2px rgba(8,44,98,.18);background:#eef5ff}.room-icon-choice:focus-visible{outline:2px solid #082c62;outline-offset:2px}.room-icon-choice-image{display:block;width:31px;height:31px;border-radius:50%}.active-room-icon{display:inline-block;width:24px;height:24px;vertical-align:middle;margin-right:5px;border-radius:50%}
.item{display:grid;grid-template-columns:82px 1fr auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}.thumb{width:82px;height:82px;border-radius:16px;object-fit:cover;background:#eee}.item-title{font-weight:800;font-size:18px}.item-meta{font-size:13px;color:var(--muted);margin-top:4px}.empty{text-align:center;padding:40px;color:var(--muted)}.empty.compact{padding:22px}
dialog{border:0;background:transparent;width:min(760px,calc(100% - 20px));max-width:none}dialog::backdrop{background:rgba(0,0,0,.5)}.dialog-card{background:#fff;border-radius:22px;padding:20px;max-height:90vh;overflow:auto}.icon{background:#fff;color:var(--text);border:1px solid var(--line);width:40px;height:40px;border-radius:999px;font-size:24px;padding:0}.file-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;margin-top:10px}.file-card{border:1px solid var(--line);border-radius:12px;padding:8px}.file-card img{width:100%;height:80px;object-fit:cover;border-radius:8px}
@media(max-width:760px){.grid.two,.metrics,.room-fields{grid-template-columns:1fr}.toolbar,.hero,.section-head{flex-direction:column;align-items:stretch}.toolbar select{width:100%}.item{grid-template-columns:64px 1fr}.thumb{width:64px;height:64px}.item button{grid-column:1/-1}.room-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.room-grid{grid-template-columns:1fr}}

/* HjemArkiv 3.1.1 */
.active-room{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;margin-bottom:14px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(135deg,#f7fbff,#fff)}
.active-room h2{margin-bottom:4px}.items-card{scroll-margin-top:88px}.item-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px;margin-top:8px}.item-grid .item{display:grid;grid-template-columns:110px 1fr;grid-template-rows:auto auto;gap:14px;border:1px solid var(--line);border-radius:18px;padding:12px;background:#fff}.item-grid .thumb{width:110px;height:110px;grid-row:1/3}.item-grid .item>button{grid-column:2;justify-self:start}.item-grid .item-title{font-size:19px}.room-card{transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}.room-card:hover{box-shadow:0 8px 24px rgba(0,0,0,.06)}
@media(max-width:760px){.active-room{align-items:stretch;flex-direction:column}.item-grid{grid-template-columns:1fr}.item-grid .item{grid-template-columns:92px 1fr}.item-grid .thumb{width:92px;height:92px}}

/* HjemArkiv 3.1.2 – bilder og dokumenter */
.attachments-section{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}.section-title{display:flex;justify-content:space-between;align-items:end;gap:12px}.upload-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:10px 0 14px}.upload-box{margin:0;border:1px dashed #a7b4c2;border-radius:16px;padding:14px;text-align:center;background:#f8fbff;cursor:pointer;display:flex;flex-direction:column;gap:4px}.upload-box:hover{border-color:var(--blue);background:#f1f7ff}.upload-box span{font-size:28px}.upload-box small{color:var(--muted)}.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important}.file-grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));align-items:stretch}.file-card{padding:8px;display:flex;flex-direction:column;gap:8px;background:#fff}.file-card.primary-file{border-color:var(--blue);box-shadow:0 0 0 1px var(--blue)}.file-open,.doc-preview{padding:0;background:transparent;color:var(--text);border:0;width:100%}.file-open img{width:100%;height:130px;object-fit:cover;border-radius:10px}.doc-preview{height:130px;border-radius:10px;background:#f3f4f6;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:12px}.doc-preview span{font-size:36px}.doc-preview strong{font-size:12px;overflow-wrap:anywhere}.file-info{display:flex;justify-content:space-between;gap:6px;align-items:center;font-size:11px}.file-kind,.primary-badge{padding:4px 7px;border-radius:999px;background:#eef1f4;color:var(--muted)}.primary-badge{background:#e7f2ff;color:#005bb5}.file-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto}.small{padding:7px 8px;border-radius:9px;font-size:11px}
@media(max-width:760px){.upload-grid{grid-template-columns:1fr}.section-title{align-items:flex-start;flex-direction:column}.file-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:420px){.file-grid{grid-template-columns:1fr}}

/* Isolated local demo mode */
.demo-login-btn{background:#eef8dc!important;color:#164b2a!important;border:2px solid #76aa2c!important;display:flex;align-items:center;justify-content:center;gap:8px}
.demo-login-btn:hover,.demo-login-btn:focus-visible{background:#dff3bd!important;border-color:#4b7f1b!important}
.demo-login-btn:focus-visible,.demo-exit-btn:focus-visible{outline:3px solid #9be63f;outline-offset:3px}
.demo-banner{display:flex;align-items:center;gap:12px;margin:0 0 16px;padding:12px 16px;border:2px solid #3d7a14;border-radius:16px;background:#effbdc;color:#173b1c;box-shadow:0 6px 18px rgba(23,70,20,.1)}
.demo-banner-mark{display:grid;place-items:center;width:30px;height:30px;flex:none;border-radius:9px;background:#28651d;color:#fff;font-weight:900}
.demo-banner-copy{display:flex;flex:1;flex-direction:column;gap:2px;min-width:0}
.demo-banner-copy strong{font-size:14px;letter-spacing:.01em}
.demo-banner-copy span{font-size:12px;color:#315c35}
.demo-exit-btn{background:#fff!important;color:#164b2a!important;border:1px solid #6e9c4b!important;white-space:nowrap;padding:8px 11px!important}
.demo-guard-note{margin:8px 0;padding:10px 12px;border-radius:11px;background:#fff7df;border:1px solid #e2bd56;color:#684b00;font-size:13px}
body.demo-active .demo-only-hidden{display:none!important}
body.demo-active .demo-disabled{opacity:.6;cursor:not-allowed}
body.demo-active .img-type-select,body.demo-active .file-actions,
body.demo-active .file-type-row,body.demo-active .policy-doc-type-sel,
body.demo-active .policy-doc-del,body.demo-active #pdlgDocTypeRow{display:none!important}
@media(max-width:600px){
  .demo-banner{align-items:flex-start;padding:10px 11px}
  .demo-banner-copy span{font-size:11px}
  .demo-exit-btn{padding:7px 8px!important;font-size:11px}
}

/* HjemArkiv 3.1.2 */
.active-room-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px;padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:#f7f9fc}
.active-room-bar.hidden{display:none}
.attachments-section{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.section-title{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:12px}
.section-title h3{margin:2px 0 0}
.upload-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:16px}
.upload-box{display:flex;min-height:118px;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:5px;padding:14px;border:1.5px dashed #b8bec8;border-radius:16px;background:#fafbfc;cursor:pointer}
.upload-box:hover{border-color:#0877e6;background:#f3f8ff}
.upload-box span{font-size:28px}.upload-box small{color:var(--muted)}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important}
.file-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.file-card{border:1px solid var(--line);border-radius:15px;padding:10px;background:#fff;overflow:hidden}
.file-card.primary-file{box-shadow:inset 0 0 0 2px #0877e6}
.file-open,.doc-preview{width:100%;height:135px;border:0;border-radius:10px;overflow:hidden;background:#f2f3f5;padding:0;cursor:pointer}
.file-open img{width:100%;height:100%;object-fit:cover;display:block}
.doc-preview{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:12px}.doc-preview span{font-size:34px}.doc-preview strong{font-size:13px;word-break:break-word}
.file-info{display:flex;flex-wrap:wrap;gap:6px;margin:9px 0}.file-kind,.primary-badge{font-size:12px;border-radius:999px;padding:4px 8px;background:#eef1f5}.primary-badge{background:#e5f1ff;color:#0068c9}
.file-actions{display:flex;flex-wrap:wrap;gap:6px}.small{font-size:12px;padding:7px 9px}
@media(max-width:700px){.upload-grid{grid-template-columns:1fr}.active-room-bar{align-items:flex-start;flex-direction:column}.active-room-bar button{width:100%}}

/* HjemArkiv 3.2.0 – Dashboard */
.dashboard-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:4px 0 14px}.dashboard-head h2{margin-bottom:0}.dashboard-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.metric{min-height:118px;display:flex;flex-direction:column;justify-content:center}.metric small{display:block;color:var(--muted);font-size:11px;margin-top:5px}.metric-primary{background:linear-gradient(135deg,#eef7ff,#fff);border-color:#b9d9f7}.metric-primary strong{color:#005eb8}.dashboard-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:16px}.dashboard-panel{margin-bottom:0;min-width:0}.compact-head{margin-bottom:8px}.compact-head h2{font-size:19px;margin-bottom:0}.mini-list{display:flex;flex-direction:column}.mini-row{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid #ececef;cursor:pointer}.mini-row:last-child{border-bottom:0}.mini-thumb{width:48px;height:48px;border-radius:12px;object-fit:cover;background:#edf0f3;display:flex;align-items:center;justify-content:center;font-size:21px}.mini-title{font-size:14px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-meta{font-size:11px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-value{font-size:12px;font-weight:800;text-align:right}.compact-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;padding:6px 0;border-bottom:1px solid #ececef;cursor:pointer}.compact-row:last-child{border-bottom:0}.compact-row:hover .mini-title{color:var(--accent,#1a73e8)}.compact-row .mini-title{font-size:13px}.compact-row .mini-meta{font-size:11px;margin-top:1px}.compact-row .mini-value{font-size:12px;font-weight:800;text-align:right;white-space:nowrap}.mini-row button{display:contents;color:inherit;text-align:left}.warranty-status{display:inline-flex;border-radius:999px;padding:3px 7px;font-size:10px;font-weight:800}.warranty-soon{background:#fff3d6;color:#8a5a00}.warranty-expired{background:#ffe8e5;color:#a02b21}.warranty-ok{background:#e7f6ed;color:#176c42}
@media(max-width:900px){.dashboard-grid{grid-template-columns:1fr 1fr}.warranty-panel{grid-column:1/-1}}
@media(max-width:760px){.dashboard-head{align-items:stretch;flex-direction:column}.dashboard-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-grid{grid-template-columns:1fr}.warranty-panel{grid-column:auto}}
@media(max-width:440px){.dashboard-metrics{grid-template-columns:1fr}.metric{min-height:100px}}

/* Nav warranty notification dot */
.nav-warranty-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#e53e3e;margin-left:4px;vertical-align:middle;flex-shrink:0;position:relative;top:-1px}

/* HjemArkiv 4.0 */
:root{--glass:rgba(255,255,255,.88);--shadow:0 16px 44px rgba(24,39,75,.08)}
body{padding-bottom:84px;background:radial-gradient(circle at 10% 0,#eef6ff 0,transparent 34%),#f5f5f7}
header{backdrop-filter:blur(16px);background:rgba(245,245,247,.82);position:sticky;top:0;z-index:30}
.app-nav{position:sticky;top:68px;z-index:29;background:rgba(245,245,247,.9);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.app-nav-inner{display:flex;justify-content:center;gap:6px;padding:8px 0}
.nav-tab{background:transparent;color:var(--muted);border:0;border-radius:14px;padding:8px 15px;display:flex;align-items:center;gap:7px}
.nav-tab span{font-size:19px}.nav-tab strong{font-size:12px}.nav-tab.active{background:#fff;color:var(--text);box-shadow:0 4px 18px rgba(0,0,0,.07)}
.nav-tab.smart-tab{color:#006de0}.app-section{display:none}.app-section.active-view{display:block;animation:viewIn .22s ease}
@keyframes viewIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.welcome-card{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:4px 0 16px;padding:26px 28px;border-radius:26px;color:#fff;background:linear-gradient(135deg,#0877e6,#6457ed);box-shadow:0 18px 50px rgba(44,103,220,.2)}
.welcome-card h2{font-size:28px;margin:3px 0}.welcome-card p{margin:0;color:rgba(255,255,255,.82)}.welcome-card .eyebrow{color:rgba(255,255,255,.72)}
.smart-primary{background:#fff;color:#075fbd;white-space:nowrap}.card{box-shadow:var(--shadow)}
.section-intro{display:flex;justify-content:space-between;align-items:end;margin:26px 0 14px}.section-intro h2{font-size:28px}.section-intro p{color:var(--muted);margin:5px 0 0}
.docs-back-btn{flex-shrink:0;align-self:center;white-space:nowrap}
.document-list{display:flex;flex-direction:column}.document-row{display:grid;grid-template-columns:56px 1fr auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}.document-row:last-child{border:0}.document-icon{width:56px;height:56px;border-radius:15px;background:#eef4fb;display:flex;align-items:center;justify-content:center;font-weight:900;color:#d13b32}.document-row strong,.document-row small{display:block}.document-row small{color:var(--muted);margin-top:3px}
.smart-hero{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:22px;margin-top:24px;padding:30px}.smart-orb{width:78px;height:78px;border-radius:24px;display:flex;align-items:center;justify-content:center;font-size:38px;color:#fff;background:linear-gradient(135deg,#0877e6,#8e5cff);box-shadow:0 14px 30px rgba(77,77,220,.22)}
.smart-hero h2{font-size:28px}.smart-hero p{color:var(--muted);margin-bottom:0}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.feature-grid article{padding:22px;border-radius:20px;background:#f8fafc}.feature-grid article span{font-size:30px}.feature-grid h3{margin:10px 0 5px}.feature-grid p{margin:0;color:var(--muted);font-size:14px;line-height:1.5}
.settings-list{display:flex;flex-direction:column;gap:3px}.settings-list>div{display:grid;grid-template-columns:42px 1fr;gap:12px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}.settings-list>div>span{font-size:25px}.settings-list strong,.settings-list small{display:block}.settings-list small{color:var(--muted);margin-top:3px}.settings-list>button{margin-top:14px;align-self:flex-start}
.privacy-security-card{display:flex;flex-direction:column;gap:18px}
.privacy-security-summary{display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px;align-items:start}
.privacy-security-mark{width:42px;height:42px;display:grid;place-items:center;border:1px solid #b9d9c5;border-radius:13px;background:#edf8f1;font-size:22px;line-height:1}
.privacy-security-summary h3,.privacy-documents h3{margin:0 0 6px;font-size:17px}
.privacy-security-summary p{margin:0;color:var(--muted);font-size:14px;line-height:1.55}
.privacy-security-summary p+p{margin-top:8px}
.privacy-documents{border-top:1px solid var(--line);padding-top:15px}
.privacy-document-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.privacy-document-row{display:grid;grid-template-columns:30px minmax(0,1fr);gap:9px;align-items:start;padding:11px 12px;border:1px solid var(--line);border-radius:13px;background:var(--bg)}
.privacy-document-row>span{font-size:20px;line-height:1.2}
.privacy-document-row strong,.privacy-document-row small{display:block}
.privacy-document-row strong{font-size:13px}
.privacy-document-row small{margin-top:3px;color:var(--muted);font-size:12px;line-height:1.35}
.smart-dialog-card{max-width:760px;margin:auto}.smart-capture{margin:10px 0}.smart-photo-box{min-height:210px;border:2px dashed #a9b7c8;border-radius:22px;background:#f6f9fd;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer}.smart-photo-box span{font-size:44px}.smart-photo-box small{color:var(--muted)}.smart-preview{width:100%;max-height:300px;object-fit:contain;border-radius:22px;background:#111}.smart-status{padding:11px 13px;margin:10px 0 16px;border-radius:12px;background:#eef6ff;color:#075fbd;font-size:13px}.inline-field{display:flex;gap:8px;flex-wrap:wrap}.inline-field input{min-width:0;flex:1 1 120px}.barcode-status{margin-top:6px;padding:7px 11px;border-radius:10px;font-size:12px;font-weight:600;line-height:1.4}.barcode-status-loading{background:#eef6ff;color:#075fbd}.barcode-status-ok{background:#edf8f1;color:#176c42}.barcode-status-miss{background:#fdf6e3;color:#7a5c00}.barcode-status-error{background:#fff0f0;color:#b00020}.privacy-note{margin-top:15px;padding:12px;border-radius:12px;background:#edf8f1;color:#176c42;font-size:13px}
/* HjemArkiv 4.1.1a */
h1{font-size:26px;letter-spacing:-.01em}h2{font-size:22px;letter-spacing:-.01em}
.card{padding:24px;border-radius:26px}
.boot-error{margin:16px 0;padding:18px 20px;border-radius:18px;background:#fff3f3;border:1px solid #f5c6c6;color:#8b1a1a}
.boot-error strong{display:block;font-size:15px;margin-bottom:4px}.boot-error p{margin:0;font-size:13px;color:#a02b21}
.quick-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:0 0 20px}
.quick-action{background:#fff;color:var(--text);border:1px solid var(--line);border-radius:20px;padding:18px 10px;display:flex;flex-direction:column;align-items:center;gap:8px;box-shadow:0 4px 14px rgba(0,0,0,.05);transition:box-shadow .15s,transform .15s}
.quick-action:hover{box-shadow:0 8px 24px rgba(0,0,0,.10);transform:translateY(-2px)}
.quick-action span{font-size:28px;line-height:1}.quick-action strong{font-size:12px;font-weight:700;text-align:center;color:var(--text)}
.dashboard-room-entry-icon{display:block;width:64px;height:64px;border-radius:16px;object-fit:cover;flex-shrink:0}
.dashboard-room-entry strong{color:#27762d}
.dashboard-room-entry:focus-visible{outline:3px solid #27762d;outline-offset:3px}
.system-status{background:#fafbfc}
.settings-invite-row{grid-template-columns:42px 1fr auto!important;align-items:center}
.settings-invite-actions{display:flex;gap:8px;flex-shrink:0}
@media(max-width:600px){.settings-invite-row{grid-template-columns:42px 1fr!important;flex-wrap:wrap}.settings-invite-actions{grid-column:2;padding-bottom:8px}}
@media(max-width:600px){.quick-actions{grid-template-columns:repeat(2,1fr)}}
/* HjemArkiv 4.1.1b */
.hero{padding:14px 22px!important}
.hero h2{font-size:19px;margin:2px 0 4px}
.metric-icon{font-size:20px;line-height:1;margin-bottom:3px}
.metric strong{font-size:27px}
.heading-icon{margin-right:6px;font-size:.82em;vertical-align:-.05em}
.dashboard-head{margin:8px 0 18px}
.quick-actions{margin:0 0 26px}
.dashboard-grid{gap:16px;margin-bottom:28px}
.dashboard-panel{transition:box-shadow .2s ease,transform .2s ease}
.dashboard-panel:hover{box-shadow:0 20px 50px rgba(24,39,75,.13);transform:translateY(-2px)}
.metric{transition:box-shadow .2s ease,transform .2s ease}
.metric:hover{box-shadow:0 10px 28px rgba(24,39,75,.10);transform:translateY(-1px)}
.quick-action{transition:box-shadow .18s ease,transform .18s ease,border-color .18s ease}
.quick-action:hover{box-shadow:0 14px 34px rgba(0,0,0,.13);transform:translateY(-3px);border-color:#b0c4dc}
.nav-tab.active{color:var(--blue);box-shadow:0 4px 22px rgba(0,113,227,.15)}
.version-info{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--muted)}
.version-info strong{color:var(--text);font-weight:700}
/* HjemArkiv 4.2.0 – Smart Dashboard */
.smart-db-search{position:relative;margin:18px 0 20px}
.smart-db-search input{width:100%;padding:15px 18px 15px 50px;font-size:15px;border-radius:18px;border:1.5px solid var(--line);background:#fff;box-shadow:0 4px 16px rgba(0,0,0,.06);transition:border-color .15s,box-shadow .15s}
.smart-db-search input:focus{outline:0;border-color:var(--blue);box-shadow:0 4px 20px rgba(0,113,227,.14)}
.smart-db-search::before{content:'🔍';position:absolute;left:16px;top:50%;transform:translateY(-50%);font-size:17px;pointer-events:none}
.search-results{position:absolute;top:calc(100% + 8px);left:0;right:0;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 16px 44px rgba(0,0,0,.13);z-index:200;max-height:400px;overflow-y:auto}
.search-group-label{padding:10px 16px 4px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.search-result{display:grid;grid-template-columns:40px 1fr;gap:10px;align-items:center;padding:10px 16px;cursor:pointer;transition:background .1s}
.search-result:hover{background:#f5f7fa}.search-result-icon{width:40px;height:40px;border-radius:10px;background:#edf0f3;display:flex;align-items:center;justify-content:center;font-size:18px}.search-room-icon{display:block;width:32px;height:32px;border-radius:50%}.mini-room-icon{display:block;width:36px;height:36px;border-radius:50%}
.sr-img{width:40px;height:40px;border-radius:10px;object-fit:cover;display:block}
.search-result-title{font-size:14px;font-weight:700}.search-result-sub{font-size:12px;color:var(--muted);margin-top:1px}
.search-no-results{padding:20px;text-align:center;color:var(--muted);font-size:14px}
.smart-score-card{margin-bottom:20px}
.smart-score-header{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:20px}
.smart-score-header p{margin:6px 0 0;font-size:14px}
.smart-score-circle{width:96px;height:96px;border-radius:999px;background:conic-gradient(var(--score-color,var(--blue)) var(--pct,0%),#eef1f5 0%);display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;transition:--pct .5s}
.smart-score-circle::after{content:'';position:absolute;inset:12px;border-radius:999px;background:#fff}
.smart-score-circle span{position:relative;z-index:1;font-size:19px;font-weight:800;color:var(--text)}
.score-bars{display:flex;flex-direction:column;gap:11px}
.score-bar-row{display:grid;grid-template-columns:130px 1fr 42px;gap:12px;align-items:center}
.score-bar-label{font-size:13px;color:var(--muted)}
.score-bar-track{height:8px;border-radius:999px;background:#eef1f5;overflow:hidden}
.score-bar-fill{height:100%;border-radius:999px;transition:width .5s ease}
.score-bar-pct{font-size:12px;font-weight:700;text-align:right}
.insight-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:20px}
.insight-card{margin-bottom:0}
.insight-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px}
.insight-head h3{font-size:15px;margin:4px 0 0}
.insight-count{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:28px;padding:0 8px;border-radius:999px;font-size:13px;font-weight:800;background:#fff3e0;color:#b45309;flex-shrink:0;transition:background .2s,color .2s}
.insight-count.zero{background:#e7f6ed;color:#176c42}
.smart-register-cta{display:grid;grid-template-columns:56px 1fr auto;align-items:center;gap:20px;margin-bottom:24px}
.smart-register-cta .smart-orb{width:56px;height:56px;border-radius:18px;font-size:26px;box-shadow:0 8px 20px rgba(77,77,220,.18)}
.smart-register-cta h3{font-size:16px;margin:2px 0 4px}.smart-register-cta p{margin:0;font-size:13px}
@media(max-width:900px){.score-bar-row{grid-template-columns:110px 1fr 36px}}
@media(max-width:600px){.insight-grid{grid-template-columns:1fr}.smart-register-cta{grid-template-columns:56px 1fr}.smart-register-cta button{grid-column:1/-1}.score-bar-row{grid-template-columns:90px 1fr 32px}}
@media(max-width:760px){.nav-tab.active{color:var(--blue)}}
/* HjemArkiv 4.3.1 – Smart wizard */
/* Progress bar */
.wizard-progress{display:grid;grid-template-columns:auto 1fr auto 1fr auto 1fr auto;align-items:start;margin:0 0 24px;gap:0}
.wiz-item{display:flex;flex-direction:column;align-items:center;gap:6px}
.wiz-connector{height:2px;background:#e4eaf3;margin-top:13px;transition:background .3s ease}
.wiz-dot{width:28px;height:28px;border-radius:50%;border:2px solid #e4eaf3;background:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#b0b8c4;transition:all .2s ease;flex-shrink:0}
.wiz-label{font-size:10px;color:var(--muted);font-weight:600;white-space:nowrap;text-align:center}
.wiz-item.wiz-active .wiz-dot{border-color:var(--blue);background:var(--blue);color:#fff}
.wiz-item.wiz-active .wiz-label{color:var(--blue);font-weight:700}
.wiz-item.wiz-done .wiz-dot{border-color:#16794a;background:#16794a;color:#fff}
.wiz-item.wiz-done .wiz-label{color:#16794a}
.wiz-connector.wiz-done{background:#16794a}
/* Step panels */
.wiz-step{animation:viewIn .2s ease both}
.wiz-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.wiz-actions-right{display:flex;gap:8px;align-items:center}
/* Step 2 header */
.smart-step2-top{display:flex;align-items:center;gap:14px;padding:14px 16px;margin-bottom:14px;background:#f0f7ff;border:1px solid #c5dcf7;border-radius:16px;flex-wrap:wrap}
.smart-thumb{width:56px;height:56px;border-radius:12px;object-fit:cover;background:#edf0f3;flex-shrink:0}
.smart-step2-info{flex:1;min-width:0}
.smart-step2-info strong{font-size:14px;display:block}
.smart-step2-info p{margin:3px 0 0;font-size:12px}
/* Analysis inner header (renamed from .smart-analysis-header to avoid clash) */
.smart-analysis-header2{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:6px}
.smart-analysis-header2 h3{font-size:15px;margin:4px 0 0}
/* Collapsible details */
.smart-details{margin:16px 0 0;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.smart-details-summary{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;cursor:pointer;font-size:13px;font-weight:700;color:var(--text);list-style:none;user-select:none;background:#fafbfc}
.smart-details-summary::-webkit-details-marker{display:none}
.smart-details-arrow{font-size:16px;color:var(--muted);transition:transform .2s}
details[open] .smart-details-arrow{transform:rotate(90deg)}
.smart-details-body{padding:16px;border-top:1px solid var(--line);background:#fff}
/* Suggestions summary card in step 3 */
.smart-sugg-card{margin-bottom:16px;padding:14px 16px;background:#f0f7ff;border:1px solid #c5dcf7;border-radius:16px}
.smart-sugg-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.smart-sugg-head strong{font-size:13px}
.smart-sugg-chips{display:flex;flex-wrap:wrap;gap:8px}
.sugg-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;background:#fff;border:1px solid #c5dcf7;border-radius:999px;font-size:12px}
.sugg-chip-label{color:var(--muted);font-weight:600}
.sugg-chip-val{font-weight:700;color:var(--text)}
@media(max-width:600px){.smart-step2-top{flex-direction:column;align-items:flex-start}.smart-analyse-btn{width:100%}}
/* HjemArkiv 4.3.1a – wizard polish */
.wizard-progress{margin:0 0 28px}
.wiz-dot{width:32px;height:32px;font-size:12px}
.wiz-connector{margin-top:15px;height:2.5px}
.wiz-item.wiz-active .wiz-dot{box-shadow:0 0 0 5px rgba(0,113,227,.13)}
.wiz-item.wiz-done .wiz-dot{box-shadow:none}
.wiz-label{font-size:10px;letter-spacing:-.01em}
.smart-step2-header{display:flex;align-items:center;gap:14px;margin-bottom:16px;padding:13px 16px;background:#f5f7fa;border:1px solid var(--line);border-radius:14px}
.smart-step2-info strong{font-size:14px;display:block;margin-bottom:2px;font-weight:700}
.smart-step2-info p{margin:0;font-size:12px;color:var(--muted)}
.smart-analysis{margin:0 0 12px;padding:18px 20px;background:#fff;border:1.5px solid var(--line);border-radius:16px;box-shadow:0 2px 10px rgba(24,39,75,.05)}
.smart-analysis-loading strong{font-size:14px;display:block;margin-bottom:4px}
.smart-loading-sub{font-size:12px;color:var(--muted);line-height:1.55;margin:0}
.smart-photo-hint{font-size:11px;color:var(--muted);margin-top:6px;display:block;font-weight:400}
.smart-save-card{display:flex;align-items:center;gap:16px;padding:18px;background:#f5f7fa;border:1px solid var(--line);border-radius:16px;margin-bottom:14px}
.smart-save-thumb{width:72px;height:72px;border-radius:14px;object-fit:cover;background:#edf0f3;flex-shrink:0}
.smart-save-info strong{font-size:17px;font-weight:800;display:block;margin-bottom:4px}
.smart-save-info p{margin:0;font-size:13px}
.smart-save-prompt{font-size:14px;color:var(--muted);margin:0 0 14px;line-height:1.55}
@media(max-width:520px){.wiz-actions{flex-wrap:wrap}.wiz-actions>button{flex:1 1 0}}
@media(max-width:420px){.wiz-label{font-size:9px}.wiz-dot{width:26px;height:26px;font-size:11px}.wiz-connector{margin-top:12px}}
/* HjemArkiv 4.3.1b – wizard polish */
/* Photo hint: outside label, plain paragraph at readable size */
.smart-photo-hint{font-size:13px;color:var(--muted);text-align:center;margin:8px auto 0;font-weight:400;line-height:1.4;display:block;max-width:100%}
/* Header → progress bar gap */
.smart-dialog-card .dialog-head{margin-bottom:20px}
/* Connectors: 3 px, clearly visible future/done states */
.wiz-connector{height:3px;background:#cdd6e0}
.wiz-connector.wiz-done{background:#16794a}
/* Future dot: slightly crisper border */
.wiz-dot{border-color:#c5d0dc}
/* Step enter animation: 180 ms smooth slide-up */
@keyframes wizStepIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.wiz-step{animation:wizStepIn 180ms cubic-bezier(.25,.8,.25,1) both;min-height:270px}
/* Prevent progress bar from causing horizontal scroll */
.wizard-progress{overflow:hidden}
/* Mobile labels: wrap instead of overflow */
@media(max-width:500px){
  .wiz-label{white-space:normal;max-width:52px;line-height:1.25;word-break:break-word}
}

/* ── RTL language support (Arabic) ─────────────────────────────────────────
   Keep this override scoped to the document direction. Logical properties
   handle ordinary flow, while the small directional overrides below mirror
   controls whose iconography communicates a direction. */
html[dir="rtl"] {
  direction: rtl;
}

html[dir="rtl"] body {
  direction: rtl;
  text-align: start;
}

html[dir="rtl"] :where(input, select, textarea, button) {
  text-align: start;
}

html[dir="rtl"] header .header-inner,
html[dir="rtl"] header .header-actions,
html[dir="rtl"] .app-nav-inner,
html[dir="rtl"] .header-actions,
html[dir="rtl"] .lang-settings-row {
  direction: rtl;
}

html[dir="rtl"] .app-brand-copy,
html[dir="rtl"] .app-brand-tagline,
html[dir="rtl"] .auth-brand-copy,
html[dir="rtl"] .auth-card,
html[dir="rtl"] .auth-header,
html[dir="rtl"] .auth-body {
  text-align: start;
}

html[dir="rtl"] .nav-tab,
html[dir="rtl"] .quick-action,
html[dir="rtl"] .welcome-card,
html[dir="rtl"] .section-head,
html[dir="rtl"] .section-intro,
html[dir="rtl"] .toolbar,
html[dir="rtl"] .hero,
html[dir="rtl"] .dialog-head,
html[dir="rtl"] .actions,
html[dir="rtl"] .wiz-actions,
html[dir="rtl"] .field-label-row,
html[dir="rtl"] .setting-row {
  direction: rtl;
}

html[dir="rtl"] .dialog-card,
html[dir="rtl"] dialog,
html[dir="rtl"] .dialog-card :where(form, .form-grid, .field-wrap),
html[dir="rtl"] .smart-dialog-card {
  direction: rtl;
  text-align: start;
}

html[dir="rtl"] .dialog-head > :last-child,
html[dir="rtl"] .dialog-head .icon,
html[dir="rtl"] .dialog-head .close,
html[dir="rtl"] .manual-hd .manual-close-btn {
  margin-inline-start: auto;
}

html[dir="rtl"] .dialog-card :where(input, select, textarea),
html[dir="rtl"] .auth-card :where(input, select, textarea),
html[dir="rtl"] .lang-select {
  padding-inline: 13px;
}

html[dir="rtl"] .auth-card .auth-password-shell input {
  padding-inline-start: 58px;
  padding-inline-end: 13px;
}

html[dir="rtl"] .auth-password-toggle {
  inset-inline-start: 8px;
  inset-inline-end: auto;
}

html[dir="rtl"] .auth-field-icon {
  inset-inline-start: auto;
  inset-inline-end: 14px;
}

html[dir="rtl"] .auth-input-shell input {
  padding-inline-start: 13px;
  padding-inline-end: 45px;
}

html[dir="rtl"] .hlang-opt {
  direction: rtl;
  text-align: start;
}

html[dir="rtl"] .hlang-check {
  margin-inline-start: auto;
  margin-inline-end: 0;
}

html[dir="rtl"] .hlang-flag {
  order: 2;
}

html[dir="rtl"] .hlang-check {
  order: 0;
}

html[dir="rtl"] .hlang-opt > :not(.hlang-flag):not(.hlang-check) {
  order: 1;
}

html[dir="rtl"] .smart-db-search::before {
  inset-inline-start: auto;
  inset-inline-end: 16px;
}

html[dir="rtl"] .smart-db-search input {
  padding-inline-start: 18px;
  padding-inline-end: 50px;
}

html[dir="rtl"] :where(.vehicle-info-table, .policy-table, table) {
  direction: rtl;
  text-align: start;
}

html[dir="rtl"] :where(.vehicle-info-table td, .policy-table td, .policy-table th, table td, table th) {
  text-align: start;
  padding-inline: .35rem;
}

html[dir="rtl"] .vehicle-info-table td:first-child {
  padding-inline-end: .65rem;
  padding-inline-start: .35rem;
}

html[dir="rtl"] :where(.item, .item-grid .item, .document-row, .mini-row, .compact-row,
  .privacy-document-row, .settings-list > div, .settings-invite-row,
  .policy-doc-row, .vo-row, .wo-row) {
  direction: rtl;
}

html[dir="rtl"] :where(.mini-value, .compact-row .mini-value, .vo-rank, .vo-own-row > span.muted,
  .vo-own-row > strong) {
  text-align: start;
}

html[dir="rtl"] :where(.active-room-icon, .heading-icon, .owner-badge, .eu-badge,
  .vi-dekk-tag) {
  margin-inline-end: .35rem;
  margin-inline-start: 0;
}

html[dir="rtl"] .room-edit,
html[dir="rtl"] .policy-doc-del {
  inset-inline-start: 10px;
  inset-inline-end: auto;
}

html[dir="rtl"] :where(.docs-back-btn, .export-back-btn, .manual-back-btn, .back-btn) {
  direction: rtl;
}

html[dir="rtl"] :where(.docs-back-btn, .export-back-btn, .manual-back-btn, .back-btn) svg,
html[dir="rtl"] :where([data-direction="forward"], .direction-forward) {
  transform: scaleX(-1);
}

html[dir="rtl"] .smart-details-arrow,
html[dir="rtl"] .item-ins-arrow,
html[dir="rtl"] .vi-dekk-summary::before {
  transform: scaleX(-1);
}

html[dir="rtl"] details[open] .smart-details-arrow,
html[dir="rtl"] .vi-dekk-details[open] .vi-dekk-summary::before {
  transform: scaleX(-1) rotate(90deg);
}

html[dir="rtl"] .warranty-expiry-panel {
  border-inline-start: 0;
  border-inline-end: 4px solid var(--warning, #f59e0b);
}

html[dir="rtl"] .policy-doc-badge {
  margin-inline-start: auto;
  margin-inline-end: 0;
}

html[dir="rtl"] .s2-ai-banner-dismiss {
  margin-inline-start: auto;
  margin-inline-end: 0;
}

@media (max-width: 760px) {
  html[dir="rtl"] .app-nav-inner {
    direction: rtl;
  }

  html[dir="rtl"] :where(.toolbar, .hero, .section-head, .section-intro,
    .active-room, .active-room-bar, .welcome-card) {
    align-items: stretch;
  }

  html[dir="rtl"] :where(.actions, .wiz-actions, .wiz-actions-right,
    .auth-actions, .forgot-sent-actions, .save-success-actions) {
    flex-direction: column;
    align-items: stretch;
  }

  html[dir="rtl"] :where(.actions > button, .wiz-actions > button,
    .auth-actions > button, .forgot-sent-actions > button) {
    width: 100%;
  }

  html[dir="rtl"] dialog {
    margin-inline: auto;
  }

  html[dir="rtl"] .hlang-opt {
    min-height: 44px;
    padding-block: .55rem;
  }
}

@media (min-width: 761px) {
  html[dir="rtl"] .app-nav-inner {
    justify-content: center;
  }

  html[dir="rtl"] .dialog-card {
    margin-inline: auto;
  }
}

/* ── Private legal documents ─────────────────────────────────────────────── */
.legal-dashboard-entry{display:flex;align-items:center;justify-content:center;gap:.65rem;text-align:left}
.legal-dashboard-entry small{display:block;margin-top:.12rem;color:var(--muted);font-size:.72rem;font-weight:500;line-height:1.25}
.dashboard-quick-glyph{display:grid;place-items:center;width:2rem;height:2rem;font-size:1.35rem;flex:0 0 auto}
.legal-section-intro{align-items:flex-end}
.legal-security-note{display:flex;align-items:flex-start;gap:.8rem;border-color:color-mix(in srgb,var(--blue) 26%,var(--line))}
.legal-security-note p{margin:0;line-height:1.55}
.legal-security-icon{display:grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:50%;background:color-mix(in srgb,var(--blue) 12%,transparent);flex:0 0 auto}
.legal-document-list{display:flex;flex-direction:column}
.legal-document-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:.85rem;align-items:start;padding:1rem 0;border-bottom:1px solid var(--line)}
.legal-document-row:first-child{padding-top:0}
.legal-document-row:last-child{padding-bottom:0;border-bottom:0}
.legal-document-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:color-mix(in srgb,var(--blue) 11%,var(--card));border:1px solid color-mix(in srgb,var(--blue) 20%,var(--line));font-size:1.2rem}
.legal-document-title{font-weight:750;font-size:1rem;line-height:1.3;color:var(--text)}
.legal-document-meta{display:flex;align-items:center;flex-wrap:wrap;gap:.35rem;margin-top:.35rem}
.legal-type-badge,.legal-access-badge{display:inline-flex;align-items:center;min-height:24px;padding:.18rem .5rem;border-radius:999px;font-size:.72rem;font-weight:700}
.legal-type-badge{background:color-mix(in srgb,var(--blue) 10%,var(--card));color:var(--blue)}
.legal-access-badge{background:color-mix(in srgb,#5f6b7a 10%,var(--card));color:var(--muted)}
.legal-document-details{margin-top:.45rem;font-size:.8rem;line-height:1.45}
.legal-document-notes{margin:.45rem 0 0;white-space:pre-wrap;font-size:.86rem;line-height:1.5}
.legal-document-actions{display:flex;gap:.4rem;flex-wrap:wrap;justify-content:flex-end}
.legal-document-dialog{width:min(720px,calc(100vw - 24px))}
.legal-file-field{display:flex;flex-direction:column;gap:.35rem;margin-top:.75rem}
.legal-file-field input[type="file"]{padding:.65rem;border:1px dashed var(--line);border-radius:10px;background:var(--card)}
.legal-access-fieldset{display:flex;flex-direction:column;gap:.55rem;margin-top:1rem;padding:1rem;border:1px solid var(--line);border-radius:14px}
.legal-access-fieldset legend{padding:0 .35rem;font-weight:750}
.legal-access-option,.legal-member-option{display:flex;align-items:flex-start;gap:.6rem;cursor:pointer}
.legal-access-option input,.legal-member-option input{margin-top:.2rem;accent-color:var(--blue)}
.legal-access-option span{display:flex;flex-direction:column;gap:.12rem}
.legal-access-option small{color:var(--muted);line-height:1.35}
.legal-share-members{margin:.35rem 0 0 1.55rem;padding:.75rem;border-left:3px solid color-mix(in srgb,var(--blue) 35%,var(--line))}
.legal-share-members>strong{display:block;margin-bottom:.55rem;font-size:.84rem}
#legalShareMembers{display:flex;flex-direction:column;gap:.5rem}
.legal-unlock-dialog{width:min(460px,calc(100vw - 24px))}
.legal-unlock-dialog>p{line-height:1.55}
.legal-unlock-dialog .auth-divider{margin:.9rem 0}
#legalUnlockPasswordForm{display:flex;flex-direction:column;gap:.55rem}
#legalUnlockPasskeyBtn{min-height:46px}

@media(max-width:760px){
  .legal-section-intro{align-items:stretch}
  .legal-section-intro>button{width:100%}
  .legal-document-row{grid-template-columns:40px minmax(0,1fr)}
  .legal-document-icon{width:40px;height:40px}
  .legal-document-actions{grid-column:2;justify-content:flex-start}
}
@media(max-width:600px){
  html[data-hj-theme] body:has(#appView:not(.hidden)) .nav-tab,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) .nav-tab{
    min-width:46px!important;
    padding-left:3px!important;
    padding-right:3px!important;
    font-size:.68rem;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) .nav-tab.smart-tab,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) .nav-tab.smart-tab{
    width:52px;
    height:52px;
    min-width:52px!important;
  }
  .legal-dashboard-entry{justify-content:flex-start}
}

/* HjemArkiv Gratis/Pro – subscription status and upgrade presentation */
.plan-progress-card{margin:0 0 20px;padding:16px 18px;border:1px solid var(--hj-border,#d5e2ef);border-radius:var(--hj-radius-lg,22px);background:linear-gradient(135deg,var(--hj-blue-050,#f4f9fe),var(--hj-surface,#fff));box-shadow:var(--hj-shadow-sm,0 2px 8px rgba(9,48,86,.06))}
.plan-progress-title-row,.plan-progress-footer{display:flex;align-items:center;justify-content:space-between;gap:14px}.plan-progress-title-row h3{margin:3px 0 0}.plan-progress-copy>p{margin:8px 0 12px;font-size:13px}.plan-status-badge{display:inline-flex;align-items:center;justify-content:center;min-height:28px;padding:5px 10px;border-radius:999px;font-size:11px;font-weight:850;letter-spacing:.04em;text-transform:uppercase}.plan-status-free{background:var(--hj-blue-100,#e8f3fd);color:var(--hj-blue-700,#1268bd)}.plan-status-pro{background:#eaf7d8;color:var(--hj-green-700,#39731a)}.plan-progress-track{height:8px;border-radius:999px;background:#dbe8f4;overflow:hidden}.plan-progress-fill{width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--hj-blue-600,#1d7fe0),var(--hj-blue-500,#3d9bf0));transition:width .25s ease}.plan-progress-fill.plan-progress-unlimited{background:linear-gradient(90deg,var(--hj-green-700,#39731a),var(--hj-green-500,#86c82f))}.plan-progress-footer{margin-top:9px}.plan-progress-footer strong{font-size:12px;color:var(--hj-ink,#102b4b)}
.settings-plan-card{display:grid;grid-template-columns:52px minmax(0,1fr) auto auto;align-items:center;gap:14px}.settings-plan-icon{width:52px;height:52px;display:grid;place-items:center;border-radius:16px;background:linear-gradient(135deg,var(--hj-navy-900,#06244a),var(--hj-blue-600,#1d7fe0));color:#fff;font-size:11px;font-weight:900;letter-spacing:.08em}.settings-plan-copy h3{margin:3px 0}.settings-plan-copy p{margin:0;font-size:13px}
.pro-dialog-card{width:min(720px,100%);margin:auto;padding:24px}.pro-dialog-intro{margin:-3px 0 18px;color:var(--hj-muted,#607893);font-size:15px}.pro-limit-notice{display:flex;flex-direction:column;gap:4px;margin-bottom:16px;padding:13px 15px;border:1px solid #f0c56b;border-radius:var(--hj-radius-md,16px);background:var(--hj-warning-soft,#fff6df);color:var(--hj-warning,#996000)}.pro-limit-notice span{font-size:13px;line-height:1.45}.pro-price-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0 18px}.pro-price-option{position:relative;min-height:118px;padding:17px;text-align:left;border:1.5px solid var(--hj-border,#d5e2ef);border-radius:var(--hj-radius-md,16px);background:var(--hj-surface,#fff);color:var(--hj-ink,#102b4b)}.pro-price-option:hover{filter:none;border-color:var(--hj-blue-500,#3d9bf0)}.pro-price-option.selected{border-color:var(--hj-blue-600,#1d7fe0);box-shadow:var(--hj-focus,0 0 0 3px rgba(29,127,224,.23));background:var(--hj-blue-050,#f4f9fe)}.pro-price-label{display:block;margin-bottom:13px;font-size:13px;font-weight:800}.pro-price{display:flex;align-items:baseline;gap:6px}.pro-price strong{font-size:27px}.pro-price small{color:var(--hj-muted,#607893)}.pro-best-value{position:absolute;top:10px;right:10px;padding:4px 7px;border-radius:999px;background:#eaf7d8;color:var(--hj-green-700,#39731a);font-size:9px;font-weight:900;letter-spacing:.04em;text-transform:uppercase}.pro-feature-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px;margin:0;padding:0;list-style:none}.pro-feature-list li{display:grid;grid-template-columns:24px 1fr;gap:8px;align-items:center;font-size:13px}.pro-feature-list li>span:first-child{width:24px;height:24px;display:grid;place-items:center;border-radius:999px;background:var(--hj-success-soft,#edf8ef);color:var(--hj-success,#287342);font-weight:900}.pro-coming-soon{display:flex;flex-direction:column;gap:3px;margin-top:18px;padding:13px 15px;border-radius:var(--hj-radius-md,16px);background:var(--hj-surface-soft,#f4f8fc);color:var(--hj-ink,#102b4b)}.pro-coming-soon span{font-size:12px;color:var(--hj-muted,#607893)}
html[data-hj-theme="dark"] .plan-progress-card,html[data-hj-theme="dark"] .pro-price-option{background:#0b315e;border-color:#28547f}html[data-hj-theme="dark"] .plan-progress-footer strong,html[data-hj-theme="dark"] .pro-price-option,html[data-hj-theme="dark"] .pro-coming-soon{color:#f4f8fc}html[data-hj-theme="dark"] .plan-progress-track{background:#244b72}html[data-hj-theme="dark"] .pro-price-option.selected{background:#123f70}html[data-hj-theme="dark"] .pro-coming-soon{background:#0b315e}
@media(max-width:700px){.settings-plan-card{grid-template-columns:44px minmax(0,1fr) auto}.settings-plan-icon{width:44px;height:44px;border-radius:13px}.settings-plan-card>button{grid-column:1/-1;width:100%}.pro-feature-list{grid-template-columns:1fr}}
 body.pro-dialog-open{overflow:hidden}
 @media(max-width:520px){.plan-progress-title-row{align-items:flex-start}.plan-progress-footer{align-items:stretch;flex-direction:column}.plan-progress-footer button{width:100%}.pro-dialog-card{padding:18px}.pro-price-grid{grid-template-columns:1fr}.pro-price-option{min-height:104px}.pro-dialog-card .actions{align-items:stretch;flex-direction:column-reverse}.pro-dialog-card .actions button{width:100%}}
/* Very small screens: hide labels, rely on dots */
@media(max-width:360px){
  .wiz-label{display:none}
  .wizard-progress{gap:0}
}
/* Mobile action buttons: comfortable tap targets */
@media(max-width:520px){
  .wiz-actions>button{min-height:44px;font-size:14px;padding:10px 14px}
}
/* HjemArkiv 4.3.0 – Smart AI-ready registration */
.smart-analyse-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px;margin:10px 0;background:#f0f7ff;border:1px solid #c5dcf7;border-radius:16px}
.smart-analyse-left{display:flex;align-items:center;gap:12px;min-width:0}
.smart-analyse-icon{font-size:22px;flex-shrink:0}
.smart-analyse-left strong{font-size:14px;display:block}
.smart-analyse-left small{font-size:12px;color:var(--muted)}
.smart-analyse-btn{background:var(--blue);color:#fff;white-space:nowrap;flex-shrink:0;padding:10px 20px;border-radius:12px;font-weight:700;border:0;cursor:pointer;transition:background .15s,transform .15s}
.smart-analyse-btn:hover{background:#0060c0;transform:translateY(-1px)}
.smart-analysis{margin:10px 0;padding:20px;background:#fafbfc;border:1.5px solid var(--line);border-radius:18px}
.smart-analysis-loading{display:flex;align-items:center;gap:14px}
.smart-analysis-spinner{width:32px;height:32px;border-radius:50%;flex-shrink:0;border:3px solid #e4eaf3;border-top-color:var(--blue);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.smart-analysis-loading strong{font-size:14px;display:block}
.smart-loading-sub{font-size:12px;margin:3px 0 0}
.smart-analysis-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:6px}
.smart-analysis-header h3{font-size:15px;margin:4px 0 0}
.smart-demo-badge{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;font-size:11px;font-weight:800;background:#fff3e0;color:#b45309;white-space:nowrap;flex-shrink:0}
.smart-analysis-note{font-size:12px;color:var(--muted);margin:0 0 14px}
.suggestion-fields{display:flex;flex-direction:column;gap:10px;margin-bottom:14px}
.suggestion-label-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
.suggestion-label{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.suggestion-input{width:100%;font-size:14px}
.conf-badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:999px;font-size:10px;font-weight:800;letter-spacing:.03em;flex-shrink:0}
.conf-hoy{background:#e7f6ed;color:#176c42}
.conf-middels{background:#fff3e0;color:#b45309}
.conf-lav{background:#f0f0f3;color:#8a8a8e}
.smart-analysis-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.smart-apply-btn{background:#176c42;color:#fff;padding:10px 22px;border-radius:12px;font-weight:700;border:0;cursor:pointer;transition:background .15s,transform .15s}
.smart-apply-btn:hover{background:#0f5231;transform:translateY(-1px)}
.smart-privacy-note{margin:12px 0;padding:13px 15px;border-radius:14px;background:#edf8f1;color:#176c42;font-size:13px;line-height:1.6}
@media(max-width:600px){.smart-analyse-bar{flex-direction:column;align-items:flex-start}.smart-analyse-btn{width:100%}.smart-apply-btn{width:100%}.smart-analysis-actions{flex-direction:column}.smart-analysis-actions .secondary{width:100%}}
/* HjemArkiv 4.2.2 */
/* Page load fade-in */
#appView:not(.hidden){animation:appFadeIn .45s cubic-bezier(.25,.8,.25,1) both}
@keyframes appFadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* Metric cards – larger numbers, uppercase labels, base shadow */
.metric>span{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.metric strong{font-size:34px;line-height:1.1;letter-spacing:-.02em}
.metric{box-shadow:0 2px 10px rgba(24,39,75,.06);transition:box-shadow .22s cubic-bezier(.25,.8,.25,1),transform .22s cubic-bezier(.25,.8,.25,1)}
.metric:hover{box-shadow:0 14px 36px rgba(24,39,75,.13);transform:translateY(-2px)}
/* Dashboard panels */
.dashboard-panel{transition:box-shadow .22s cubic-bezier(.25,.8,.25,1),transform .22s cubic-bezier(.25,.8,.25,1)}
.dashboard-panel:hover{box-shadow:0 24px 56px rgba(24,39,75,.14);transform:translateY(-3px)}
/* Quick actions */
.quick-action{transition:box-shadow .22s cubic-bezier(.25,.8,.25,1),transform .22s cubic-bezier(.25,.8,.25,1),border-color .22s ease}
.quick-action:hover{box-shadow:0 16px 38px rgba(0,0,0,.14);transform:translateY(-4px);border-color:#a8c0d8}
/* Dashboard last-updated subtitle */
.dashboard-head-sub{font-size:12px;color:var(--muted);margin-top:2px;display:block}
/* Smart button states */
.smart-primary{transition:background .3s ease,color .3s ease}
.smart-primary.has-suggestions{background:#fff3e0;color:#b45309}
.smart-primary.all-ok{background:#e7f6ed;color:#176c42}
/* HjemArkiv 4.3.2 – Smart wizard completion */
.smart-photo-change{margin:12px 0 0;display:flex;justify-content:center}
.smart-change-label{display:inline-flex;align-items:center;gap:7px;padding:9px 20px;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--text);font-size:14px;font-weight:700;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.smart-change-label:hover{border-color:var(--blue);background:#f0f6ff;color:var(--blue)}
.smart-save-meta{font-size:13px;color:var(--text);font-weight:600;margin:5px 0 0}
.smart-dialog-card button[type="submit"]:disabled{opacity:.6;cursor:wait}
@media(max-width:760px){body{padding-bottom:calc(92px + env(safe-area-inset-bottom, 0px))}.app-nav{position:fixed;top:auto;bottom:0;left:0;right:0;border-top:1px solid var(--line);border-bottom:0}.app-nav-inner{justify-content:space-around;padding:7px 6px max(7px,env(safe-area-inset-bottom))}.nav-tab{flex-direction:column;gap:2px;padding:6px 8px;min-width:58px}.nav-tab strong{font-size:10px}.nav-tab span{font-size:20px}.nav-tab.smart-tab{transform:translateY(-12px);background:#0877e6;color:#fff;width:58px;height:58px;border-radius:999px;justify-content:center;box-shadow:0 10px 24px rgba(8,119,230,.32)}.nav-tab.smart-tab strong{display:none}.welcome-card{align-items:flex-start;flex-direction:column;padding:22px}.welcome-card .smart-primary{width:100%}.smart-hero{grid-template-columns:1fr;text-align:center}.smart-orb{margin:auto}.smart-hero button{width:100%}.feature-grid{grid-template-columns:1fr}.privacy-document-list{grid-template-columns:1fr}.document-row{grid-template-columns:48px 1fr}.document-icon{width:48px;height:48px}.document-row button{grid-column:1/-1}.section-intro h2{font-size:24px}}
/* HjemArkiv 4.3.2 – Upload zone & wizard step animations */
/* ── 1. Camera-pattern background in upload zone ──────────────────── */
.smart-photo-box{
  background-color:#f6f9fd;
  background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'><rect x='8' y='24' width='56' height='34' rx='6' fill='none' stroke='%23c5cdd6' stroke-width='2'/><circle cx='36' cy='41' r='10' fill='none' stroke='%23c5cdd6' stroke-width='2'/><circle cx='36' cy='41' r='5' fill='none' stroke='%23c5cdd6' stroke-width='1.5'/><path d='M24 24l5-8h14l5 8' fill='none' stroke='%23c5cdd6' stroke-width='2' stroke-linejoin='round'/><circle cx='56' cy='31' r='2.5' fill='%23c5cdd6'/></svg>");
  background-size:72px 72px;
  background-repeat:repeat;
  transition:border-color .2s ease,background-color .2s ease,box-shadow .2s ease;
}
/* ── 2. Hover & keyboard-focus states ─────────────────────────────── */
.smart-photo-box:hover{
  border-color:var(--blue);
  background-color:#eff6ff;
  box-shadow:0 4px 18px rgba(0,113,227,.11);
}
/* :has() – fires when the visually-hidden file input receives keyboard focus */
.smart-capture:has(#smartPhoto:focus) .smart-photo-box{
  border-color:var(--blue);
  background-color:#eff6ff;
  box-shadow:0 0 0 3px rgba(0,113,227,.22);
}
/* ── 3. Step label colours (explicit cascade) ─────────────────────── */
.wiz-item .wiz-label{color:var(--muted);font-weight:600}
.wiz-item.wiz-active .wiz-label{color:var(--blue);font-weight:700}
.wiz-item.wiz-done  .wiz-label{color:#16794a;font-weight:600}
/* ── 4. Dot transitions (replace transition:all to avoid animation clash) */
.wiz-dot{transition:background-color 200ms ease,border-color 200ms ease,box-shadow 200ms ease,color 100ms ease}
/* ── 5. Dot pop on completion ──────────────────────────────────────── */
@keyframes wizDotPop{0%{transform:scale(1)}40%{transform:scale(1.16)}100%{transform:scale(1)}}
.wiz-item.wiz-done .wiz-dot{animation:wizDotPop 220ms cubic-bezier(.4,0,.2,1) both}
/* ── 6. Connector: left-to-right fill animation ───────────────────── */
.wiz-connector{position:relative;overflow:hidden}
/* keep grey base; fill comes from ::before so override previous background rule */
.wiz-connector.wiz-done{background:#cdd6e0}
.wiz-connector::before{
  content:'';position:absolute;left:0;top:0;height:100%;
  width:0;background:#16794a;
  transition:width 220ms cubic-bezier(.4,0,.2,1);
}
.wiz-connector.wiz-done::before{width:100%}
@media(max-width:420px){.wiz-connector::before{transition-duration:160ms}}
/* HjemArkiv 4.3.3 – Connection status panel */
.status-banner{margin:8px 0 14px;padding:10px 14px;border-radius:10px;background:#e7f6ed;color:#16794a;font-size:14px;font-weight:600}
.status-timestamp{margin-top:10px;padding-top:10px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
/* HjemArkiv 4.4.0 – Mobile camera capture & multi-image handling */
button.upload-box{font-family:inherit;font-size:inherit;width:100%;text-align:center}
#itemDialog .upload-grid{grid-template-columns:repeat(2,1fr)}
@media(max-width:500px){#itemDialog .upload-grid{grid-template-columns:1fr}}
.smart-capture-btns{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:4px 0 8px}
.smart-cap-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:22px 12px;border-radius:18px;border:2px dashed #a9b7c8;background:#f6f9fd;cursor:pointer;transition:border-color .18s,background .18s,box-shadow .18s;min-height:118px;width:100%;font-family:inherit}
.smart-cap-btn span{font-size:36px;line-height:1.1}
.smart-cap-btn strong{font-size:14px;font-weight:700;color:var(--text)}
.smart-cap-btn small{font-size:11px;color:var(--muted)}
.smart-cap-btn:hover,.smart-cap-btn:focus-visible{border-color:var(--blue);background:#eff6ff;box-shadow:0 4px 14px rgba(0,113,227,.11);outline:none}
.smart-cap-btn:active{transform:scale(.97)}
.smart-processing{display:flex;align-items:center;gap:12px;padding:16px;border-radius:14px;background:#f6f9fd;margin:8px 0}
.smart-processing-spinner{width:20px;height:20px;border:3px solid #d0d8e4;border-top-color:var(--blue);border-radius:50%;animation:wizSpin44 .7s linear infinite;flex-shrink:0}
@keyframes wizSpin44{to{transform:rotate(360deg)}}
#smartPhotoPreviewArea .smart-preview{width:100%;max-height:240px;object-fit:contain;border-radius:14px;background:#111;display:block;margin:0 0 8px}
.smart-thumb-strip{display:flex;gap:8px;overflow-x:auto;padding:2px 0 8px;-webkit-overflow-scrolling:touch;margin-bottom:2px}
.smart-thumb-strip::-webkit-scrollbar{height:3px}
.smart-thumb-strip::-webkit-scrollbar-thumb{background:#cdd6e0;border-radius:2px}
.smart-thumb-item{position:relative;flex-shrink:0;width:58px;height:58px;border-radius:10px;overflow:hidden;border:2px solid transparent;cursor:pointer;transition:border-color .15s}
.smart-thumb-item img{width:100%;height:100%;object-fit:cover;display:block}
.smart-thumb-item.active{border-color:var(--blue)}
.smart-thumb-item.primary{border-color:#16794a}
.thumb-badge-primary{position:absolute;top:2px;right:3px;font-size:11px;color:#fbbf24;text-shadow:0 1px 2px rgba(0,0,0,.5);pointer-events:none;line-height:1}
.smart-thumb-item .thumb-set-primary{position:absolute;top:1px;right:2px;font-size:12px;background:none;border:none;padding:0;cursor:pointer;color:rgba(255,255,255,.85);text-shadow:0 1px 2px rgba(0,0,0,.55);line-height:1}
.smart-file-info{display:flex;gap:10px;align-items:baseline;margin:2px 0 8px;flex-wrap:wrap}
.sfi-name{font-size:12px;color:var(--muted);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}
.sfi-size{font-size:12px;color:var(--muted)}
.sfi-size strong{color:#16794a;font-weight:700}
.smart-photo-actions{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 4px}
.smart-photo-actions .secondary{min-height:38px}
.smart-photo-error{padding:10px 14px;border-radius:10px;background:#fef2f2;color:#b42318;font-size:13px;font-weight:600;border:1px solid #fecaca;margin:6px 0}
.pending-images-label{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin:12px 0 6px}
.pending-thumb-strip{display:flex;gap:8px;overflow-x:auto;padding:2px 0 6px;-webkit-overflow-scrolling:touch}
.pending-thumb-item{position:relative;flex-shrink:0;width:68px;height:68px;border-radius:10px;overflow:hidden;border:2px solid var(--line)}
.pending-thumb-item.primary{border-color:#16794a}
.pending-thumb-item img{width:100%;height:100%;object-fit:cover;display:block}
.pending-thumb-item .thumb-remove{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;font-size:9px;border:none;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1}
.pending-thumb-item .thumb-set-primary{position:absolute;bottom:2px;right:2px;font-size:11px;background:rgba(0,0,0,.55);border:none;padding:1px 3px;border-radius:4px;cursor:pointer;color:#fff;line-height:1.4}
.pending-thumb-item .thumb-badge-primary{position:absolute;top:2px;right:3px;font-size:11px;color:#fbbf24;text-shadow:0 1px 2px rgba(0,0,0,.5);pointer-events:none;line-height:1}
.pending-size{position:absolute;bottom:2px;left:2px;font-size:9px;background:rgba(0,0,0,.55);color:#fff;padding:1px 4px;border-radius:3px;pointer-events:none;line-height:1.4}
@media(max-width:500px){.smart-capture-btns{gap:8px}.smart-cap-btn{min-height:96px;padding:14px 8px}.smart-cap-btn span{font-size:26px}.smart-photo-actions{gap:6px}}
/* HjemArkiv 4.4.1 – Barcode scanning & product lookup */
.barcode-section{margin:10px 0 0}
.barcode-divider{display:flex;align-items:center;gap:8px;margin:14px 0 10px;color:var(--muted);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.barcode-divider::before,.barcode-divider::after{content:'';flex:1;height:1px;background:var(--line)}
.barcode-scan-btn{display:flex;align-items:center;gap:14px;width:100%;padding:14px 16px;border-radius:14px;border:1.5px solid #dde5ef;background:#fff;cursor:pointer;font-family:inherit;box-shadow:0 1px 4px rgba(0,0,0,.05);transition:border-color 200ms,box-shadow 200ms,transform 200ms;text-align:left;min-height:64px}
.bsb-icon{font-size:28px;line-height:1;flex-shrink:0}
.bsb-text strong{display:block;font-size:14px;font-weight:700;color:var(--text)}
.bsb-text small{display:block;font-size:11px;color:var(--muted);margin-top:2px}
.barcode-scan-btn:hover{border-color:var(--blue);box-shadow:0 4px 14px rgba(0,113,227,.12);transform:translateY(-1px)}
.barcode-scan-btn:active{transform:translateY(0)}
.barcode-manual-row{display:flex;gap:8px;margin-top:10px;align-items:center}
.barcode-manual-row input{flex:1;min-width:0}
.barcode-state-msg{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:12px;background:#f6f9fd;font-size:13px;color:var(--text);margin:8px 0;line-height:1.4}
.barcode-state-warn{background:#fff8f0;color:#8b4a00}
.barcode-state-info{background:#eff8ff;color:#0052a3}
.bss-spinner{width:18px;height:18px;border:2.5px solid #d0d8e4;border-top-color:var(--blue);border-radius:50%;animation:wizSpin44 .7s linear infinite;flex-shrink:0;margin-top:1px}
.barcode-camera-view{position:relative;border-radius:16px;overflow:hidden;background:#000;margin:8px 0;aspect-ratio:16/9;max-height:260px}
.barcode-camera-view video{width:100%;height:100%;object-fit:cover;display:block}
.scan-reticle-wrap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.scan-reticle{position:relative;width:210px;height:88px;border:2.5px solid rgba(255,255,255,.9);border-radius:10px;box-shadow:0 0 0 2000px rgba(0,0,0,.45);overflow:hidden}
.scan-reticle-line{position:absolute;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#00e5ff 30%,#00e5ff 70%,transparent);animation:scanLineMov 1.8s ease-in-out infinite}
@keyframes scanLineMov{0%,100%{top:8px;opacity:.5}50%{top:calc(100% - 10px);opacity:1}}
.scan-hint{position:absolute;bottom:46px;left:0;right:0;text-align:center;color:rgba(255,255,255,.85);font-size:12px;font-weight:500}
.scan-stop-btn{position:absolute!important;bottom:10px;left:50%;transform:translateX(-50%);white-space:nowrap;background:rgba(0,0,0,.55)!important;color:#fff!important;border-color:rgba(255,255,255,.3)!important}
.scan-stop-btn:hover{background:rgba(0,0,0,.75)!important}
.barcode-found-pill{display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:12px;background:#f0faf4;border:1.5px solid #aedbc4;margin:8px 0}
.bfp-icon{width:26px;height:26px;border-radius:50%;background:#16794a;color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;flex-shrink:0}
.bfp-info{flex:1;min-width:0}
.bfp-label{font-size:10px;font-weight:700;color:#16794a;text-transform:uppercase;letter-spacing:.05em}
.bfp-value{font-size:14px;font-weight:700;font-family:monospace;color:var(--text);word-break:break-all}
.bfp-format{font-size:11px;color:var(--muted)}
.bfp-clear{padding:4px 8px!important;min-height:28px!important;flex-shrink:0}
.bfp-applied{font-size:12px;color:#16794a;font-weight:600;margin-top:4px}
.product-found-card{border-radius:14px;border:1.5px solid #dde5ef;background:#fff;overflow:hidden;margin:6px 0;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.pfc-header{display:flex;gap:12px;padding:14px;align-items:flex-start}
.pfc-img{width:60px;height:60px;object-fit:contain;border-radius:8px;border:1px solid var(--line);background:#f8f8f8;flex-shrink:0}
.pfc-meta{flex:1;min-width:0}
.pfc-source{font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px}
.pfc-name{font-size:14px;font-weight:700;color:var(--text);line-height:1.3;margin-bottom:3px}
.pfc-brand{font-size:12px;color:var(--muted);margin-bottom:2px}
.pfc-detail{font-size:11px;color:var(--muted)}
.pfc-actions{display:flex;gap:8px;padding:0 14px 12px;align-items:center}
.pfc-apply-btn{padding:10px 20px;border-radius:12px;background:var(--blue);color:#fff;border:none;font-size:14px;font-weight:700;cursor:pointer;min-height:48px;transition:opacity .15s;font-family:inherit}
.pfc-apply-btn:hover{opacity:.88}
@media(max-width:480px){
  .barcode-camera-view{max-height:200px}
  .scan-reticle{width:165px;height:70px}
  .pfc-actions{flex-direction:column}
  .pfc-apply-btn,.pfc-actions .secondary{width:100%;text-align:center;min-height:48px}
  .barcode-manual-row{flex-direction:column}
  .barcode-manual-row input,.barcode-manual-row .secondary{width:100%;min-height:48px}
}
/* HjemArkiv 4.4.1 – Wizard UX overhaul (steps 2–4) */
/* Required field asterisk */
.field-req{color:#b42318;font-size:11px;margin-left:2px;font-weight:700}
/* ── Step 2 analysis header ── */
.s2-header{display:flex;gap:12px;align-items:flex-start;margin-bottom:12px;padding:12px 14px;border-radius:14px;background:#f6f9fd;border:1px solid #e4eaf2}
.smart-thumb{width:68px;height:68px;object-fit:cover;border-radius:10px;border:1px solid var(--line);background:#111;flex-shrink:0}
.s2-header-meta{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:4px}
.s2-status-row{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text)}
.s2-status-done{display:flex;align-items:center;gap:8px;font-size:13px;color:#16794a;font-weight:600}
.s2-done-tick{width:20px;height:20px;border-radius:50%;background:#16794a;color:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0}
.s2-form-section{margin-top:4px}
/* ── Step 3 review card ── */
.review-card{display:flex;gap:14px;padding:14px;border-radius:16px;border:1.5px solid #dde5ef;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.05);margin-bottom:10px;align-items:flex-start}
.review-img-col{display:flex;flex-direction:column;align-items:center;gap:6px;flex-shrink:0}
.review-thumb{width:80px;height:80px;object-fit:cover;border-radius:12px;border:1px solid var(--line);background:#111;display:block}
.review-barcode-chip{display:flex;align-items:center;gap:4px;padding:3px 7px;border-radius:6px;background:#f0faf4;border:1px solid #aedbc4;font-size:10px;font-weight:600;color:#16794a;white-space:nowrap;max-width:86px;overflow:hidden;text-overflow:ellipsis}
.review-fields{flex:1;min-width:0;display:flex;flex-direction:column;gap:0}
.rv-row{display:flex;gap:8px;padding:5px 0;border-bottom:1px solid #f0f3f7;align-items:baseline}
.rv-row:last-child{border-bottom:none}
.rv-label{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;min-width:72px;flex-shrink:0}
.rv-val{font-size:13px;color:var(--text);font-weight:500;word-break:break-word}
.rv-muted{color:var(--muted);font-weight:400}
.rv-missing-val{color:#b42318;font-style:italic}
.rv-missing{display:flex;align-items:flex-start;gap:8px;padding:10px 14px;border-radius:10px;background:#fffbeb;border:1px solid #fcd34d;font-size:13px;color:#92400e;margin-bottom:4px}
/* ── Step 4 ready state ── */
.step4-ready{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:#f0faf4;border:1.5px solid #aedbc4;margin-bottom:12px}
.step4-ready-icon{width:36px;height:36px;border-radius:50%;background:#16794a;color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;flex-shrink:0}
.step4-ready-title{display:block;font-size:15px;font-weight:700;color:#16794a}
.step4-ready-sub{font-size:12px;color:var(--muted);margin:2px 0 0}
/* ── Step 4 success state ── */
.step4-success{text-align:center;padding:8px 0 4px}
.save-success-wrap{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:24px}
.save-success-check{width:56px;height:56px;border-radius:50%;background:#16794a;color:#fff;display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:700;margin:0 auto}
.save-success-title{font-size:20px;font-weight:800;color:var(--text)}
.save-success-name{font-size:14px;color:var(--muted);margin:0}
.save-success-actions{display:flex;flex-direction:column;gap:10px}
.save-success-actions button{min-height:48px;font-size:15px;font-weight:700;border-radius:14px}
.save-success-actions button:first-child{background:var(--blue);color:#fff;border:none;cursor:pointer;transition:opacity .15s;font-family:inherit}
.save-success-actions button:first-child:hover{opacity:.88}
@media(max-width:480px){
  .review-card{flex-direction:column;align-items:stretch}
  .review-img-col{flex-direction:row;align-items:center}
  .review-thumb{width:64px;height:64px}
  .rv-label{min-width:60px}
  .save-success-actions{gap:8px}
}
/* HjemArkiv 4.4.0 Final – card-style capture buttons & preview polish */
/* ── Card-style action buttons ──────────────────────────────────────── */
.smart-cap-btn{
  background:#fff;
  border:1.5px solid #dde5ef;
  box-shadow:0 2px 8px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);
  /* camera pattern at ~4 % opacity: stroke colour very close to #fff */
  background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'><rect x='8' y='24' width='56' height='34' rx='6' fill='none' stroke='%23eef1f5' stroke-width='2'/><circle cx='36' cy='41' r='10' fill='none' stroke='%23eef1f5' stroke-width='2'/><circle cx='36' cy='41' r='5' fill='none' stroke='%23eef1f5' stroke-width='1.5'/><path d='M24 24l5-8h14l5 8' fill='none' stroke='%23eef1f5' stroke-width='2' stroke-linejoin='round'/><circle cx='56' cy='31' r='2.5' fill='%23eef1f5'/></svg>");
  background-size:72px 72px;background-repeat:repeat;
  /* ↑ spacing tweaks: use gap:0 + per-element margins for independent control */
  gap:0;
  padding:28px 18px;
  transition:border-color 200ms ease,background-color 200ms ease,box-shadow 200ms ease,transform 200ms ease;
}
/* icon: +28 % larger, 9 px breathing room before title */
.smart-cap-btn span{font-size:46px;line-height:1;margin-bottom:9px}
/* title: 6 px before description */
.smart-cap-btn strong{font-size:14px;font-weight:700;color:var(--text);margin-bottom:6px}
.smart-cap-btn small{font-size:12px;line-height:1.45;color:var(--muted);text-align:center;max-width:160px}
.smart-cap-btn:hover,.smart-cap-btn:focus-visible{
  border-color:var(--blue);
  background-color:#f4f8ff;
  box-shadow:0 6px 20px rgba(0,113,227,.14),0 2px 8px rgba(0,0,0,.04);
  transform:translateY(-3px);
  outline:none;
}
.smart-cap-btn:active{transform:translateY(0) scale(.98);box-shadow:0 2px 6px rgba(0,0,0,.08)}
/* ── Image dimensions display ───────────────────────────────────────── */
.sfi-dims{font-size:12px;color:var(--muted)}
/* ── Disabled "Neste" button ────────────────────────────────────────── */
#smartNextStep1:disabled{
  background:#c8d3df;color:#8496a8;
  opacity:1;cursor:not-allowed;
  box-shadow:none;transform:none;
}
/* ── Preview action buttons: min 48 px tap target ───────────────────── */
.smart-photo-actions .secondary{min-height:48px;padding:10px 16px;font-size:14px}
.smart-photo-actions .secondary.small{min-height:40px;padding:8px 12px;font-size:12px}
/* ── Mobile: stack actions vertically, no horizontal scroll ─────────── */
@media(max-width:480px){
  .smart-capture-btns{grid-template-columns:1fr;gap:10px}
  .smart-cap-btn{min-height:80px;flex-direction:row;justify-content:flex-start;gap:14px;padding:16px 18px;text-align:left}
  .smart-cap-btn small{max-width:none;text-align:left}
  .smart-photo-actions{flex-direction:column;gap:8px}
  .smart-photo-actions .secondary,.smart-photo-actions .secondary.small{width:100%;min-height:48px;text-align:center}
  #smartPhotoPreviewArea .smart-preview{max-height:200px}
}

/* ══════════════════════════════════════════════════════════════════════
   HjemArkiv 4.4.2 – Product lookup states
   ══════════════════════════════════════════════════════════════════════ */

.s2-lookup-section{margin:0 0 1rem;}

/* ── Klar til oppslag ─────────────────────────────────────────────── */
.s2-ready-row{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap;margin-bottom:.55rem;}
.s2-barcode-chip{display:inline-flex;align-items:center;gap:.32rem;background:var(--bg-2,#f0f2f5);border:1.5px solid var(--border,#d8dde4);border-radius:999px;padding:.2rem .65rem;font-family:monospace;font-size:.79rem;color:var(--text,#1a1a2e);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.s2-barcode-chip span:first-child{opacity:.5;font-size:.9rem;flex-shrink:0;}
.s2-ready-label{font-size:.79rem;font-weight:700;color:#059669;}
.s2-lookup-btn{width:100%;background:var(--blue,#2563eb);color:#fff;border:none;border-radius:.5rem;padding:.7rem 1rem;font-size:.91rem;font-weight:600;cursor:pointer;transition:background .15s;}
.s2-lookup-btn:hover{background:#1d4ed8;}
.s2-lookup-btn:active{background:#1e3a8a;transform:scale(.98);}

/* ── Søker ───────────────────────────────────────────────────────── */
.s2-searching-row{display:flex;align-items:center;gap:.75rem;padding:.75rem;background:var(--bg-2,#f0f2f5);border-radius:.5rem;font-size:.87rem;color:var(--muted,#6b7280);}

/* ── Produkt funnet ──────────────────────────────────────────────── */
.s2-found-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.6rem;flex-wrap:wrap;}
.s2-found-badge{background:#d1fae5;color:#065f46;font-size:.77rem;font-weight:700;padding:.2rem .58rem;border-radius:999px;white-space:nowrap;}
.s2-source-tag{background:#ede9fe;color:#5b21b6;font-size:.73rem;font-weight:600;padding:.17rem .48rem;border-radius:999px;white-space:nowrap;}
.s2-product-result{display:flex;gap:.8rem;background:var(--bg-2,#f0f2f5);border-radius:.6rem;padding:.72rem;margin-bottom:.68rem;}
.s2-product-img{width:72px;height:72px;object-fit:contain;border-radius:.4rem;background:#fff;flex-shrink:0;border:1px solid var(--border,#d8dde4);}
.s2-product-info{flex:1;min-width:0;}
.s2-prod-name{font-weight:700;font-size:.93rem;margin-bottom:.14rem;word-break:break-word;}
.s2-prod-meta{font-size:.81rem;color:var(--muted,#6b7280);margin-bottom:.08rem;word-break:break-word;}
.s2-prod-sub{font-size:.77rem;}
.s2-prod-barcode{font-size:.75rem;font-family:monospace;color:var(--muted,#6b7280);margin-top:.22rem;opacity:.75;}
.s2-found-actions{display:flex;gap:.55rem;}
.s2-apply-btn{flex:1;background:var(--blue,#2563eb);color:#fff;border:none;border-radius:.5rem;padding:.6rem;font-size:.87rem;font-weight:600;cursor:pointer;transition:background .15s;}
.s2-apply-btn:hover{background:#1d4ed8;}
.s2-ignore-btn{background:transparent;border:1.5px solid var(--border,#d8dde4);border-radius:.5rem;padding:.6rem .82rem;font-size:.87rem;cursor:pointer;color:var(--muted,#6b7280);transition:background .15s;}
.s2-ignore-btn:hover{background:var(--bg-2,#f0f2f5);}

/* ── Ingen produkt funnet / utilgjengelig ────────────────────────── */
.s2-lookup-msg{padding:.78rem .84rem;background:var(--bg-2,#f0f2f5);border-radius:.6rem;}
.s2-lookup-warn{background:#fffbeb;border:1px solid #fcd34d;}
.s2-msg-icon{font-size:1.15rem;margin-bottom:.36rem;}
.s2-msg-body{margin-bottom:.58rem;}
.s2-msg-body strong{display:block;font-size:.87rem;margin-bottom:.18rem;color:var(--text,#1a1a2e);}
.s2-msg-body p{font-size:.8rem;color:var(--muted,#6b7280);margin:0;line-height:1.45;}
.s2-retry-btn{background:#fff;border:1.5px solid var(--border,#d8dde4);border-radius:.5rem;padding:.42rem .84rem;font-size:.81rem;font-weight:600;cursor:pointer;transition:border-color .15s,color .15s;}
.s2-retry-btn:hover{border-color:var(--blue,#2563eb);color:var(--blue,#2563eb);}

@media(max-width:480px){
  .s2-product-img{width:56px;height:56px;}
  .s2-ready-row{flex-direction:column;align-items:flex-start;}
  .s2-found-actions{flex-direction:column;}
  .s2-ignore-btn{text-align:center;}
}

/* ══════════════════════════════════════════════════════════════════════
   HjemArkiv 4.5.0 – AI analysis section
   ══════════════════════════════════════════════════════════════════════ */

.s2-ai-section{margin:0 0 1rem;}

/* ── Klar til analyse ─────────────────────────────────────────────── */
.s2-ai-ready-card{background:var(--bg-2,#f0f2f5);border:1.5px solid var(--border,#d8dde4);border-radius:.65rem;padding:.85rem;}
.s2-ai-ready-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem;flex-wrap:wrap;}
.s2-ai-chip{background:#ede9fe;color:#5b21b6;font-size:.76rem;font-weight:700;padding:.2rem .55rem;border-radius:999px;white-space:nowrap;}
.s2-ai-ready-label{font-size:.82rem;font-weight:600;color:var(--text,#1a1a2e);}
.s2-privacy-note{font-size:.77rem;color:var(--muted,#6b7280);margin:0 0 .75rem;line-height:1.5;}
.s2-ai-start-btn{width:100%;background:linear-gradient(135deg,#7c3aed 0%,#4f46e5 100%);color:#fff;border:none;border-radius:.5rem;padding:.7rem 1rem;font-size:.91rem;font-weight:600;cursor:pointer;transition:opacity .15s,transform .1s;}
.s2-ai-start-btn:hover{opacity:.9;}
.s2-ai-start-btn:active{opacity:.8;transform:scale(.98);}
.s2-ai-start-btn:disabled{opacity:.55;cursor:not-allowed;}

/* ── Progress states ─────────────────────────────────────────────── */
.s2-ai-progress-row{display:flex;align-items:center;gap:.75rem;padding:.75rem;background:var(--bg-2,#f0f2f5);border-radius:.5rem;font-size:.87rem;color:var(--muted,#6b7280);}

/* ── Forslag klare ───────────────────────────────────────────────── */
.s2-ai-done-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.62rem;flex-wrap:wrap;}
.s2-ai-done-badge{background:#ede9fe;color:#5b21b6;font-size:.77rem;font-weight:700;padding:.21rem .58rem;border-radius:999px;white-space:nowrap;}
.s2-ai-source-tag{font-size:.73rem;color:var(--muted,#6b7280);}
.s2-ai-suggestions{background:var(--bg-2,#f0f2f5);border-radius:.6rem;overflow:hidden;margin-bottom:.7rem;border:1px solid var(--border,#d8dde4);}
.s2-ai-sugg-row{display:flex;align-items:center;gap:.45rem;padding:.48rem .65rem;border-bottom:1px solid var(--border,#d8dde4);}
.s2-ai-sugg-row:last-child{border-bottom:none;}
.s2-conf-badge{flex-shrink:0;font-size:.67rem;font-weight:700;padding:.14rem .4rem;border-radius:999px;white-space:nowrap;}
.s2-conf-high{background:#d1fae5;color:#065f46;}
.s2-conf-medium{background:#fef3c7;color:#92400e;}
.s2-conf-low{background:#fee2e2;color:#991b1b;}
.s2-sugg-label{flex-shrink:0;font-size:.77rem;font-weight:600;color:var(--muted,#6b7280);width:4.8rem;min-width:4.8rem;}
.s2-sugg-val{flex:1;font-size:.82rem;color:var(--text,#1a1a2e);word-break:break-word;min-width:0;}
.s2-sugg-apply-one{flex-shrink:0;background:transparent;border:1.5px solid var(--border,#d8dde4);border-radius:.35rem;width:26px;height:26px;font-size:.82rem;cursor:pointer;font-weight:700;color:var(--blue,#2563eb);display:flex;align-items:center;justify-content:center;transition:background .12s,border-color .12s;}
.s2-sugg-apply-one:hover:not(:disabled){background:var(--blue,#2563eb);color:#fff;border-color:var(--blue,#2563eb);}
.s2-sugg-apply-one.applied{background:#d1fae5;color:#065f46;border-color:#6ee7b7;cursor:default;}
.s2-ai-done-actions{display:flex;gap:.55rem;}
.s2-ai-apply-btn{flex:1;background:linear-gradient(135deg,#7c3aed 0%,#4f46e5 100%);color:#fff;border:none;border-radius:.5rem;padding:.6rem;font-size:.87rem;font-weight:600;cursor:pointer;transition:opacity .15s;}
.s2-ai-apply-btn:hover{opacity:.9;}
.s2-ai-apply-btn:disabled{opacity:.55;cursor:not-allowed;}
.s2-ai-ignore-btn{background:transparent;border:1.5px solid var(--border,#d8dde4);border-radius:.5rem;padding:.6rem .82rem;font-size:.87rem;cursor:pointer;color:var(--muted,#6b7280);transition:background .12s;}
.s2-ai-ignore-btn:hover{background:var(--bg-2,#f0f2f5);}

/* ── Negative states ─────────────────────────────────────────────── */
.s2-ai-msg{padding:.78rem .84rem;background:var(--bg-2,#f0f2f5);border-radius:.6rem;}

@media(max-width:480px){
  .s2-ai-done-actions{flex-direction:column;}
  .s2-ai-ignore-btn{text-align:center;}
  .s2-sugg-label{width:4rem;min-width:4rem;}
}

/* ══════════════════════════════════════════════════════════════════════
   HjemArkiv 4.5.0 – Intelligent analysis section (rev.2)
   ══════════════════════════════════════════════════════════════════════ */

.s2-intel-section{margin:0 0 1rem;}

/* ── Ready card ──────────────────────────────────────────────────── */
.s2-intel-ready-card{background:var(--bg-2,#f0f2f5);border:1.5px solid var(--border,#d8dde4);border-radius:.65rem;padding:.85rem;}
.s2-intel-ready-top{display:flex;align-items:center;gap:.5rem;margin-bottom:.52rem;flex-wrap:wrap;}
.s2-intel-bc-chip{display:flex;align-items:center;gap:.3rem;background:#eff6ff;border:1px solid #bfdbfe;border-radius:999px;padding:.18rem .52rem;font-size:.75rem;color:#1d4ed8;font-weight:600;white-space:nowrap;}

/* ── Progress card ──────────────────────────────────────────────── */
.s2-progress-card{background:var(--bg-2,#f0f2f5);border-radius:.65rem;padding:.85rem 1rem;}
.s2-progress-steps{display:flex;flex-direction:column;gap:.38rem;}
.s2-progress-step{display:flex;align-items:center;gap:.65rem;padding:.15rem 0;}
.s2-pstep-icon{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.72rem;font-weight:700;transition:background .2s,color .2s;}
.s2-pstep-inner{display:flex;align-items:center;justify-content:center;width:100%;height:100%;}
.s2-pstep-label{font-size:.84rem;transition:color .2s,font-weight .2s;}
/* Pending */
.s2-pstep-pending .s2-pstep-icon{background:var(--border,#d8dde4);color:var(--muted,#6b7280);}
.s2-pstep-pending .s2-pstep-label{color:var(--muted,#6b7280);}
/* Active */
.s2-pstep-active .s2-pstep-icon{background:#ede9fe;color:#5b21b6;}
.s2-pstep-active .s2-pstep-label{color:var(--text,#1a1a2e);font-weight:600;}
/* Done */
.s2-pstep-done .s2-pstep-icon{background:#d1fae5;color:#065f46;}
.s2-pstep-done .s2-pstep-label{color:var(--text,#1a1a2e);}
/* Skipped */
.s2-pstep-skipped .s2-pstep-icon{background:transparent;color:var(--muted,#6b7280);border:1.5px solid var(--border,#d8dde4);}
.s2-pstep-skipped .s2-pstep-label{color:var(--muted,#6b7280);}
/* Not found */
.s2-pstep-notfound .s2-pstep-icon{background:#fef3c7;color:#92400e;}
.s2-pstep-notfound .s2-pstep-label{color:var(--muted,#6b7280);}
/* Error */
.s2-pstep-error .s2-pstep-icon{background:#fee2e2;color:#991b1b;}
.s2-pstep-error .s2-pstep-label{color:var(--text,#1a1a2e);}
/* Spinner inside active step */
@keyframes pstep-rotate{to{transform:rotate(360deg)}}
.s2-pstep-spin{display:inline-block;width:11px;height:11px;border:2px solid #c4b5fd;border-top-color:#5b21b6;border-radius:50%;animation:pstep-rotate .65s linear infinite;}

/* ── Analysis summary ───────────────────────────────────────────── */
.s2-analysis-summary{background:var(--bg-2,#f0f2f5);border-radius:.6rem;padding:.72rem .82rem;margin-bottom:.65rem;}
.s2-summary-head{margin-bottom:.48rem;}
.s2-summary-details{display:flex;flex-direction:column;gap:.28rem;}
.s2-summary-item{display:flex;justify-content:space-between;align-items:center;font-size:.79rem;gap:.5rem;}
.s2-summary-label{color:var(--muted,#6b7280);}
.s2-summary-val{font-weight:500;color:var(--text,#1a1a2e);text-align:right;}
.s2-conf-inline-high{color:#065f46;font-weight:700;}
.s2-conf-inline-medium{color:#92400e;font-weight:700;}
.s2-conf-inline-low{color:#991b1b;font-weight:700;}
.s2-conf-inline-none{color:var(--muted,#6b7280);}

/* ── Source tags in suggestion rows ────────────────────────────── */
.s2-src-tag{flex-shrink:0;font-size:.65rem;font-weight:700;padding:.13rem .38rem;border-radius:999px;white-space:nowrap;}
.s2-src-barcode{background:#dbeafe;color:#1e40af;}
.s2-src-ai{background:#ede9fe;color:#5b21b6;}
.s2-src-both{background:#d1fae5;color:#065f46;}

/* ── Low-confidence suggestion row tint ────────────────────────── */
.s2-sugg-low .s2-sugg-val{color:var(--muted,#6b7280);}
.s2-sugg-low .s2-sugg-label{color:var(--muted,#6b7280);}

/* ── AI unavailable banner (step 2) ─────────────────────────────── */
.s2-ai-banner{display:flex;align-items:center;gap:.5rem;background:#fffbeb;border:1.5px solid #fcd34d;border-radius:.6rem;padding:.55rem .75rem;margin-bottom:.75rem;font-size:.83rem;color:#92400e;}
.s2-ai-banner-icon{flex-shrink:0;font-size:1rem;}
.s2-ai-banner-text{flex:1;}
.s2-ai-banner-dismiss{margin-left:auto;flex-shrink:0;background:none;border:none;font-size:1.1rem;line-height:1;cursor:pointer;color:#92400e;padding:0 .15rem;opacity:.7;}
.s2-ai-banner-dismiss:hover{opacity:1;}

/* ── No suggestions placeholder ────────────────────────────────── */
.s2-intel-no-sugg{padding:.6rem .8rem;font-size:.82rem;color:var(--muted,#6b7280);}

/* ── Error card ─────────────────────────────────────────────────── */
.s2-intel-error-card{background:var(--bg-2,#f0f2f5);border-radius:.65rem;padding:.9rem 1rem;text-align:center;}
.s2-intel-error-icon{font-size:1.75rem;margin-bottom:.4rem;}
.s2-intel-error-title{font-weight:700;font-size:.9rem;margin-bottom:.28rem;color:var(--text,#1a1a2e);}
.s2-intel-error-msg{font-size:.81rem;color:var(--muted,#6b7280);margin-bottom:.7rem;}
.s2-intel-error-actions{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap;}

@media(max-width:480px){
  .s2-intel-error-actions{flex-direction:column;}
  .s2-summary-item{flex-direction:column;align-items:flex-start;gap:.1rem;}
  .s2-summary-val{text-align:left;}
}

/* ── HjemArkiv 4.5.1 – Export / Print ──────────────────────────────────── */

.export-card { min-width: min(92vw, 480px); }

.export-step-label {
  font-size: .72rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .07em; color: var(--muted); margin-bottom: .75rem;
}
.export-scope-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem;
  margin-bottom: .2rem;
}
.export-fmt-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: .5rem;
}
/* Share grid: 2×2 for the four Del rapport actions */
.export-share-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: .5rem;
  margin-bottom: .1rem;
}
/* Secondary label (Eksporter data) gets breathing room above it */
.export-step-label-data { margin-top: 1.1rem; }

/* ── Language selector ───────────────────────────────────────────── */
/* Vehicle info card (inside policy dialog) */
.vehicle-info-card { background: var(--bg); border: 1px solid var(--border); border-radius: 10px; padding: .6rem .85rem; }
.vehicle-info-head { font-size: .9rem; margin-bottom: .45rem; }
.vehicle-info-table { width: 100%; font-size: .82rem; border-collapse: collapse; }
.vehicle-info-table td { padding: .15rem .35rem .15rem 0; vertical-align: top; }
.vehicle-info-table td:first-child { white-space: nowrap; padding-right: .65rem; color: var(--muted); width: 38%; }
.vehicle-info-source { font-size: .72rem; color: var(--muted); margin-top: .4rem; }
.vehicle-info-error { font-size: .85rem; color: var(--danger, #c0392b); padding: .35rem 0; }
.vehicle-info-loading { font-size: .85rem; padding: .35rem 0; }

/* ── Dekk & felg collapsible (5.3.0) ─────────────────────────────── */
/* Neutral notice shown when vehicle lookup is unavailable for the selected country */
.vehicle-info-notice { font-size: .82rem; color: var(--muted); background: var(--surface-alt, #f5f6f8); border: 1px solid var(--border, #e0e0e0); border-radius: 7px; padding: .45rem .65rem; }
.vi-dekk-details { margin-top: .55rem; }
.vi-dekk-summary {
  list-style: none; cursor: pointer; font-size: .85rem; font-weight: 600;
  padding: .3rem 0; color: var(--fg); user-select: none;
}
.vi-dekk-summary::-webkit-details-marker { display: none; }
.vi-dekk-summary::before { content: '▶ '; font-size: .7rem; transition: transform .15s; display: inline-block; }
.vi-dekk-details[open] .vi-dekk-summary::before { transform: rotate(90deg); }
.vi-dekk-body { padding: .45rem 0 .1rem; display: flex; flex-direction: column; gap: .3rem; }
.vi-dekk-kombo { display: flex; flex-direction: column; gap: .4rem; }
.vi-dekk-kombo-hd { font-size: .75rem; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; margin-bottom: .1rem; }
.vi-dekk-sep { border: none; border-top: 1px dashed var(--border); margin: .35rem 0; }
.vi-dekk-aksel { display: flex; align-items: baseline; gap: .5rem; font-size: .82rem; }
.vi-dekk-ax-lbl { min-width: 5.5rem; font-size: .75rem; color: var(--muted); flex-shrink: 0; }
.vi-dekk-ax-vals { display: flex; flex-direction: column; gap: .1rem; }
.vi-dekk-dim { font-variant-numeric: tabular-nums; }
.vi-dekk-rim { font-size: .79rem; color: var(--muted); }
.vi-dekk-felg { font-variant-numeric: tabular-nums; }
.vi-dekk-tag { font-size: .7rem; background: var(--border); border-radius: 3px; padding: .05rem .3rem; color: var(--muted); margin-left: .2rem; }
.vi-dekk-missing { font-size: .82rem; color: var(--muted); padding: .2rem 0; }
/* EU-kontroll inline badges inside vehicle-info-table */
.eu-badge        { display: inline-block; font-size: .72rem; font-weight: 700; border-radius: 4px; padding: .1rem .35rem; margin-left: .35rem; vertical-align: middle; }
.eu-badge-yellow { background: #fff8e6; border: 1px solid #f0d07a; color: #7a5200; }
.eu-badge-orange { background: #fff3e6; border: 1px solid #f0a060; color: #7a3800; }
.eu-badge-red    { background: #fff0ee; border: 1px solid #f0a8a0; color: #8c1a12; }
.policy-phone { margin: .2rem 0 .15rem; font-size: .85rem; }
.policy-phone-link { color: var(--accent); text-decoration: none; }
.policy-phone-link:hover { text-decoration: underline; }
/* Header: actions group (lang picker + logout) */
.header-actions { display: flex; flex-direction: row; align-items: center; gap: .5rem; flex-shrink: 0; }

/* Header language picker */
.hlang-globe {
  all: unset; cursor: pointer;
  font-size: 1rem; padding: .25rem .3rem; border-radius: 7px;
  line-height: 1; display: flex; align-items: center;
  transition: background .12s; color: var(--text, #111827);
}
.hlang-globe:hover { background: rgba(0,0,0,.07); }
/* #hlangMenu lives as a direct <body> child – all critical styles are inline on the element
   so they are immune to any cascade. Only row-level styles live here. */
.hlang-opt {
  all: unset;                        /* kill global button{} completely */
  box-sizing: border-box;
  display: flex; align-items: center; gap: .42rem;
  width: 100%; padding: .36rem .52rem;
  border-radius: 6px;
  font-family: inherit; font-size: .82rem; font-weight: 500;
  color: #111827; cursor: pointer; white-space: nowrap;
  transition: background .1s;
}
.hlang-opt:hover { background: #f3f4f6; }
.hlang-opt.active { background: #eff6ff; font-weight: 700; color: #1a56db; }
.hlang-flag { font-size: .9rem; flex-shrink: 0; }
.hlang-check { margin-left: auto; font-weight: 800; opacity: 0; font-size: .75rem; color: #1a56db; }
.hlang-opt.active .hlang-check { opacity: 1; }

/* ── Compact collapsible inventory cards ──────────────────────────────────── */
/* ── Rooms toggle bar ────────────────────────────────────────────────────── */
.rooms-toggle-bar {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 0 6px 0; margin-bottom: 4px;
}
.rooms-toggle-btn { font-size: 13px; }
.rooms-panel {
  background: var(--card-bg, #fff); border: 1px solid var(--line);
  border-radius: 16px; padding: 14px 16px 10px;
  margin-bottom: 10px;
}
.rooms-panel[hidden] { display: none; }

/* ── Compact item rows (.ic) ─────────────────────────────────────────────── */
.ic { border-bottom: 1px solid var(--line); overflow: hidden; }
.ic:last-child { border-bottom: 0; }
.ic-row {
  display: grid; grid-template-columns: 1fr 20px;
  gap: 8px; align-items: center; padding: 10px 2px;
  cursor: pointer; user-select: none; -webkit-user-select: none;
}
.ic-row:active { opacity: .8; }
.ic-name {
  font-size: 15px; font-weight: 700;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ic-room { font-size: 12px; color: var(--muted); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ic-val  { font-size: 12.5px; font-weight: 700; color: var(--text); flex-shrink: 0; white-space: nowrap; }
.ic-sub {
  margin-top: 2px; display: flex; align-items: baseline;
  justify-content: space-between; gap: 6px; overflow: hidden;
}
.ic-chev {
  font-size: 19px; color: #9ca3af; font-weight: 900; line-height: 1;
  transition: transform .2s ease; text-align: center; flex-shrink: 0;
}
.ic--open > .ic-row .ic-chev { transform: rotate(90deg); }
/* Expanded panel */
.ic-detail {
  display: none;
  padding: 0 0 12px 4px;
  max-width: 100%; overflow: hidden;
}
.ic--open > .ic-detail { display: block; }
/* Photo strip – fixed 68px tall, horizontal scroll, images never grow */
.ic-photos {
  display: flex; flex-direction: row; flex-wrap: nowrap;
  gap: 6px; align-items: flex-start;
  width: 100%; overflow-x: auto; overflow-y: hidden;
  height: 74px;
  padding-bottom: 2px; margin-bottom: 8px;
  scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.ic-photos::-webkit-scrollbar { display: none; }
/* Detail text lines */
.ic-dl { font-size: 12.5px; color: var(--muted); margin: 2px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ic-dl.ic-notes { white-space: normal; }
.ic-dl strong { color: var(--text); font-weight: 600; }
.ic-actions { margin-top: 9px; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

/* Language selector – single dropdown, all screen sizes */
.lang-settings-card { padding: .7rem 1rem .65rem; }
.lang-settings-row {
  display: flex; flex-direction: column; gap: .45rem;
}
.lang-settings-note { font-size: .78rem; margin: .4rem 0 0; }

.lang-select {
  appearance: none; -webkit-appearance: none;
  -moz-appearance: none;
  display: block; width: 100%; box-sizing: border-box;
  border: 1.5px solid var(--border, #d1d5db); border-radius: .5rem;
  padding: .5rem 2.4rem .5rem .85rem;
  font-size: .95rem; font-weight: 600; color: var(--text, #111827);
  background-color: var(--surface, #fff);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%236b7280' d='M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right .75rem center; background-size: 1.1rem;
  cursor: pointer; line-height: 1.4;
}
.lang-select:focus {
  outline: 2px solid var(--accent, #1a56db); outline-offset: 1px; border-color: var(--accent, #1a56db);
}
.export-scope-btn, .export-fmt-btn {
  display: flex; flex-direction: column; align-items: center; text-align: center;
  gap: .3rem; padding: .85rem .55rem; border-radius: 10px;
  border: 1.5px solid var(--line); background: var(--surface);
  cursor: pointer; transition: border-color .15s, background .15s, transform .1s;
  width: 100%; line-height: 1.25;
}
.export-scope-btn:hover:not(:disabled),
.export-fmt-btn:hover:not(:disabled) {
  background: var(--surface-alt, #f5f5f7);
  border-color: var(--accent, #0066cc);
}
.export-scope-btn:focus-visible,
.export-fmt-btn:focus-visible {
  outline: 2px solid var(--accent, #0066cc); outline-offset: 2px;
}
.export-scope-btn:active:not(:disabled),
.export-fmt-btn:active:not(:disabled) { transform: scale(.97); }
.export-scope-btn:disabled { opacity: .38; cursor: not-allowed; }
.eso-icon { font-size: 1.55rem; line-height: 1; }
.eso-title { font-size: .82rem; font-weight: 650; color: var(--text); }
.eso-sub {
  font-size: .71rem; color: var(--muted); line-height: 1.35;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;
}
.export-step2-head {
  display: flex; align-items: center; gap: .6rem; margin-bottom: .9rem;
}
.export-back-btn {
  flex-shrink: 0; font-size: .82rem; color: var(--accent, #0066cc);
  background: none; border: none; cursor: pointer; padding: .25rem .4rem;
  border-radius: 4px; text-decoration: underline;
}
.export-back-btn:hover { opacity: .7; }
.export-back-btn:focus-visible { outline: 2px solid var(--accent, #0066cc); }
.export-scope-chosen {
  font-size: .85rem; font-weight: 600; color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.export-status {
  padding: .6rem .9rem; border-radius: 8px;
  font-size: .83rem; font-weight: 500; margin-top: .6rem;
}
.export-status-busy { background: #fef3c7; color: #92400e; }
.export-status-done { background: #d1fae5; color: #065f46; }
.export-status-error { background: #fee2e2; color: #991b1b; }

.room-card { position: relative; }
.room-card-actions {
  position: absolute; top: .5rem; right: .5rem; z-index: 2;
  display: flex; flex-direction: row-reverse; align-items: center; gap: .35rem;
  max-width: calc(100% - 1rem);
}
.room-card-actions .room-edit,
.room-card-actions .room-export-btn { position: static; }
.room-export-btn {
  font-size: .8rem; padding: .25rem .45rem; line-height: 1;
  border-radius: 6px; border: 1px solid var(--line); background: rgba(255,255,255,.9);
  cursor: pointer; opacity: 0; transition: opacity .15s; z-index: 2;
}
.room-card:hover .room-export-btn,
.room-card:focus-within .room-export-btn { opacity: 1; }
@media (hover: none) { .room-export-btn { opacity: 1; } }

.active-room-actions { display: flex; gap: .4rem; align-items: center; }

@media (max-width: 520px) {
  .export-scope-grid { grid-template-columns: 1fr; }
  .export-fmt-grid { grid-template-columns: 1fr; }
}
@media (max-width: 380px) {
  .export-scope-btn, .export-fmt-btn { padding: .7rem .4rem; }
  .eso-icon { font-size: 1.3rem; }
  .eso-title { font-size: .78rem; }
}

/* ── @media print: hide UI when printing main page ────────────────── */
@media print {
  header, nav, #appNav, .app-nav, dialog,
  .toolbar, .quick-actions, .welcome-card,
  .dashboard-metrics, .dashboard-grid,
  .smart-register-cta, .insight-grid, .smart-score-card,
  #addRoomBtn, #addItemBtn, #exportInventoryBtn, #exportRoomBarBtn,
  .room-edit, .room-export-btn, .actions,
  button:not([type="submit"]) { display: none !important; }
  main { padding: 0 !important; }
  .card { box-shadow: none !important; border: 1px solid #ddd !important; }
}

/* ── HjemArkiv 4.6.0 – Insurance & Value ──────────────────────────────── */

/* Item form – collapsible insurance section */
.item-ins-details { border-radius: 8px; border: 1.5px solid var(--line); margin-bottom: 1rem; overflow: hidden; }
.item-ins-details > summary {
  padding: .65rem .9rem; cursor: pointer; font-size: .86rem; font-weight: 600;
  display: flex; justify-content: space-between; align-items: center;
  list-style: none; user-select: none;
}
.item-ins-details > summary::-webkit-details-marker { display: none; }
.item-ins-details[open] > summary { border-bottom: 1.5px solid var(--line); }
.item-ins-arrow { font-size: .7rem; color: var(--muted); transition: transform .2s; display: inline-block; }
.item-ins-details[open] .item-ins-arrow { transform: rotate(90deg); }
.item-ins-body { padding: .75rem .9rem .9rem; }
.doc-checks { display: flex; flex-direction: column; gap: .4rem; margin-top: .85rem; }
.check-row { display: flex; align-items: center; gap: .5rem; font-size: .86rem; cursor: pointer; }
.check-row input[type="checkbox"] { width: 1rem; height: 1rem; flex-shrink: 0; accent-color: var(--accent, #0066cc); }

/* Documentation status badges */
.doc-badge {
  display: inline-block; font-size: .7rem; font-weight: 600;
  padding: .1rem .42rem; border-radius: 99px; white-space: nowrap; line-height: 1.6; vertical-align: middle;
}
.doc-complete { background: #d1fae5; color: #065f46; }
.doc-partial  { background: #fef3c7; color: #92400e; }
.doc-missing  { background: #fee2e2; color: #991b1b; }

/* Insurance dashboard card */
/* Standalone warranty panel (replaces 3-panel grid) */
.warranty-standalone{margin-bottom:16px}
/* Image type badge and inline select */
.file-type-row{margin:6px 0 4px}
.img-type-select{width:100%;padding:5px 8px;font-size:12px;border-radius:9px;border:1px solid var(--line);background:#fafbfc;color:var(--text);cursor:pointer}
.img-type-badge{font-size:11px;padding:3px 7px;border-radius:999px;font-weight:700}
.img-type-product{background:#e7f2ff;color:#0068c9}
.img-type-serial{background:#f3eeff;color:#6b4ecf}
.img-type-receipt{background:#e7f6ed;color:#176c42}
.img-type-damage{background:#fff0ee;color:#c0351a}
.img-type-other{background:#eef1f5;color:var(--muted)}
/* Archive completeness card */
.completeness-score-line{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--muted);margin-bottom:6px}
.completeness-score-pct{font-size:22px;font-weight:800;color:var(--text)}
.completeness-bar-track{height:10px;border-radius:999px;background:#eef1f5;overflow:hidden;margin-bottom:14px}
.completeness-bar-fill{height:100%;border-radius:999px;transition:width .5s ease;background:var(--blue)}
.completeness-bar-fill.c-good{background:#16794a}
.completeness-bar-fill.c-warn{background:#d97706}
.completeness-bar-fill.c-low{background:#b42318}
.completeness-item-list{display:flex;flex-direction:column}
.completeness-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid #ececef;cursor:pointer}
.completeness-row:last-child{border-bottom:0}
.completeness-row:hover .completeness-row-name{color:var(--blue)}
.completeness-row-name{font-size:14px;font-weight:700}
.completeness-row-missing{font-size:11px;color:var(--muted);margin-top:2px}
.completeness-show-all{margin-top:10px}
.completeness-disclaimer{font-size:12px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line);margin-bottom:0}

/* Zone 3 – conditional alert banner */
.dash-alert-banner { margin-bottom: 12px; display: flex; flex-direction: column; gap: 6px; }
.dash-alert-item { display: flex; align-items: center; gap: 10px; border-radius: 12px; padding: 10px 14px; cursor: pointer; font-size: 14px; font-weight: 600; border: 1px solid transparent; transition: background .15s; }
.dash-alert-caution { background: #fff8e6; border-color: #f0d07a; color: #7a5200; }
.dash-alert-caution:hover { background: #fef3cc; }
.dash-alert-danger  { background: #fff0ee; border-color: #f0a8a0; color: #8c1a12; }
.dash-alert-danger:hover  { background: #ffe8e5; }
.dash-alert-urgent  { background: #fff3e6; border-color: #f0a060; color: #7a3800; }
.dash-alert-urgent:hover  { background: #ffe8cc; }
.dash-alert-icon { font-size: 16px; flex-shrink: 0; }
.dash-alert-text { flex: 1; }
.dash-alert-arrow { font-size: 18px; opacity: .5; }

/* Zone 4a – insurance card as collapsible <details> */
details.card.ins-dash-card > summary { list-style: none; cursor: pointer; display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; }
details.card.ins-dash-card > summary::-webkit-details-marker { display: none; }
details.card.ins-dash-card[open] > summary { margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--line, #e8e8f0); }
.ins-dash-summary-left { flex: 1 1 100%; min-width: 0; }
.ins-dash-summary-left h2 { margin-bottom: 0; }
.ins-dash-summary-meta { font-size: 13px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: 1 1 0; min-width: 0; }
@media(min-width:540px){
  .ins-dash-summary-left { flex: 1 1 auto; }
}

.ins-dash-card { margin-bottom: 1.25rem; }
.ins-dash-metrics {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: .6rem;
  margin: .75rem 0;
}
.ins-dash-cell {
  background: var(--bg-2, #f0f2f5); border-radius: 8px; padding: .6rem .8rem;
  display: flex; flex-direction: column; gap: .2rem;
}
.ins-dash-cell > span { font-size: .7rem; color: var(--muted); font-weight: 500; }
.ins-dash-cell > strong { font-size: 1rem; font-weight: 700; color: var(--text); line-height: 1.2; }

/* Coverage bar */
.ins-cov-wrap { margin-top: .75rem; }
.ins-cov-label-row { display: flex; justify-content: space-between; font-size: .76rem; margin-bottom: .35rem; color: var(--muted); }
.ins-cov-track { height: 8px; background: var(--line); border-radius: 99px; overflow: hidden; }
.ins-cov-fill { height: 100%; background: var(--accent, #0066cc); border-radius: 99px; transition: width .4s ease; }
.ins-cov-warn { background: #f59e0b !important; }
.ins-cov-over { background: #ef4444 !important; }

/* Warning banners */
.ins-warnings { display: flex; flex-direction: column; gap: .45rem; margin-top: .8rem; }
.ins-warn { display: flex; gap: .6rem; align-items: flex-start; padding: .55rem .75rem; border-radius: 8px; font-size: .82rem; line-height: 1.4; }
.warn-danger  { background: #fee2e2; color: #991b1b; }
.warn-caution { background: #fef3c7; color: #92400e; }
.warn-info    { background: #eff6ff; color: #1e40af; }

/* High-value panel */
.hv-row { gap: .6rem; align-items: flex-start; }
.hv-info { flex: 1; min-width: 0; }
.hv-right { display: flex; flex-direction: column; align-items: flex-end; gap: .25rem; flex-shrink: 0; }

/* Insurance settings section */
.ins-threshold-row { margin-top: .85rem; display: flex; flex-direction: column; gap: .3rem; }
.ins-threshold-row input { max-width: 220px; }
/* Insurance settings compact card */
.ins-settings-compact { padding: .75rem 1rem; }
.ins-sum-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: .75rem; flex-wrap: wrap;
}
.ins-sum-status { font-size: .85rem; flex: 1; min-width: 0; }
.ins-sum-main { font-weight: 600; color: var(--text, #111827); }
.ins-sum-badge {
  display: inline-flex; align-items: center;
  background: var(--surface-alt, #f5f6f8); border: 1px solid var(--border, #d1d5db);
  border-radius: 999px; font-size: .73rem; font-weight: 600; color: var(--muted, #6b7280);
  padding: .1rem .5rem; margin-left: .35rem; white-space: nowrap;
}
.ins-threshold-compact {
  margin-top: .65rem; padding-top: .6rem;
  border-top: 1px solid var(--line, #e5e7eb);
  display: flex; flex-direction: column; gap: .25rem;
}
.ins-threshold-compact label { font-size: .82rem; font-weight: 600; color: var(--text, #111827); }
.ins-threshold-compact input { max-width: 140px; }

/* Override export scope grid to 2-col to fit 4 items */
.export-scope-grid { grid-template-columns: repeat(2, 1fr) !important; }

@media (max-width: 520px) {
  .ins-dash-metrics { grid-template-columns: repeat(2, 1fr); }
  .export-scope-grid { grid-template-columns: 1fr !important; }
}

/* ── HjemArkiv 4.7.0 – Document module ──────────────────────────────────────── */

/* Document overview – filter bar */
.doc-search-form { margin-bottom: .75rem; }
.doc-search-label { display: block; margin-bottom: .4rem; color: var(--ink, #172033); font-size: .9rem; font-weight: 700; }
.doc-search-row { display: flex; align-items: stretch; gap: .5rem; }
.doc-search-row input[type="search"] { flex: 1 1 260px; min-width: 0; min-height: 46px; }
.doc-search-row button { flex: 0 0 auto; min-height: 46px; padding-inline: 1rem; }
.doc-search-status { min-height: 1.2rem; margin: .35rem 0 0; color: var(--muted, #6b7280); font-size: .78rem; }
.doc-filter-bar {
  display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem;
}
.doc-filter-bar select { flex: 0 1 160px; min-width: 130px; }
.doc-reset-btn { min-height: 44px; }

/* Warranty expiry panel */
.warranty-expiry-panel { border-left: 4px solid var(--warning, #f59e0b); }
.doc-expiry-head { display: flex; align-items: center; gap: .5rem; font-weight: 600; margin-bottom: .75rem; color: var(--warning, #f59e0b); }
.doc-expiry-item { display: flex; justify-content: space-between; align-items: center; padding: .5rem 0; border-bottom: 1px solid var(--border, #e5e7eb); cursor: pointer; gap: .5rem; }
.doc-expiry-item:last-child { border-bottom: none; }
.doc-expiry-item:hover { background: var(--hover, #f9fafb); border-radius: var(--radius, 8px); padding-inline: .5rem; }
.doc-expiry-date { font-size: .8rem; color: var(--muted, #6b7280); white-space: nowrap; }
.doc-expiry-date.urgent { color: #dc2626; font-weight: 600; }

/* Document list rows */
.document-list { display: flex; flex-direction: column; gap: .5rem; }
.document-row { display: grid; grid-template-columns: 2.5rem 1fr auto; align-items: center; gap: .75rem; padding: .75rem; border: 1px solid var(--border, #e5e7eb); border-radius: var(--radius, 8px); background: var(--surface, #fff); }
.document-icon { font-size: 1.4rem; text-align: center; line-height: 1; }
.document-info { min-width: 0; }
.document-title { font-weight: 600; font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.document-meta { font-size: .8rem; color: var(--muted, #6b7280); margin-top: .15rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.document-date { font-size: .78rem; color: var(--muted, #6b7280); margin-top: .1rem; }
.document-actions { display: flex; gap: .4rem; flex-shrink: 0; }

/* Document type badges */
.doc-type-badge { display: inline-block; font-size: .72rem; font-weight: 600; border-radius: 4px; padding: .1rem .4rem; text-transform: uppercase; letter-spacing: .03em; vertical-align: middle; }
.doc-type-receipt    { background: #fef9c3; color: #854d0e; }
.doc-type-warranty   { background: #dcfce7; color: #166534; }
.doc-type-manual     { background: #dbeafe; color: #1e40af; }
.doc-type-valuation  { background: #fae8ff; color: #6b21a8; }
.doc-type-insurance_doc { background: #e0f2fe; color: #075985; }
.doc-type-document   { background: #f3f4f6; color: #374151; }
.doc-type-other      { background: #f3f4f6; color: #374151; }

/* Doc dialog – file upload area */
.doc-file-area { margin-bottom: .75rem; }
.doc-upload-box { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .25rem; padding: 1.25rem; border: 2px dashed var(--border, #d1d5db); border-radius: var(--radius, 8px); cursor: pointer; transition: border-color .15s, background .15s; text-align: center; width: 100%; }
.doc-upload-box:hover { border-color: var(--accent, #2563eb); background: var(--accent-soft, #eff6ff); }
.doc-upload-box span { font-size: 1.5rem; }
.doc-upload-box strong { font-size: .9rem; }
.doc-upload-box small { color: var(--muted, #6b7280); font-size: .78rem; }
.doc-file-chosen { padding: .5rem .75rem; background: var(--surface-alt, #f9fafb); border: 1px solid var(--border, #e5e7eb); border-radius: var(--radius, 8px); font-size: .85rem; margin-top: .4rem; }

/* Upload progress */
.doc-upload-progress { margin: .5rem 0; }
.doc-progress-bar { height: 6px; background: var(--border, #e5e7eb); border-radius: 3px; overflow: hidden; margin-bottom: .3rem; }
.doc-progress-fill { height: 100%; background: var(--accent, #2563eb); border-radius: 3px; transition: width .3s ease; width: 0%; }
.doc-progress-text { font-size: .8rem; color: var(--muted, #6b7280); }

/* Item form – document section */
.item-docs-wrap { margin-top: 1rem; padding-top: .75rem; border-top: 1px solid var(--border, #e5e7eb); }
.item-docs-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: .5rem; }
.item-doc-list { display: flex; flex-direction: column; gap: .4rem; }
.item-doc-card { display: grid; grid-template-columns: 2rem 1fr auto; align-items: center; gap: .6rem; padding: .6rem; border: 1px solid var(--border, #e5e7eb); border-radius: var(--radius, 8px); background: var(--surface, #fff); }
.item-doc-icon { font-size: 1.2rem; text-align: center; }
.item-doc-info { min-width: 0; }
.item-doc-title { font-size: .88rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-doc-meta { font-size: .76rem; color: var(--muted, #6b7280); margin-top: .1rem; }
.item-doc-actions { display: flex; gap: .3rem; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end; }

/* Field error */
.field-error { color: #dc2626; font-size: .85rem; padding: .35rem .5rem; background: #fef2f2; border: 1px solid #fecaca; border-radius: var(--radius, 6px); }

/* Responsive tweaks */
@media (max-width: 520px) {
  .document-row { grid-template-columns: 2rem 1fr; }
  .document-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .item-doc-card { grid-template-columns: 2rem 1fr; }
  .item-doc-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .doc-filter-bar select { flex: 1 1 130px; }
}

/* ── HjemArkiv 4.7.1 – Stability & Polish overrides ─────────────────────────── */

/* Document rows: more compact, better text overflow */
.document-row { padding: .6rem .75rem; gap: .6rem; }
.document-title { overflow-wrap: break-word; word-break: break-word; white-space: normal; }
.document-meta { overflow-wrap: break-word; white-space: normal; }

/* Document list empty state */
#documentsEmpty { padding: 2rem 1rem; text-align: center; color: var(--muted,#6b7280); font-size: .95rem; }

/* Item doc card: filename wraps */
.item-doc-title { overflow-wrap: break-word; word-break: break-word; white-space: normal; }

/* Action buttons: min touch target */
.document-actions button,
.item-doc-actions button {
  min-height: 36px;
  padding-block: .3rem;
}

/* Filter bar: always wraps, no horizontal scroll */
.doc-filter-bar { flex-wrap: wrap; overflow: hidden; }
.doc-filter-bar input[type="search"],
.doc-filter-bar select { min-width: 0; box-sizing: border-box; }

/* Dialog: fit viewport on small screens */
#docDialog, #itemDialog, #exportDialog {
  max-height: min(90dvh, 90vh);
  overflow-y: auto;
}

/* Upload box inside dialog: less tall on mobile */
.doc-upload-box { padding: .9rem 1rem; }

/* Doc type badge: don't overflow narrow containers */
.doc-type-badge { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Warranty expiry item: wrap on narrow screens */
.doc-expiry-item { flex-wrap: wrap; gap: .25rem; }
.doc-expiry-date { flex-shrink: 0; }

/* Focus rings */
.document-actions button:focus-visible,
.item-doc-actions button:focus-visible,
.doc-filter-bar input:focus-visible,
.doc-filter-bar select:focus-visible { outline: 2px solid var(--accent,#2563eb); outline-offset: 2px; }

/* Responsive: 320–375 px */
@media (max-width: 480px) {
  .document-row { grid-template-columns: 2rem 1fr; gap: .4rem; padding: .5rem; }
  .document-actions { grid-column: 1 / -1; gap: .3rem; flex-wrap: wrap; }
  .document-actions button,
  .item-doc-actions button { min-height: 44px; font-size: .82rem; padding-inline: .6rem; }
  .item-doc-card { grid-template-columns: 1.8rem 1fr; gap: .4rem; padding: .5rem; }
  .item-doc-actions { grid-column: 1 / -1; flex-wrap: wrap; gap: .3rem; }
  .doc-filter-bar { gap: .35rem; }
  .doc-filter-bar select { flex: 1 1 100%; max-width: 100%; }
  .doc-search-row { flex-wrap: wrap; }
  .doc-search-row input[type="search"] { flex-basis: 100%; width: 100%; font-size: 16px; }
  .doc-search-row button { flex: 1 1 calc(50% - .25rem); min-height: 44px; }
  .doc-reset-btn { flex: 1 1 100%; width: 100%; min-height: 44px; }
  #docDialog .grid.two { grid-template-columns: 1fr; }
}

/* ── HjemArkiv 4.8.0 – AI Assistant ─────────────────────────────────────────── */

/* Chat card */
.ai-chat-card { display: flex; flex-direction: column; gap: .75rem; }
.ai-chat-head { display: flex; align-items: flex-start; justify-content: space-between; gap: .5rem; }
.ai-chat-head h3 { margin: 0; font-size: 1.05rem; }

/* Message list */
.ai-messages { display: flex; flex-direction: column; gap: .6rem; min-height: 3rem; max-height: 420px; overflow-y: auto; padding: .25rem 0; }
.ai-empty { color: var(--muted,#6b7280); font-size: .9rem; padding: .5rem 0; }

/* Messages */
.ai-msg { display: flex; gap: .5rem; align-items: flex-start; }
.ai-msg-user { flex-direction: row-reverse; }
.ai-bubble { max-width: 85%; padding: .55rem .85rem; border-radius: 14px; font-size: .9rem; line-height: 1.5; word-break: break-word; }
.ai-msg-user  .ai-bubble { background: var(--accent,#2563eb); color: #fff; border-bottom-right-radius: 4px; }
.ai-msg-assistant .ai-bubble { background: var(--surface-alt,#f3f4f6); color: var(--text,#111); border-bottom-left-radius: 4px; }
.ai-bubble p { margin: .25rem 0; }
.ai-bubble p:first-child { margin-top: 0; }
.ai-bubble p:last-child { margin-bottom: 0; }
.ai-bubble ul { margin: .25rem 0 .25rem 1.1rem; padding: 0; }
.ai-bubble li { margin-bottom: .15rem; }
.ai-bubble a { color: var(--accent,#2563eb); text-decoration: underline; }
.ai-msg-user .ai-bubble a { color: #bfdbfe; }
.ai-avatar { width: 1.8rem; height: 1.8rem; border-radius: 50%; background: var(--accent,#2563eb); color: #fff; display: flex; align-items: center; justify-content: center; font-size: .9rem; flex-shrink: 0; margin-top: .2rem; }
.ai-retry-btn { align-self: flex-start; margin-top: .3rem; }

/* Loading */
.ai-loading { display: flex; align-items: center; gap: .4rem; font-size: .88rem; color: var(--muted,#6b7280); padding: .3rem 0; }
.ai-spin { display: inline-block; animation: ai-spin 1s linear infinite; font-style: normal; }
@keyframes ai-spin { to { transform: rotate(360deg); } }

/* Error */
.ai-error { color: #dc2626; }
.ai-source { font-size: .75rem; margin-top: .25rem !important; }

/* Consent block */
.ai-consent { display: flex; flex-direction: column; gap: .5rem; }
.ai-consent-note { font-size: .8rem; color: var(--muted,#6b7280); margin: 0 !important; }
.ai-consent-yes { align-self: flex-start; }

/* Suggestion chips */
.ai-suggestions { display: flex; flex-wrap: wrap; gap: .4rem; }
.ai-suggestion-chip { background: var(--surface-alt,#f3f4f6); border: 1px solid var(--border,#e5e7eb); border-radius: 20px; padding: .3rem .75rem; font-size: .82rem; cursor: pointer; transition: background .15s, border-color .15s; line-height: 1.4; }
.ai-suggestion-chip:hover { background: var(--accent-soft,#eff6ff); border-color: var(--accent,#2563eb); color: var(--accent,#2563eb); }
.ai-suggestion-chip:focus-visible { outline: 2px solid var(--accent,#2563eb); outline-offset: 2px; }

/* Privacy note */
.ai-privacy { display: flex; gap: .4rem; align-items: flex-start; font-size: .78rem; color: var(--muted,#6b7280); padding: .3rem .5rem; background: var(--surface-alt,#f3f4f6); border-radius: 8px; }

/* Input row */
.ai-input-row { display: flex; gap: .5rem; }
.ai-input-row input { flex: 1; min-width: 0; }
.ai-input-row button { flex-shrink: 0; }

/* AI settings card */
.ai-settings-card { }
.ai-settings-rows { display: flex; flex-direction: column; gap: .5rem; }
.ai-settings-row { display: flex; justify-content: space-between; align-items: center; padding: .4rem 0; border-bottom: 1px solid var(--border,#e5e7eb); font-size: .9rem; }
.ai-settings-row:last-child { border-bottom: none; }
.ai-status-active { color: #16a34a; font-weight: 600; }

/* Responsive */
@media (max-width: 520px) {
  .ai-messages { max-height: 320px; }
  .ai-bubble { max-width: 95%; font-size: .85rem; }
  .ai-suggestion-chip { font-size: .78rem; padding: .25rem .6rem; }
}

/* ── HjemArkiv 4.8.1 – AI Assistant Experience (overrides & additions) ───────── */

/* Layout overrides for message structure */
.ai-msg {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  max-width: 100%;
}
.ai-msg-user  { flex-direction: row-reverse; }
.ai-msg-body  { display: flex; flex-direction: column; gap: .2rem; max-width: 85%; }

/* Bubbles */
.ai-bubble-user {
  background: var(--accent,#2563eb);
  color: #fff;
  padding: .55rem .85rem;
  border-radius: 16px 16px 4px 16px;
  font-size: .9rem;
  line-height: 1.5;
  word-break: break-word;
  white-space: pre-wrap;
}
.ai-bubble-assistant {
  background: var(--surface-alt,#f3f4f6);
  color: var(--text,#111);
  padding: .65rem .9rem;
  border-radius: 4px 16px 16px 16px;
  font-size: .9rem;
  line-height: 1.55;
  word-break: break-word;
}
.ai-bubble-assistant p  { margin: .25rem 0; }
.ai-bubble-assistant p:first-child { margin-top: 0; }
.ai-bubble-assistant p:last-child  { margin-bottom: 0; }
.ai-bubble-assistant ul { margin: .3rem 0 .3rem 1.1rem; padding: 0; }
.ai-bubble-assistant li { margin-bottom: .2rem; }
.ai-bubble-assistant a  { color: var(--accent,#2563eb); text-decoration: underline; }
.ai-bubble-assistant strong { font-weight: 600; }

/* Timestamps */
.ai-msg-meta { font-size: .72rem; color: var(--muted,#9ca3af); padding: 0 .2rem; }
.ai-msg-user  .ai-msg-meta { text-align: right; }

/* Message action buttons */
.ai-msg-actions { display: flex; flex-wrap: wrap; gap: .35rem; padding: .15rem .1rem; }
.ai-action-btn {
  background: none;
  border: 1px solid var(--border,#e5e7eb);
  border-radius: 6px;
  color: var(--muted,#6b7280);
  font-size: .75rem;
  padding: .2rem .55rem;
  cursor: pointer;
  line-height: 1.4;
  transition: background .12s, color .12s, border-color .12s;
  min-height: 28px;
}
.ai-action-btn:hover { background: var(--surface-alt,#f3f4f6); color: var(--text,#111); border-color: var(--accent,#2563eb); }
.ai-action-btn:focus-visible { outline: 2px solid var(--accent,#2563eb); outline-offset: 2px; }
.ai-action-retry { color: var(--accent,#2563eb); border-color: var(--accent,#2563eb); }

/* Empty state */
.ai-empty { text-align: center; padding: 2rem 1rem 1.25rem; }
.ai-empty-icon { font-size: 2.2rem; margin-bottom: .75rem; display: block; opacity: .5; }
.ai-empty p { margin: .25rem 0; }

/* Loading */
.ai-loading { display: flex; align-items: center; gap: .45rem; font-size: .88rem; color: var(--muted,#6b7280); padding: .2rem 0; }
.ai-spin { display: inline-block; animation: ai-spin481 1s linear infinite; font-style: normal; }
@keyframes ai-spin481 { to { transform: rotate(360deg); } }

/* Item cards */
.ai-item-list { display: flex; flex-direction: column; gap: .45rem; margin-top: .4rem; }
.ai-item-card {
  display: flex;
  align-items: center;
  gap: .6rem;
  background: var(--surface,#fff);
  border: 1px solid var(--border,#e5e7eb);
  border-radius: 10px;
  padding: .45rem .6rem;
  min-height: 52px;
}
.ai-thumb-wrap { flex-shrink: 0; width: 40px; height: 40px; }
.ai-thumb {
  width: 40px; height: 40px;
  border-radius: 7px;
  object-fit: cover;
  display: block;
}
.ai-thumb-ph {
  width: 40px; height: 40px;
  border-radius: 7px;
  background: var(--accent-soft,#eff6ff);
  color: var(--accent,#2563eb);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem; font-weight: 700;
}
.ai-item-info  { flex: 1; min-width: 0; }
.ai-item-name  { font-size: .88rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ai-item-meta  { font-size: .77rem; color: var(--muted,#6b7280); margin-top: .05rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ai-open-btn   { flex-shrink: 0; }

/* Room list */
.ai-room-list  { display: flex; flex-direction: column; gap: .3rem; margin-top: .4rem; }
.ai-room-row   { display: flex; align-items: center; gap: .5rem; padding: .35rem .5rem; background: var(--surface-alt,#f3f4f6); border-radius: 8px; }
.ai-room-row span:first-child { flex: 1; font-size: .88rem; font-weight: 500; }
.ai-room-val   { font-size: .88rem; color: var(--muted,#6b7280); white-space: nowrap; }

/* Action card */
.ai-action-card { margin-top: .5rem; display: flex; }
.ai-action-row  { gap: .5rem; flex-wrap: wrap; }

/* Chat card overrides */
.ai-chat-card { display: flex; flex-direction: column; gap: .65rem; }
.ai-chat-head  { display: flex; align-items: flex-start; justify-content: space-between; gap: .5rem; flex-wrap: wrap; }
.ai-chat-head h3 { margin: 0; font-size: 1.05rem; }

/* Messages container */
.ai-messages { display: flex; flex-direction: column; gap: .75rem; min-height: 4rem; max-height: 460px; overflow-y: auto; padding: .25rem .05rem; scroll-behavior: smooth; }

/* Suggestion chips */
.ai-suggestions { display: flex; flex-wrap: wrap; gap: .4rem; }
.ai-suggestion-chip {
  background: var(--surface-alt,#f3f4f6);
  border: 1px solid var(--border,#e5e7eb);
  border-radius: 20px;
  padding: .35rem .8rem;
  font-size: .82rem;
  cursor: pointer;
  line-height: 1.4;
  transition: background .14s, border-color .14s, color .14s;
  min-height: 32px;
}
.ai-suggestion-chip:hover { background: var(--accent-soft,#eff6ff); border-color: var(--accent,#2563eb); color: var(--accent,#2563eb); }
.ai-suggestion-chip:focus-visible { outline: 2px solid var(--accent,#2563eb); outline-offset: 2px; }

/* Privacy note */
.ai-privacy { display: flex; gap: .4rem; align-items: flex-start; font-size: .78rem; color: var(--muted,#6b7280); padding: .3rem .55rem; background: var(--surface-alt,#f3f4f6); border-radius: 8px; }

/* Input row with textarea */
.ai-input-row { display: flex; gap: .5rem; align-items: flex-end; }
.ai-input-row textarea {
  flex: 1;
  min-width: 0;
  resize: none;
  overflow: hidden;
  min-height: 40px;
  line-height: 1.45;
  padding: .55rem .75rem;
  border-radius: 10px;
  border: 1px solid var(--border,#e5e7eb);
  font-family: inherit;
  font-size: .9rem;
  background: var(--surface,#fff);
  color: var(--text,#111);
  transition: border-color .15s;
}
.ai-input-row textarea:focus { outline: none; border-color: var(--accent,#2563eb); box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
.ai-input-row textarea:focus-visible { outline: 2px solid var(--accent,#2563eb); outline-offset: 0; }
.ai-input-row button { flex-shrink: 0; min-height: 40px; align-self: flex-end; }
.ai-input-row button:disabled { opacity: .45; cursor: not-allowed; }

/* AI settings card */
.ai-settings-card { }
.ai-settings-rows { display: flex; flex-direction: column; }
.ai-settings-row { display: flex; justify-content: space-between; align-items: center; padding: .5rem 0; border-bottom: 1px solid var(--border,#e5e7eb); font-size: .9rem; }
.ai-settings-row:last-child { border-bottom: none; }
.ai-status-active { color: #16a34a; font-weight: 600; }

/* Avatar */
.ai-avatar { width: 1.9rem; height: 1.9rem; border-radius: 50%; background: var(--accent,#2563eb); color: #fff; display: flex; align-items: center; justify-content: center; font-size: .9rem; flex-shrink: 0; margin-top: .3rem; }

/* Mobile */
@media (max-width: 520px) {
  .ai-messages  { max-height: 340px; }
  .ai-msg-body  { max-width: 93%; }
  .ai-bubble-user, .ai-bubble-assistant { font-size: .85rem; }
  .ai-suggestion-chip { font-size: .78rem; padding: .3rem .65rem; min-height: 36px; }
  .ai-item-card { padding: .35rem .5rem; }
  .ai-thumb, .ai-thumb-ph, .ai-thumb-wrap { width: 34px; height: 34px; }
  .ai-msg-actions { gap: .25rem; }
  .ai-action-btn { font-size: .72rem; min-height: 30px; }
  .ai-action-row { flex-direction: column; }
  .ai-action-row button { width: 100%; }
  .ai-input-row button { padding: .55rem .85rem; min-height: 44px; }
}

/* ── HjemArkiv 4.8.2 – Interactive Dashboard ─────────────────────────────────── */

/* Clickable metric cards */
.metric-clickable {
  cursor: pointer;
  position: relative;
  transition: transform .15s ease, box-shadow .15s ease;
  outline-offset: 3px;
}
.metric-clickable:hover  { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0,0,0,.10); }
.metric-clickable:active { transform: translateY(0); box-shadow: none; }
.metric-clickable:focus-visible { outline: 2px solid var(--accent,#2563eb); }
.metric-clickable:hover .metric-arrow { opacity: 1; transform: translate(0,0); }

.metric-arrow {
  position: absolute;
  top: .65rem;
  right: .75rem;
  font-size: .82rem;
  color: var(--accent,#2563eb);
  opacity: 0;
  transform: translate(-3px, 3px);
  transition: opacity .14s, transform .14s;
  pointer-events: none;
  font-style: normal;
  line-height: 1;
}

/* ── Shared dashboard dialog shell ────────────────────────────────── */
#roomOverviewDialog, #valueOverviewDialog, #imageGalleryDialog, #warrantyOverviewDialog {
  width: min(700px, 96vw);
  border-radius: 16px;
  border: none;
  padding: 0;
  overflow: hidden;
  max-height: min(90dvh, 90vh);
}
#roomOverviewDialog::backdrop,
#valueOverviewDialog::backdrop,
#imageGalleryDialog::backdrop,
#warrantyOverviewDialog::backdrop {
  background: rgba(0,0,0,.4);
  backdrop-filter: blur(2px);
}

.ro-dialog, .vo-dialog, .ig-dialog, .wo-dialog {
  display: flex;
  flex-direction: column;
  max-height: min(90dvh, 90vh);
  overflow: hidden;
}

/* ── Room overview ─────────────────────────────────────────────────── */
.ro-toolbar {
  display: flex;
  gap: .5rem;
  padding: 0 1.25rem .8rem;
  flex-wrap: wrap;
  position: sticky;
  top: 0;
  background: var(--surface,#fff);
  z-index: 1;
}
.ro-toolbar input  { flex: 1; min-width: 140px; }
.ro-toolbar select { width: auto; }
.ro-list {
  overflow-y: auto;
  flex: 1;
  padding: .25rem 1.25rem 1rem;
  display: flex;
  flex-direction: column;
  gap: .6rem;
}
.ro-room-card {
  border: 1px solid var(--border,#e5e7eb);
  border-radius: 12px;
  padding: .8rem 1rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  transition: box-shadow .12s, transform .12s;
}
.ro-room-card:hover { box-shadow: 0 3px 12px rgba(0,0,0,.07); transform: translateY(-1px); }
.ro-room-header   { display: flex; align-items: center; gap: .6rem; }
.ro-room-icon     { font-size: 1.7rem; line-height: 1; flex-shrink: 0; }
.ro-room-icon-image { display:block; width:1.7rem; height:1.7rem; border-radius:50%; }
.ro-room-title    { display: flex; flex-direction: column; min-width: 0; }
.ro-room-title strong { font-size: 1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ro-room-sub      { font-size: .82rem; }
.ro-room-stats    { display: flex; gap: 1.2rem; flex-wrap: wrap; }
.ro-stat          { display: flex; flex-direction: column; }
.ro-stat-label    { font-size: .72rem; color: var(--muted,#6b7280); }
.ro-stat strong   { font-size: .95rem; font-weight: 600; }
.ro-room-actions  { display: flex; gap: .4rem; flex-wrap: wrap; }

/* ── Value overview ────────────────────────────────────────────────── */
#valueOverviewDialog { width: min(580px, 96vw); }
.vo-content-wrap { overflow-y: auto; flex: 1; padding: 0 1.25rem 1.25rem; }
.vo-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .6rem;
  margin-bottom: 1.1rem;
}
.vo-stat {
  background: var(--surface-alt,#f3f4f6);
  border-radius: 10px;
  padding: .65rem .9rem;
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.vo-stat > span { font-size: .75rem; color: var(--muted,#6b7280); }
.vo-stat > strong { font-size: .92rem; font-weight: 600; }
.vo-big { font-size: 1.25rem !important; color: var(--accent,#2563eb) !important; }
.vo-top-head { font-weight: 600; font-size: .9rem; margin-bottom: .5rem; }
.vo-top-list { display: flex; flex-direction: column; gap: .3rem; margin-bottom: 1rem; }
.vo-item-row {
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .35rem .5rem;
  border-radius: 8px;
  transition: background .1s;
}
.vo-item-row:hover { background: var(--surface-alt,#f3f4f6); }
.vo-rank { width: 1.5rem; text-align: right; font-size: .78rem; color: var(--muted,#9ca3af); flex-shrink: 0; }
.vo-thumb { width: 36px; height: 36px; border-radius: 7px; object-fit: cover; flex-shrink: 0; }
.vo-thumb-ph { width: 36px; height: 36px; border-radius: 7px; background: var(--accent-soft,#eff6ff); color: var(--accent,#2563eb); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: .95rem; flex-shrink: 0; }
.vo-item-info { flex: 1; min-width: 0; }
.vo-item-name { font-size: .88rem; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vo-item-meta { font-size: .75rem; }
.vo-item-val  { white-space: nowrap; font-size: .88rem; font-weight: 600; }
.vo-actions   { padding-top: .75rem; border-top: 1px solid var(--border,#e5e7eb); }

/* ── Image gallery ─────────────────────────────────────────────────── */
#imageGalleryDialog { width: min(760px, 96vw); }
.ig-content-wrap { overflow-y: auto; flex: 1; padding: 0 1.25rem 1rem; }
.ig-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
  gap: .5rem;
}
.ig-thumb-btn {
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
  border-radius: 9px;
  overflow: hidden;
  aspect-ratio: 1;
  display: block;
  transition: transform .12s, box-shadow .12s;
}
.ig-thumb-btn:hover { transform: scale(1.04); box-shadow: 0 4px 16px rgba(0,0,0,.16); }
.ig-thumb-btn:focus-visible { outline: 2px solid var(--accent,#2563eb); outline-offset: 2px; }
.ig-img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ── Warranty overview ─────────────────────────────────────────────── */
#warrantyOverviewDialog { width: min(560px, 96vw); }
.wo-content-wrap { overflow-y: auto; flex: 1; padding: 0 1.25rem 1.25rem; }
.wo-group       { margin-bottom: 1rem; }
.wo-group-head  { font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--muted,#6b7280); margin-bottom: .45rem; padding-bottom: .3rem; border-bottom: 1px solid var(--border,#e5e7eb); }
.wo-group-head.wo-soon    { color: #d97706; }
.wo-group-head.wo-expired { color: #dc2626; }
.wo-row {
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .35rem .5rem;
  border-radius: 8px;
  cursor: pointer;
  transition: background .1s;
}
.wo-row:hover { background: var(--surface-alt,#f3f4f6); }
.wo-row-thumb { width: 36px; height: 36px; border-radius: 7px; object-fit: cover; flex-shrink: 0; }
.wo-row-ph { width: 36px; height: 36px; border-radius: 7px; background: var(--surface-alt,#f3f4f6); display: flex; align-items: center; justify-content: center; font-size: 1.1rem; flex-shrink: 0; }
.wo-row-info { flex: 1; min-width: 0; }
.wo-row-name { font-size: .88rem; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wo-row-meta { font-size: .75rem; color: var(--muted,#6b7280); }
.wo-badge { font-size: .75rem; padding: .2rem .5rem; border-radius: 6px; white-space: nowrap; font-weight: 500; }
.wo-badge-soon    { background: #fef3c7; color: #92400e; }
.wo-badge-expired { background: #fee2e2; color: #991b1b; }
.wo-badge-none    { background: var(--surface-alt,#f3f4f6); color: var(--muted,#6b7280); }
.wo-count-note { font-size: .82rem; color: var(--muted,#6b7280); padding: .25rem 0 .5rem; }

/* Mobile overrides */
@media (max-width: 600px) {
  #roomOverviewDialog, #valueOverviewDialog, #imageGalleryDialog, #warrantyOverviewDialog {
    width: 100vw;
    max-height: 100dvh;
    border-radius: 0;
    margin: 0;
    align-self: flex-end;
  }
  .ro-toolbar { flex-direction: column; }
  .ro-toolbar input, .ro-toolbar select { width: 100%; }
  .vo-stats { grid-template-columns: 1fr; }
  .ig-grid { grid-template-columns: repeat(auto-fill, minmax(82px, 1fr)); }
  .ro-room-actions button { flex: 1; }
  .metric-arrow { display: none; }
}

/* ── Dashboard card ↗ indicator refinement ───────────────────────────────────
   Overrides the 4.8.2 block: subtle by default, blue + diagonal on hover/focus,
   visible on mobile.                                                           */

.metric-arrow {
  /* visible but quiet in resting state */
  color: var(--muted, #9ca3af);
  opacity: 0.35;
  transform: translate(0, 0);
  transition: opacity .16s ease, transform .16s ease, color .16s ease;
}

/* hover OR keyboard focus → blue, full opacity, moves ↗ 2 px */
.metric-clickable:hover .metric-arrow,
.metric-clickable:focus-visible .metric-arrow {
  opacity: 1;
  color: var(--accent, #2563eb);
  transform: translate(2px, -2px);
}

/* mobile: keep indicator visible; slightly smaller to stay clear of values */
@media (max-width: 600px) {
  .metric-arrow {
    display: block;   /* undo the 4.8.2 display:none */
    font-size: .75rem;
    top: .55rem;
    right: .6rem;
  }
}

/* ── HjemArkiv 4.8.2a – Room Overview Polish ─────────────────────────────────── */

/* Summary bar */
.ro-summary {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem .55rem;
  align-items: center;
  font-size: .82rem;
  color: var(--muted,#6b7280);
  padding: 0 .1rem .75rem;
  border-bottom: 1px solid var(--border,#e5e7eb);
  margin-bottom: .65rem;
  font-variant-numeric: tabular-nums;
}

/* Room value – more prominent */
.ro-val {
  font-size: .95rem;
  font-weight: 600;
  margin-top: .12rem;
  line-height: 1.2;
}
.ro-val-positive { color: var(--accent,#2563eb); }
.ro-val-zero     { color: var(--muted,#9ca3af); font-weight: 400; font-size: .85rem; }

/* Icon-based stat chips (override text-heavy .ro-stat) */
.ro-room-stats   { display: flex; gap: .45rem; flex-wrap: wrap; align-items: center; }
.ro-stat-chip {
  display: inline-flex;
  align-items: center;
  gap: .22rem;
  font-size: .82rem;
  color: var(--muted,#6b7280);
  background: var(--surface-alt,#f3f4f6);
  border-radius: 6px;
  padding: .22rem .5rem;
  line-height: 1.4;
  white-space: nowrap;
}

/* Empty rooms: softer appearance */
.ro-room-card.ro-room-empty {
  background: var(--surface-alt,#f9fafb);
  border-color: #f0f0f0;
}
.ro-room-empty .ro-room-icon { opacity: .5; }
.ro-room-empty .ro-stat-chip { background: transparent; color: var(--muted,#b0b7c3); }
.ro-name-empty { font-weight: 400; color: var(--muted,#6b7280); }

/* Populated rooms: slightly bolder name */
.ro-room-card:not(.ro-room-empty) .ro-room-title strong { font-weight: 600; }

/* Fully clickable card */
.ro-room-card {
  cursor: pointer;
  transition: transform .13s ease, box-shadow .14s ease;
}
.ro-room-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 22px rgba(0,0,0,.09);
}
.ro-room-card:active { transform: none; box-shadow: none; }
.ro-room-card:focus-visible {
  outline: 2px solid var(--accent,#2563eb);
  outline-offset: 3px;
}

/* Buttons must not inherit card cursor or lift */
.ro-room-actions button { cursor: pointer; }

/* Mobile */
@media (max-width: 520px) {
  .ro-summary      { font-size: .78rem; gap: .25rem .45rem; }
  .ro-val          { font-size: .88rem; }
  .ro-stat-chip    { font-size: .78rem; padding: .18rem .42rem; }
  .ro-room-actions { flex-wrap: wrap; }
  .ro-room-actions button { flex: 1; min-height: 44px; font-size: .85rem; }
}

/* ── HjemArkiv 4.9.0 – Household Invitations and Roles ─────────────────────── */

/* Invite accept section */
#inviteAcceptSection     { max-width: 560px; margin: 1.5rem auto 0; }
.inv-accept-details      { display: flex; flex-direction: column; gap: .55rem; margin: 1rem 0; }
.inv-accept-home         { font-size: 1.05rem; }
.inv-accept-meta         { font-size: .9rem; color: var(--muted,#6b7280); }
.inv-accept-error        { color: var(--danger,#dc2626); font-size: .92rem; margin: .75rem 0 0; }
.inv-accept-success      { color: #16a34a; font-size: .95rem; margin: .75rem 0 0; }
#inviteAcceptAction      { display: flex; gap: .75rem; margin-top: 1.25rem; flex-wrap: wrap; }

/* Settings husstand row (replaces old invite-code row) */
/* Members card */
#membersCard             { padding: 1rem 1.25rem; }
.members-list            { display: flex; flex-direction: column; gap: .6rem; }
.member-row              { display: flex; align-items: center; gap: .75rem; padding: .6rem .8rem; border-radius: 10px; background: var(--surface-alt,#f9fafb); border: 1px solid var(--border,#e5e7eb); }
.member-owner            { background: #fdf9ee; border-color: #f5e28a; }
.member-avatar           { font-size: 1.2rem; width: 2rem; text-align: center; flex-shrink: 0; }
.member-info             { flex: 1; display: flex; flex-direction: column; gap: .08rem; min-width: 0; }
.member-info strong      { font-size: .88rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.member-meta             { font-size: .76rem; color: var(--muted,#6b7280); }
.member-me               { font-size: .7rem; background: var(--accent,#2563eb); color: #fff; border-radius: 4px; padding: .05rem .3rem; vertical-align: middle; }

/* Pending invitations section */
.pending-invites         { margin-top: 1.2rem; border-top: 1px solid var(--border,#e5e7eb); padding-top: 1rem; }
.inv-list-section-head   { font-size: .78rem; font-weight: 600; color: var(--muted,#6b7280); text-transform: uppercase; letter-spacing: .05em; margin-bottom: .6rem; }
.inv-empty               { font-size: .85rem; padding: .2rem 0; }

.inv-row                 { background: var(--surface-alt,#f9fafb); border: 1px solid var(--border,#e5e7eb); border-radius: 10px; padding: .65rem .85rem; display: flex; flex-direction: column; gap: .3rem; margin-bottom: .45rem; }
.inv-row-top             { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; }
.inv-recipient           { font-size: .87rem; font-weight: 600; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.inv-role-lbl            { font-size: .76rem; color: var(--muted,#6b7280); }
.inv-row-meta            { font-size: .76rem; color: var(--muted,#9ca3af); }
.inv-row-meta code       { background: #f3f4f6; padding: .1rem .3rem; border-radius: 4px; font-size: .8rem; letter-spacing: .06em; }
.inv-row-actions         { display: flex; gap: .4rem; flex-wrap: wrap; margin-top: .15rem; }

.inv-status-badge        { font-size: .71rem; padding: .16rem .5rem; border-radius: 99px; font-weight: 600; white-space: nowrap; }
.inv-status-pending      { background: #dbeafe; color: #1e40af; }
.inv-status-used         { background: #dcfce7; color: #15803d; }
.inv-status-expired      { background: #f3f4f6; color: #6b7280; }
.inv-status-revoked      { background: #fee2e2; color: #b91c1c; }

.inv-past-wrap           { margin-top: .5rem; }
.inv-past-summary        { font-size: .82rem; color: var(--muted,#6b7280); cursor: pointer; padding: .35rem 0; user-select: none; }
.inv-past-summary:hover  { color: var(--text,#1f2937); }
.inv-past-list           { margin-top: .5rem; }

/* Create invitation dialog */
.inv-dialog-card         { max-width: 520px; }
.inv-expires-row         { margin: 1rem 0 .5rem; }
.inv-expires-row > label { font-size: .83rem; font-weight: 600; display: block; margin-bottom: .5rem; }
.inv-expires-btns        { display: flex; gap: .4rem; flex-wrap: wrap; }
.inv-exp-btn             { padding: .34rem .85rem; border-radius: 8px; border: 1px solid var(--border,#d1d5db); background: transparent; cursor: pointer; font-size: .84rem; color: var(--text,#1f2937); transition: background .12s, border-color .12s; }
.inv-exp-btn:hover       { background: var(--surface-alt,#f3f4f6); }
.inv-exp-btn.active      { background: var(--accent,#2563eb); color: #fff; border-color: var(--accent,#2563eb); }
.inv-form-error          { color: var(--danger,#dc2626); font-size: .84rem; margin: .4rem 0 0; }

/* Share dialog */
.inv-share-card          { max-width: 500px; }
.inv-share-sub           { margin: 0 0 1.1rem; font-size: .9rem; }
.inv-share-label         { font-size: .75rem; font-weight: 600; color: var(--muted,#6b7280); text-transform: uppercase; letter-spacing: .05em; display: block; margin-bottom: .35rem; }
.inv-share-link-box,
.inv-share-code-box      { margin-bottom: 1rem; }
.inv-share-url-row       { display: flex; gap: .4rem; }
.inv-share-url-row input { flex: 1; font-size: .8rem; background: var(--surface-alt,#f9fafb); color: var(--muted,#374151); }
.inv-share-code-display  { display: flex; align-items: center; gap: .85rem; }
.inv-share-code-display strong { font-size: 1.55rem; letter-spacing: .18em; font-family: ui-monospace, monospace; color: var(--accent,#2563eb); }
.inv-share-actions       { display: flex; gap: .5rem; flex-wrap: wrap; }
.inv-share-actions button { flex: 1; min-width: 110px; }

/* Danger ghost button */
button.danger-ghost      { color: var(--danger,#dc2626) !important; border-color: transparent !important; background: transparent !important; }
button.danger-ghost:hover{ background: #fef2f2 !important; border-color: #fecaca !important; }

/* Mobile */
@media (max-width: 520px) {
  #inviteAcceptSection    { margin-top: .75rem; }
  #inviteAcceptAction     { flex-direction: column; }
  #inviteAcceptAction button { width: 100%; min-height: 44px; }
  .inv-share-actions      { flex-direction: column; }
  .inv-share-actions button { min-width: unset; width: 100%; min-height: 44px; font-size: .85rem; }
  .inv-share-code-display strong { font-size: 1.25rem; }
  .inv-expires-btns       { gap: .3rem; }
  .inv-exp-btn            { flex: 1; text-align: center; min-height: 40px; }
  .member-row             { flex-wrap: wrap; }
}

/* ── HjemArkiv 4.9.1 – Invitation Polish ─────────────────────────────────────── */

/* Field rows with icons */
.inv-field-group        { display: flex; flex-direction: column; gap: .85rem; margin-bottom: 1rem; }
.inv-field-row          { display: flex; align-items: flex-start; gap: .7rem; }
.inv-field-icon         { font-size: 1.1rem; width: 1.6rem; text-align: center; padding-top: .3rem; flex-shrink: 0; }
.inv-field-body         { flex: 1; display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
.inv-field-body label   { font-size: .85rem; font-weight: 600; color: var(--label,#374151); }
.inv-field-body input,
.inv-field-body select  { width: 100%; }
.inv-field-hint         { font-size: .8rem; color: var(--muted,#6b7280); margin: .1rem 0 0; line-height: 1.4; }
.inv-contact-hint       { font-size: .79rem; color: var(--muted,#9ca3af); margin: -.35rem 0 .1rem 2.3rem; }

/* Success / share panel */
.inv-success-header     { display: flex; align-items: flex-start; gap: .75rem; padding: .1rem 0 1rem; border-bottom: 1px solid var(--border,#e5e7eb); margin-bottom: 1rem; }
.inv-success-icon       { font-size: 1.5rem; line-height: 1; flex-shrink: 0; }
.inv-success-header strong { font-size: 1.05rem; display: block; }
.inv-success-sub        { font-size: .85rem; margin: .15rem 0 0; }

.inv-success-details    { display: flex; flex-direction: column; gap: .4rem; margin-bottom: 1rem; }
.inv-suc-row            { display: flex; align-items: baseline; gap: .5rem; font-size: .87rem; }
.inv-suc-row span       { color: var(--muted,#6b7280); width: 5rem; flex-shrink: 0; }
.inv-suc-row strong     { font-weight: 600; }
.inv-suc-code           { font-family: ui-monospace,monospace; letter-spacing: .1em; color: var(--accent,#2563eb); font-size: 1rem; }

/* Message preview */
.inv-msg-preview-wrap   { margin-bottom: 1rem; }
.inv-msg-preview        { background: var(--surface-alt,#f3f4f6); border: 1px solid var(--border,#e5e7eb); border-radius: 8px; padding: .7rem .85rem; font-size: .8rem; color: var(--muted,#374151); white-space: pre-wrap; word-break: break-word; font-family: inherit; line-height: 1.55; margin: .35rem 0 0; max-height: 8rem; overflow-y: auto; }

/* Success actions */
.inv-success-actions    { display: flex; flex-direction: column; gap: .45rem; margin-bottom: .25rem; }
.inv-copy-row,
.inv-send-row           { display: flex; gap: .4rem; flex-wrap: wrap; }
.inv-copy-row button,
.inv-send-row button    { flex: 1; min-height: 40px; font-size: .84rem; }

/* Improved pending inv-row actions (more buttons) */
.inv-row-actions        { display: flex; gap: .35rem; flex-wrap: wrap; margin-top: .2rem; }
.inv-row-actions button { font-size: .78rem; padding: .25rem .6rem; min-height: 36px; }

/* Mobile */
@media (max-width: 520px) {
  .inv-field-icon       { display: none; }            /* hide icon on very small screens */
  .inv-copy-row,
  .inv-send-row         { flex-direction: column; }
  .inv-copy-row button,
  .inv-send-row button  { width: 100%; min-height: 44px; font-size: .85rem; }
  .inv-row-actions      { flex-direction: column; }
  .inv-row-actions button { width: 100%; min-height: 44px; }
  .inv-suc-row span     { width: 4.5rem; }
}

/* ── HjemArkiv 4.9.2 – Ownership and Allocation ───────────────────────────── */

/* Owner badges in item cards */
.owner-badge            { display: inline-flex; align-items: center; gap: .15rem; font-size: .72rem; padding: .1rem .38rem; border-radius: 999px; font-weight: 500; margin-right: .2rem; vertical-align: middle; }
.owner-badge-felles     { background: #eff6ff; color: #2563eb; }
.owner-badge-single     { background: #f0fdf4; color: #15803d; }
.owner-badge-split      { background: #fef9c3; color: #a16207; }

/* Eierskap section in item dialog */
.item-owner-details               { border: 1px solid var(--border,#e5e7eb); border-radius: 8px; margin-top: .75rem; }
.item-owner-details > summary     { cursor: pointer; padding: .65rem 1rem; display: flex; align-items: center; justify-content: space-between; font-weight: 600; font-size: .9rem; list-style: none; user-select: none; }
.item-owner-details > summary::-webkit-details-marker { display: none; }
.item-owner-details[open] > summary .item-ins-arrow { transform: rotate(90deg); }
.item-owner-body                  { padding: .25rem 1rem 1rem; display: flex; flex-direction: column; gap: .65rem; }
.owner-disclaimer                 { font-size: .77rem; color: var(--muted,#9ca3af); line-height: 1.45; margin: 0; }

/* Split ownership rows */
.split-owner-row        { display: flex; gap: .4rem; align-items: center; margin-bottom: .3rem; }
.split-owner-row select { flex: 1; min-width: 0; }
.split-pct-input        { width: 5rem; flex-shrink: 0; }
.split-remove-btn       { flex-shrink: 0; font-size: .85rem; }

/* Smart wizard ownership select */
.rv-owner-select        { font-size: .84rem; border: 1px solid var(--border,#e5e7eb); border-radius: 6px; background: white; padding: .25rem .5rem; width: 100%; max-width: 18rem; }

/* Owner filter in toolbar */
#ownerFilter            { min-width: 8.5rem; }

/* Household people list in settings */
.household-people-list  { display: flex; flex-direction: column; }
.person-row             { display: flex; align-items: center; justify-content: space-between; padding: .55rem 0; border-bottom: 1px solid var(--border,#f3f4f6); gap: .5rem; }
.person-row:last-child  { border-bottom: none; }
.person-row-info        { font-size: .88rem; flex: 1; min-width: 0; }

/* Value overview ownership breakdown */
.vo-own-section         { margin-top: 1.25rem; }
.vo-own-list            { display: flex; flex-direction: column; gap: .4rem; margin-top: .5rem; }
.vo-own-row             { display: flex; align-items: baseline; gap: .5rem; font-size: .87rem; }
.vo-own-row > span:first-child { flex: 1; }
.vo-own-row > span.muted { font-size: .79rem; min-width: 7rem; text-align: right; }
.vo-own-row > strong    { min-width: 5.5rem; text-align: right; }

/* Mobile */
@media (max-width: 520px) {
  .split-owner-row    { flex-wrap: wrap; }
  .split-pct-input    { width: 4.5rem; }
  #ownerFilter        { min-width: 7rem; }
  .person-row         { flex-wrap: wrap; }
}

/* ── HjemArkiv 4.9.2 – password recovery / member admin ───────────────────── */

/* Forgot and recovery view cards match authView width */
#forgotView,
#recoveryView { max-width: 38rem; margin: 2rem auto; }

#forgotView h2,
#recoveryView h2 { margin-bottom: .75rem; }

.field-error {
  color: #dc2626;
  font-size: .82rem;
  margin: .3rem 0 0;
  padding: .3rem .5rem;
  background: #fef2f2;
  border-radius: 4px;
}

/* Member row action buttons */
.member-actions      { display: flex; gap: .35rem; flex-wrap: wrap; flex-shrink: 0; align-items: center; }
.member-row          { flex-wrap: wrap; gap: .4rem; }

/* Report settings toggle-switch */
.setting-row         { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .1rem 0; }
.toggle-switch       { position: relative; display: inline-block; width: 2.75rem; height: 1.5rem; flex-shrink: 0; cursor: pointer; }
.toggle-switch input { opacity: 0; width: 0; height: 0; }
.toggle-track        { position: absolute; inset: 0; background: #d1d5db; border-radius: 999px; transition: background .2s; }
.toggle-track::before{ content: ''; position: absolute; width: 1.1rem; height: 1.1rem; left: .2rem; top: .2rem; background: white; border-radius: 50%; transition: transform .2s; box-shadow: 0 1px 3px #0003; }
.toggle-switch input:checked + .toggle-track              { background: #2563eb; }
.toggle-switch input:checked + .toggle-track::before      { transform: translateX(1.25rem); }
.toggle-switch input:focus-visible + .toggle-track        { outline: 2px solid #2563eb; outline-offset: 2px; }
.d-block { display: block; }

@media (max-width: 520px) {
  .member-actions { width: 100%; }
  .setting-row    { flex-direction: column; align-items: flex-start; }
}

/* ── HjemArkiv 4.9.3 – Auth & production polish ────────────────────────────── */

/* Auth card */
.auth-card            { max-width: 28rem; margin: 0 auto; }
.auth-header          { margin-bottom: .75rem; }
.auth-body            { display: flex; flex-direction: column; gap: .65rem; margin-bottom: .9rem; }
.field-wrap           { display: flex; flex-direction: column; gap: .2rem; }
.field-label-row      { display: flex; align-items: baseline; justify-content: space-between; }
.field-label-row label { margin: 0; }
.link-sm              { font-size: .8rem; color: var(--accent,#2563eb); background: none; border: none; padding: 0; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; white-space: nowrap; }
.link-sm:hover        { color: #1d4ed8; }
.link-sm:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; border-radius: 2px; }

.remember-me-label    { display: flex; align-items: center; gap: .4rem; font-size: .84rem; color: var(--muted,#6b7280); cursor: pointer; }
.remember-me-label input { accent-color: #2563eb; width: 1rem; height: 1rem; cursor: pointer; }

.auth-actions         { display: flex; flex-direction: column; gap: .45rem; }
.full-width           { width: 100%; }

.auth-divider         { margin-top: .8rem; text-align: center; }
.auth-invite-section  { margin-top: .5rem; display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }
.auth-invite-section input { flex: 1; min-width: 0; font-size: .86rem; }

.auth-footer          { display: flex; align-items: center; justify-content: center; gap: .5rem; margin-top: 1rem; padding-top: .75rem; border-top: 1px solid var(--border,#e5e7eb); flex-wrap: wrap; }
.version-chip         { font-size: .73rem; background: #eff6ff; color: #2563eb; padding: .15rem .5rem; border-radius: 999px; font-weight: 600; }
.auth-privacy         { font-size: .73rem; color: var(--muted,#9ca3af); }

/* Forgot-password sent state */
.forgot-sent-icon     { font-size: 2.5rem; text-align: center; margin: .5rem 0 .75rem; }
.countdown-wrap       { text-align: center; font-size: .86rem; color: var(--muted,#6b7280); margin: .75rem 0 .25rem; padding: .4rem .75rem; background: #f9fafb; border-radius: 8px; }
.forgot-sent-actions  { display: flex; flex-direction: column; align-items: center; gap: .4rem; margin-top: .6rem; }

/* Password strength meter */
.pw-strength-wrap     { margin: .3rem 0 .1rem; }
.pw-strength-track    { height: 5px; background: #e5e7eb; border-radius: 999px; overflow: hidden; }
.pw-strength-fill     { height: 100%; border-radius: 999px; transition: width .22s ease, background .22s ease; width: 0; }
.pw-strength-label    { font-size: .75rem; color: var(--muted,#6b7280); display: block; margin-top: .2rem; min-height: 1rem; }

/* Password requirement checklist */
.pw-requirements      { list-style: none; padding: .25rem 0; margin: .2rem 0; display: flex; flex-direction: column; gap: .2rem; }
.pw-req               { font-size: .82rem; color: var(--muted,#9ca3af); display: flex; align-items: center; gap: .35rem; transition: color .15s; }
.pw-req.pw-req-met    { color: #16a34a; }
.pw-req-icon          { font-size: .8rem; width: 1.1rem; text-align: center; font-weight: 700; flex-shrink: 0; }

/* Recovery success panel */
.recovery-success-panel { text-align: center; padding: .75rem 0; }
.recovery-success-icon  { font-size: 2.5rem; margin: .5rem 0; }

/* Invite success panel */
.invite-success-panel   { text-align: center; padding: .5rem 0; }
.invite-success-icon    { font-size: 2.5rem; margin: .25rem 0 .5rem; }

/* Mobile */
@media (max-width: 480px) {
  .auth-invite-section  { flex-direction: column; align-items: stretch; }
  .auth-footer          { gap: .3rem; }
  .auth-actions button  { min-height: 2.75rem; font-size: 1rem; }
}

/* ── HjemArkiv 4.9.3 – Invitation Onboarding styles ────────────────────────── */

/* Banner inside auth card when arriving from invite link */
.invite-auth-banner {
  display: flex;
  align-items: center;
  gap: .5rem;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  padding: .55rem .75rem;
  font-size: .84rem;
  color: #1e40af;
  margin-bottom: .2rem;
}
.invite-auth-banner::before {
  content: '🔗';
  flex-shrink: 0;
  font-size: .95rem;
}

/* Inline login error / success message */
.field-error {
  font-size: .83rem;
  color: #dc2626;
  margin: .15rem 0 .1rem;
  line-height: 1.4;
}
.field-success {
  font-size: .83rem;
  color: #16a34a;
  margin: .15rem 0 .1rem;
  line-height: 1.4;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: 6px;
  padding: .45rem .65rem;
}

/* Auth-prompt section inside invite card */
.invite-auth-prompt {
  margin-top: .9rem;
  padding-top: .9rem;
  border-top: 1px solid var(--border, #e5e7eb);
}
.inv-auth-note {
  font-weight: 600;
  font-size: .93rem;
  margin: 0 0 .25rem;
}
.inv-auth-subnote {
  font-size: .83rem;
  margin: 0 0 .75rem;
  line-height: 1.45;
}
.invite-phone-form { margin: .7rem 0; }
.invite-phone-form label { display: block; font-size: .84rem; font-weight: 600; margin-bottom: .3rem; }
.invite-phone-row { display: flex; gap: .45rem; align-items: stretch; }
.invite-phone-row input { flex: 1; min-width: 0; }
.invite-phone-row button { white-space: nowrap; }
.inv-auth-btns {
  display: flex;
  flex-direction: column;
  gap: .45rem;
}
@media (max-width: 480px) {
  .inv-auth-btns button { min-height: 2.75rem; font-size: 1rem; }
  .invite-phone-row { flex-direction: column; }
  .invite-phone-row button { min-height: 2.75rem; }
}

/* v4.10 – Barcode product lookup status (step 1) */
.barcode-product-status{font-size:.8rem;color:var(--text-secondary,#6b7280);padding:.3rem .5rem 0;min-height:1.25em;transition:color .2s;}

/* v4.10 – barcode scanner: torch button + portrait-optimised viewfinder */
.torch-btn{position:absolute;top:10px;right:10px;width:38px;height:38px;border-radius:10px;background:rgba(0,0,0,.55);color:#fff;border:1.5px solid rgba(255,255,255,.3);cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;transition:background .15s,border-color .15s;-webkit-tap-highlight-color:transparent;z-index:2;line-height:1;padding:0}
.torch-btn:active,.torch-btn[data-on]{background:rgba(255,200,0,.88);color:#1a1000;border-color:rgba(255,200,0,.7)}
@media (max-width:480px){
  .barcode-camera-view{max-height:300px}
  .scan-reticle{width:220px;height:90px}
  .scan-hint{bottom:54px}
}

/* ── HjemArkiv 5.0.0 – Multi-Method Registration Wizard – 03.08.2026 ── */

/* Method selector panel */
.wiz-method-panel{padding:4px 0 0;animation:fadeSlideUp .2s ease;}
.method-panel-sub{text-align:center;font-size:.85rem;color:var(--muted);margin:0 0 16px;font-weight:500;}
.method-cards{display:flex;flex-direction:column;gap:10px;}
.method-card{display:flex;align-items:center;gap:14px;width:100%;padding:14px 16px;border-radius:14px;border:2px solid var(--line);background:var(--bg);cursor:pointer;text-align:left;font-family:inherit;transition:border-color .15s,background .15s,transform .1s;min-height:72px;-webkit-tap-highlight-color:transparent;}
.method-card:hover{border-color:var(--blue);}
.method-card:active{transform:scale(.975);background:var(--bg-2);}
.method-icon{font-size:2rem;flex-shrink:0;line-height:1;width:40px;text-align:center;}
.method-info{flex:1;min-width:0;}
.method-info strong{display:block;font-size:.92rem;font-weight:700;color:var(--text);}
.method-info span{font-size:.78rem;color:var(--muted);display:block;margin-top:2px;line-height:1.4;}
.method-chevron{font-size:1.4rem;color:var(--muted);flex-shrink:0;font-weight:300;}
.method-cancel-row{text-align:center;margin-top:14px;}
.copyright-notice{font-size:.75rem;color:var(--muted);text-align:center;margin:10px 0 0;letter-spacing:.01em;padding-bottom:max(16px,env(safe-area-inset-bottom,16px));}
.auth-copyright{display:none;}
.auth-card:not(.hidden) .auth-copyright{display:block;position:fixed;bottom:max(12px,env(safe-area-inset-bottom,12px));left:0;right:0;text-align:center;font-size:.75rem;color:#6e6e73;letter-spacing:.01em;pointer-events:none;z-index:20;margin:0;padding:0;}
/* AI status warning banner on method panel */
.wiz-ai-banner{display:flex;align-items:flex-start;gap:10px;background:color-mix(in srgb,#f97316 12%,var(--bg));border:1.5px solid #f97316;border-radius:12px;padding:11px 14px;margin-bottom:14px;animation:fadeSlideUp .2s ease;}
.wiz-ai-banner-icon{font-size:1.1rem;flex-shrink:0;margin-top:1px;}
.wiz-ai-banner-body{flex:1;min-width:0;}
.wiz-ai-banner-body strong{display:block;font-size:.86rem;font-weight:700;color:var(--text);}
.wiz-ai-banner-body span{font-size:.8rem;color:var(--muted);display:block;margin-top:2px;line-height:1.4;}
.wiz-ai-banner-retry{font-size:.8rem;padding:4px 10px;min-height:0;height:auto;white-space:nowrap;flex-shrink:0;margin-top:2px;}
/* Dimmed state for AI method cards when AI is unavailable */
.method-card.ai-unavailable{opacity:.5;cursor:not-allowed;}
.method-card.ai-unavailable:hover{border-color:var(--line);}
.method-card.ai-unavailable:active{transform:none;background:var(--bg);}
.method-ai-badge{font-size:.7rem;font-weight:700;background:#f97316;color:#fff;border-radius:6px;padding:2px 7px;flex-shrink:0;white-space:nowrap;}
.ghost-link{background:none;border:none;color:var(--muted);font-size:.85rem;cursor:pointer;padding:4px 8px;font-family:inherit;text-decoration:underline;text-underline-offset:2px;}
.ghost-link:hover{color:var(--text);}
button.ghost{background:transparent;color:var(--muted);border:1.5px solid var(--line);}
button.ghost:hover{color:var(--text);border-color:var(--text);}

/* ── Premium 2026 auth surface ─────────────────────────────────────────────
   This scope intentionally applies only while an auth route is visible.
   The signed-in application keeps its existing light theme and layout. */
body:has(#authView:not(.hidden)),
body:has(#forgotView:not(.hidden)),
body:has(#recoveryView:not(.hidden)),
body:has(#inviteAcceptSection:not(.hidden)){
  --auth-navy:#061a36;
  --auth-navy-soft:#0a2548;
  --auth-blue:#2f8cff;
  --auth-blue-bright:#5aa9ff;
  --auth-green:#9be63f;
  background:
    radial-gradient(circle at 50% -12%,rgba(30,111,213,.28),transparent 38rem),
    radial-gradient(circle at 100% 100%,rgba(18,76,148,.2),transparent 32rem),
    var(--auth-navy);
  color:#f8fbff;
  min-height:100vh;
  padding-bottom:0;
}
body:has(#authView:not(.hidden)) #appNav,
body:has(#forgotView:not(.hidden)) #appNav,
body:has(#recoveryView:not(.hidden)) #appNav,
body:has(#inviteAcceptSection:not(.hidden)) #appNav{display:none}
body:has(#authView:not(.hidden)) header,
body:has(#forgotView:not(.hidden)) header,
body:has(#recoveryView:not(.hidden)) header,
body:has(#inviteAcceptSection:not(.hidden)) header{
  position:fixed;
  inset:0 0 auto;
  display:block;
  background:transparent;
  border:0;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  z-index:50;
}
body:has(#authView:not(.hidden)) header .header-inner,
body:has(#forgotView:not(.hidden)) header .header-inner,
body:has(#recoveryView:not(.hidden)) header .header-inner,
body:has(#inviteAcceptSection:not(.hidden)) header .header-inner{min-height:0;justify-content:flex-end;padding-top:14px}
body:has(#authView:not(.hidden)) header .header-inner>div:first-child,
body:has(#forgotView:not(.hidden)) header .header-inner>div:first-child,
body:has(#recoveryView:not(.hidden)) header .header-inner>div:first-child,
body:has(#inviteAcceptSection:not(.hidden)) header .header-inner>div:first-child{display:none}
body:has(#authView:not(.hidden)) .hlang-globe,
body:has(#forgotView:not(.hidden)) .hlang-globe,
body:has(#recoveryView:not(.hidden)) .hlang-globe,
body:has(#inviteAcceptSection:not(.hidden)) .hlang-globe{
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  padding:0;
  color:#eff7ff;
  background:rgba(7,31,61,.68);
  border:1px solid rgba(125,187,248,.38);
  border-radius:13px;
  box-shadow:0 8px 24px rgba(0,0,0,.2);
}
body:has(#authView:not(.hidden)) .hlang-globe:hover,
body:has(#forgotView:not(.hidden)) .hlang-globe:hover,
body:has(#recoveryView:not(.hidden)) .hlang-globe:hover,
body:has(#inviteAcceptSection:not(.hidden)) .hlang-globe:hover{background:rgba(45,126,221,.24)}
body:has(#authView:not(.hidden)) main.shell,
body:has(#forgotView:not(.hidden)) main.shell,
body:has(#recoveryView:not(.hidden)) main.shell,
body:has(#inviteAcceptSection:not(.hidden)) main.shell{
  width:100%;
  max-width:none;
  min-height:100vh;
  padding:32px 18px 40px;
  display:flex;
  align-items:center;
  justify-content:center;
}
body:has(#authView:not(.hidden)) .boot-error{display:none}

.auth-card{
  width:min(100%,30rem);
  max-width:none;
  margin:0 auto;
  padding:clamp(24px,4vw,40px) clamp(20px,5vw,42px) 22px;
  background:linear-gradient(145deg,rgba(14,43,78,.9),rgba(5,23,48,.94));
  border:1px solid rgba(91,164,245,.38);
  border-radius:28px;
  box-shadow:0 24px 80px rgba(0,0,0,.38),0 0 0 1px rgba(71,145,229,.08),0 0 42px rgba(25,111,213,.14);
  color:#f8fbff;
}
.auth-brand{text-align:center;margin:0 auto 24px}
.auth-brand-mark{
  width:clamp(180px,54vw,216px);
  aspect-ratio:1.18;
  overflow:hidden;
  margin:0 auto 5px;
  border-radius:18px;
  background:#082957;
  box-shadow:0 12px 32px rgba(0,0,0,.22);
}
.auth-brand-mark img{display:block;width:100%;height:auto}
.auth-brand-tagline{
  margin:0;
  color:var(--auth-green);
  font-size:clamp(.79rem,2.2vw,.9rem);
  font-weight:650;
  letter-spacing:.01em;
}
.auth-header{text-align:center;margin-bottom:24px}
.auth-header h2{margin:0;color:#fff;font-size:clamp(1.55rem,4vw,1.9rem);letter-spacing:-.025em}
.auth-card label{color:#eef5ff}
.auth-card input,
.auth-card select,
.auth-card textarea{
  color:#fff;
  background:rgba(4,18,38,.62);
  border-color:rgba(151,193,235,.28);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.03);
}
.auth-card input::placeholder{color:rgba(205,222,242,.52)}
.auth-card input:focus,
.auth-card select:focus,
.auth-card textarea:focus{
  outline:0;
  border-color:var(--auth-blue-bright);
  box-shadow:0 0 0 3px rgba(47,140,255,.2),0 0 20px rgba(47,140,255,.13);
}
.auth-card button{
  min-height:46px;
  background:linear-gradient(135deg,#1878ed,#2e91ff);
  box-shadow:0 8px 20px rgba(18,112,232,.2);
}
.auth-card button:hover{filter:brightness(1.08)}
.auth-card button.secondary{
  color:#f4f8ff;
  background:rgba(255,255,255,.045);
  border-color:rgba(137,190,244,.35);
  box-shadow:none;
}
.auth-card button.secondary:hover{background:rgba(77,157,239,.13);border-color:rgba(127,194,255,.65)}
.auth-card .link-sm{color:var(--auth-blue-bright);min-height:0;background:transparent;box-shadow:none}
.auth-card .link-sm:hover{color:#a8d1ff}
.auth-card .remember-me-label{color:rgba(221,234,249,.72)}
.auth-card .remember-me-label input{accent-color:var(--auth-blue);width:1rem;height:1rem}
.auth-card .auth-body{gap:.85rem;margin-bottom:1.1rem}
.auth-card .auth-divider{margin-top:1.15rem;padding-top:1.1rem;border-top:1px solid rgba(132,181,230,.16)}
.auth-card .auth-footer{
  margin-top:1.15rem;
  padding-top:1rem;
  border-top:1px solid rgba(132,181,230,.16);
}
.auth-card .version-chip{color:#a9d3ff;background:rgba(49,139,240,.14);border:1px solid rgba(87,167,246,.2)}
.auth-card .auth-privacy{color:#9de3b3}
.auth-card .invite-auth-banner{color:#b9d9ff;background:rgba(36,118,216,.15);border-color:rgba(86,164,245,.38)}
.auth-card .field-error{color:#ffb8b8;background:rgba(176,35,24,.16);border:1px solid rgba(255,130,130,.2);padding:.45rem .6rem}
.auth-card .passkey-login-help{color:rgba(211,228,247,.7)}
.auth-benefits{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  margin:20px 0 0;
  padding:16px 0 0;
  border-top:1px solid rgba(132,181,230,.16);
}
.auth-benefits li{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  color:rgba(222,235,250,.82);
  font-size:.72rem;
  font-weight:700;
  text-align:center;
}
.auth-benefit-icon{
  display:grid;
  place-items:center;
  width:27px;
  height:27px;
  border:1px solid rgba(91,164,245,.52);
  border-radius:9px;
  color:var(--auth-blue-bright);
  font-size:1rem;
  line-height:1;
}
.auth-benefit-safe{color:var(--auth-green);border-color:rgba(155,230,63,.58)}
.auth-card:not(.hidden) .auth-copyright{
  position:static;
  margin:18px 0 0;
  padding:0;
  color:rgba(200,218,239,.5);
}
body:has(#forgotView:not(.hidden)) #forgotView,
body:has(#recoveryView:not(.hidden)) #recoveryView,
body:has(#inviteAcceptSection:not(.hidden)) #inviteAcceptSection{
  width:min(100%,38rem);
  max-width:none;
  margin:0 auto;
  color:#f8fbff;
  background:linear-gradient(145deg,rgba(14,43,78,.9),rgba(5,23,48,.94));
  border:1px solid rgba(91,164,245,.38);
  border-radius:28px;
  box-shadow:0 24px 80px rgba(0,0,0,.38),0 0 42px rgba(25,111,213,.14);
}
body:has(#forgotView:not(.hidden)) .muted,
body:has(#recoveryView:not(.hidden)) .muted,
body:has(#inviteAcceptSection:not(.hidden)) .muted{color:rgba(211,228,247,.7)}
@media(max-width:600px){
  body:has(#authView:not(.hidden)) main.shell,
  body:has(#forgotView:not(.hidden)) main.shell,
  body:has(#recoveryView:not(.hidden)) main.shell,
  body:has(#inviteAcceptSection:not(.hidden)) main.shell{
    align-items:flex-start;
    padding:18px 12px max(28px,env(safe-area-inset-bottom));
  }
  .auth-card{border-radius:24px;padding:24px 18px 20px}
  .auth-brand{margin-bottom:20px}
  .auth-benefits{gap:4px}
}

/* ── AI offline panel ─────────────────────────────────────────────────────── */
.wiz-ai-offline-panel{padding:4px 0 0;animation:fadeSlideUp .2s ease;}
.ai-offline-card{background:var(--bg-2);border:2px solid var(--line);border-radius:16px;padding:24px 20px 20px;text-align:center;margin-bottom:20px;}
.ai-offline-icon{font-size:2rem;margin-bottom:10px;}
.ai-offline-title{font-size:1rem;font-weight:700;color:var(--text);margin:0 0 8px;}
.ai-offline-body{font-size:.88rem;color:var(--muted);margin:0 0 10px;}
.ai-offline-options{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:4px;text-align:left;display:inline-flex;}
.ai-offline-options li{font-size:.88rem;color:var(--text);padding:2px 0;}
.ai-offline-actions{display:flex;flex-direction:column;gap:10px;}
.ai-offline-actions button{width:100%;min-height:48px;font-size:.95rem;}
@keyframes aiOfflineShake{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.ai-offline-shake{animation:aiOfflineShake .45s ease;}
@media(min-width:480px){.ai-offline-actions{flex-direction:row;flex-wrap:wrap;}
.ai-offline-actions button{flex:1;min-width:120px;}}

/* Barcode section in primary mode (barcode-only wizard step) */
.barcode-primary-mode .barcode-divider{display:none;}
.barcode-primary-mode{border:none;padding:0;margin-top:0;}

/* Step 2 barcode result (barcode mode) */
.s2-barcode-result{margin-bottom:14px;}
.s2-bc-found{display:flex;align-items:center;gap:12px;background:#f0fdf4;border:1.5px solid #86efac;border-radius:12px;padding:12px 14px;}
.s2-bc-found.hidden,.s2-bc-notfound.hidden{display:none;}
.s2-bc-icon{width:30px;height:30px;border-radius:50%;background:#22c55e;color:#fff;display:flex;align-items:center;justify-content:center;font-size:.9rem;flex-shrink:0;}
.s2-bc-info{flex:1;min-width:0;}
.s2-bc-label{font-size:.75rem;color:#16a34a;font-weight:600;text-transform:uppercase;letter-spacing:.04em;}
.s2-bc-code{font-size:.85rem;font-weight:600;color:var(--text);margin-top:1px;}
.s2-bc-product{font-size:.82rem;color:var(--muted);margin-top:2px;}
.s2-bc-notfound{display:flex;align-items:center;gap:10px;background:var(--bg-2);border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;font-size:.85rem;color:var(--muted);}

/* Receipt / Document processing states */
.receipt-processing{display:flex;align-items:center;gap:12px;padding:32px 16px;justify-content:center;font-size:.9rem;color:var(--muted);}
.receipt-processing .smart-processing-spinner{flex-shrink:0;}
.receipt-msg{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-radius:12px;margin-bottom:12px;}
.receipt-msg-error{background:#fef2f2;border:1.5px solid #fca5a5;}
.receipt-msg-icon{font-size:1.2rem;flex-shrink:0;margin-top:1px;}
.receipt-error-text{font-size:.85rem;color:#b91c1c;margin:0 0 10px;}
.receipt-error-btns{display:flex;gap:8px;flex-wrap:wrap;}

/* Receipt confirmation card */
.receipt-thumb-row{position:relative;margin-bottom:14px;display:inline-block;}
.receipt-thumb{width:100%;max-height:140px;object-fit:cover;border-radius:10px;display:block;}
.receipt-ai-badge{position:absolute;top:8px;right:8px;background:rgba(0,0,0,.65);color:#fff;font-size:.7rem;font-weight:600;padding:3px 8px;border-radius:20px;letter-spacing:.02em;}
.receipt-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;margin-bottom:14px;}
.receipt-field-group{display:flex;flex-direction:column;gap:4px;}
.receipt-field-group label{font-size:.78rem;font-weight:600;color:var(--muted);}
.receipt-field-group input,.receipt-field-group select{padding:7px 10px;border-radius:8px;border:1.5px solid var(--line);background:var(--bg);color:var(--text);font-size:.85rem;font-family:inherit;}
.receipt-line-header{font-size:.78rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin:10px 0 6px;}
.rcpt-line{display:flex;justify-content:space-between;align-items:center;padding:5px 0;border-bottom:1px solid var(--line);font-size:.82rem;}
.rcpt-line-price{color:var(--muted);flex-shrink:0;margin-left:8px;}

/* Document analysis card */
.doc-analysis-card{background:var(--bg-2);border:1.5px solid var(--line);border-radius:12px;padding:14px;margin-bottom:14px;}
.doc-type-chip{display:inline-flex;align-items:center;gap:6px;background:var(--blue);color:#fff;font-size:.75rem;font-weight:700;padding:3px 10px;border-radius:20px;margin-bottom:8px;}
.doc-analysis-title{font-size:.95rem;font-weight:700;color:var(--text);margin-bottom:4px;}
.doc-analysis-summary{font-size:.83rem;color:var(--muted);margin:0;line-height:1.5;}

/* Responsive: full-width receipt fields on narrow screens */
@media(max-width:400px){.receipt-fields{grid-template-columns:1fr;}}

/* Ensure wizardProgress hides cleanly at method selector step */
#wizardProgress.hidden{display:none!important;}

/* ── Developer log (Settings view) ───────────────────────────────────────── */
.devlog-card { padding: 0; overflow: hidden; }
.devlog-list  { list-style: none; margin: 0; padding: 0; }
.devlog-entry {
  padding: 14px 18px;
  border-bottom: 1px solid var(--line, #e5e7eb);
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  column-gap: 10px;
  row-gap: 2px;
}
.devlog-entry:last-child { border-bottom: none; }
.devlog-date  {
  grid-column: 1; grid-row: 1;
  font-size: .73rem; font-weight: 600;
  color: var(--muted, #9ca3af);
  white-space: nowrap;
  padding-top: 2px;
}
.devlog-title {
  grid-column: 2; grid-row: 1;
  font-size: .88rem; font-weight: 700;
  color: var(--text, #111827);
  line-height: 1.35;
}
.devlog-body  {
  grid-column: 1 / -1; grid-row: 2;
  font-size: .80rem; color: var(--muted, #6b7280);
  margin: 4px 0 0; line-height: 1.55;
}
/* Devlog expand / collapse controls */
.devlog-toggle-row {
  padding: 10px 18px;
  border-top: 1px solid var(--line, #e5e7eb);
}
.devlog-toggle-btn {
  display: flex; align-items: center; gap: .5rem;
  background: none; border: 1.5px solid var(--border, #e0e0e0);
  border-radius: 8px; padding: .5rem 1rem;
  font-size: .84rem; font-weight: 600; color: var(--muted, #6b7280);
  cursor: pointer; transition: border-color .15s, color .15s, background .15s;
  width: 100%; text-align: left;
}
.devlog-toggle-btn:hover {
  border-color: var(--accent, #1a56db); color: var(--accent, #1a56db);
  background: var(--surface-alt, #f5f6f8);
}
.devlog-older-badge {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--border, #e0e0e0); color: var(--muted, #6b7280);
  border-radius: 999px; font-size: .72rem; font-weight: 700;
  min-width: 1.5rem; padding: .05rem .45rem;
}
.devlog-toggle-btn--collapse { justify-content: center; }
.devlog-older { border-top: 1px dashed var(--line, #e5e7eb); }

/* ── HjemArkiv 5.0.7 – Glass Design System ───────────────────────────────── */

/* 1. Design tokens */
:root {
  --glass-bg:         rgba(255,255,255,0.70);
  --glass-border:     rgba(255,255,255,0.52);
  --glass-blur:       20px;
  --glass-shadow:     0 8px 28px rgba(24,39,75,0.09), 0 1px 3px rgba(24,39,75,0.05);
  --status-ok:        #15803d;
  --status-ok-bg:     #dcfce7;
  --status-warn:      #92400e;
  --status-warn-bg:   #fef3c7;
  --status-danger:    #b91c1c;
  --status-danger-bg: #fee2e2;
  --status-blue-bg:   #dbeafe;
}

/* 2. Body background — soft gradient anchored to viewport */
body {
  background:
    radial-gradient(ellipse 90% 55% at 15% -5%, rgba(219,234,254,.70) 0%, transparent 55%),
    radial-gradient(ellipse 55% 45% at 85% 105%, rgba(233,213,255,.45) 0%, transparent 52%),
    #f1f5f9;
  background-attachment: scroll;
  min-height: 100dvh;
}

/* 3. Frosted-glass cards & panels */
.card, .panel {
  background: var(--glass-bg);
  backdrop-filter: blur(var(--glass-blur)) saturate(160%);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(160%);
  border: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow);
}

/* Welcome card keeps its vivid gradient — no glass dilution */
.welcome-card {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: linear-gradient(135deg,#0877e6,#6457ed) !important;
  border: none !important;
}

/* 4. Quick-action buttons — glass */
.quick-action {
  background: rgba(255,255,255,0.72);
  backdrop-filter: blur(16px) saturate(160%);
  -webkit-backdrop-filter: blur(16px) saturate(160%);
  border: 1px solid rgba(255,255,255,0.58);
  box-shadow: 0 4px 16px rgba(24,39,75,0.07);
}
.quick-action:hover {
  background: rgba(255,255,255,0.90);
  border-color: rgba(0,113,227,0.20);
  box-shadow: 0 10px 28px rgba(24,39,75,0.12);
}

/* 5. Desktop nav strip — glass */
.app-nav {
  background: rgba(248,249,252,0.80) !important;
  backdrop-filter: blur(22px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(160%) !important;
  border-bottom: 1px solid rgba(255,255,255,0.52) !important;
  box-shadow: 0 2px 14px rgba(24,39,75,0.07);
}

/* Desktop active tab: blue tint pill */
.nav-tab.active {
  background: rgba(0,113,227,0.10) !important;
  color: var(--blue) !important;
  box-shadow: none !important;
}
/* Inactive tabs: muted grey */
.nav-tab:not(.active):not(.smart-tab) {
  color: #8e8e93;
}

/* 6. Mobile nav — floating glass pill */
@media (max-width: 760px) {
  body {
    padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px));
  }
  .app-nav {
    position: fixed !important;
    left: 10px !important;
    right: 10px !important;
    bottom: max(10px, env(safe-area-inset-bottom, 10px)) !important;
    top: auto !important;
    border-radius: 26px !important;
    border: 1px solid rgba(255,255,255,0.58) !important;
    border-top: 1px solid rgba(255,255,255,0.58) !important;
    box-shadow:
      0 -1px 0 rgba(0,0,0,0.04),
      0 4px 24px rgba(24,39,75,0.12),
      0 20px 44px rgba(24,39,75,0.08) !important;
    background: rgba(250,251,254,0.88) !important;
    backdrop-filter: blur(28px) saturate(200%) !important;
    -webkit-backdrop-filter: blur(28px) saturate(200%) !important;
  }
  .app-nav-inner {
    justify-content: space-around;
    padding: 8px 8px !important;
  }
  .nav-tab {
    border-radius: 16px;
    flex: 1;
    min-width: 0;
    padding: 6px 2px !important;
    gap: 2px !important;
  }
  .nav-tab span { font-size: 22px !important; }
  .nav-tab strong {
    font-size: 9px !important;
    font-weight: 600;
    letter-spacing: 0.01em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: clip;
    text-align: center;
    line-height: 1.1;
    display: block;
    width: 100%;
  }
  .nav-tab.active {
    background: rgba(0,113,227,0.11) !important;
    color: var(--blue) !important;
    box-shadow: none !important;
  }
  .nav-tab:not(.active):not(.smart-tab) {
    color: #8e8e93 !important;
  }
  /* Smart tab — elevated gradient pill */
  .nav-tab.smart-tab {
    background: linear-gradient(135deg,#0877e6,#4f46e5) !important;
    color: #fff !important;
    box-shadow: 0 6px 18px rgba(8,119,230,0.32) !important;
    transform: translateY(-10px) !important;
    border-radius: 999px !important;
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    justify-content: center;
  }
  .nav-tab.smart-tab strong { display: none !important; }
}

/* 7. Dialogs — glass */
.dialog-card {
  background: rgba(255,255,255,0.88);
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  border: 1px solid rgba(255,255,255,0.62);
  box-shadow: 0 24px 64px rgba(24,39,75,0.18), 0 2px 8px rgba(24,39,75,0.06);
}

/* 8. Status colors — semantic and consistent */
.warranty-ok      { background: var(--status-ok-bg)     !important; color: var(--status-ok)     !important; }
.warranty-soon    { background: var(--status-warn-bg)    !important; color: var(--status-warn)   !important; }
.warranty-expired { background: var(--status-danger-bg)  !important; color: var(--status-danger) !important; }
.doc-ok           { background: var(--status-ok-bg);     color: var(--status-ok);     }
.doc-partial      { background: var(--status-warn-bg);    color: var(--status-warn);   }
.doc-missing      { background: var(--status-danger-bg);  color: var(--status-danger); }

/* 9. Alert banner chips — glass tint */
.dash-alert-caution {
  background: rgba(254,243,199,0.82) !important;
  border-color: #fbbf24 !important;
  color: #78350f !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.dash-alert-caution:hover { background: rgba(254,243,199,0.96) !important; }
.dash-alert-danger {
  background: rgba(254,226,226,0.82) !important;
  border-color: #fca5a5 !important;
  color: #991b1b !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.dash-alert-danger:hover { background: rgba(254,226,226,0.96) !important; }

/* 10. Insurance dashboard cells — glass tint */
.ins-dash-cell {
  background: rgba(255,255,255,0.55) !important;
  border: 1px solid rgba(255,255,255,0.50) !important;
}

/* 11. Compact row hover — blue accent */
.compact-row:hover .mini-title { color: var(--blue) !important; }

/* 12. Form inputs — slight glass tint */
input, select, textarea {
  background: rgba(255,255,255,0.82);
}
input:focus, select:focus, textarea:focus {
  background: rgba(255,255,255,0.96);
}

/* ── 5.0.11 Insurance max-coverage toggle ──────────────────────────────────── */
.ins-max-field { display: flex; flex-direction: column; gap: 0; }
.ins-max-toggle-row {
  display: flex; gap: 1rem; align-items: center;
  margin-top: 0.35rem; flex-wrap: wrap;
}
.ins-max-opt {
  display: flex; align-items: center; gap: 0.4rem;
  font-weight: normal; cursor: pointer; font-size: 0.95rem;
}
.ins-max-opt input[type="radio"] {
  accent-color: var(--blue, #2563eb);
  width: 1rem; height: 1rem; flex-shrink: 0; cursor: pointer;
  background: rgba(255,255,255,0.82);
}
.ins-max-amount { margin-top: 0.5rem; width: 100%; }
@media (max-width: 480px) {
  .ins-max-toggle-row { gap: 0.75rem; }
  .ins-max-opt { font-size: 0.9rem; }
}

/* ── 5.1.0 Forsikringsmappe ────────────────────────────────────────────────── */

/* Filter pills */
.policy-filter-row {
  display: flex; gap: .5rem; flex-wrap: wrap;
  padding: .25rem .1rem .5rem; margin-bottom: .25rem;
}
.pill {
  padding: .3rem .85rem; border-radius: 99px; border: 1.5px solid var(--border, #e5e7eb);
  background: rgba(255,255,255,0.7); font-size: .85rem; cursor: pointer;
  font-weight: 500; transition: background .15s, border-color .15s;
  backdrop-filter: blur(6px);
}
.pill.active, .pill:hover {
  background: var(--blue, #2563eb); color: #fff; border-color: var(--blue, #2563eb);
}

/* Policy cards grid */
.policies-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
  gap: 1rem; margin-top: .5rem;
}
.policy-card {
  background: rgba(255,255,255,0.72); border: 1.5px solid rgba(255,255,255,0.55);
  border-radius: 14px; padding: 1rem 1.1rem .85rem; cursor: pointer;
  transition: box-shadow .18s, transform .14s;
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.policy-card:hover { box-shadow: 0 6px 24px rgba(0,0,0,.11); transform: translateY(-2px); }
.policy-card-hd { display: flex; align-items: flex-start; gap: .7rem; margin-bottom: .5rem; }
.policy-icon { font-size: 1.6rem; flex-shrink: 0; line-height: 1; }
.policy-info { flex: 1; min-width: 0; }
.policy-name { display: block; font-size: 1rem; font-weight: 600; line-height: 1.25; }
.policy-scope { font-size: .8rem; }
.policy-renewal { font-size: .78rem; font-weight: 600; flex-shrink: 0; }
.policy-company { font-size: .82rem; margin-bottom: .35rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.policy-meta-row { display: flex; gap: .75rem; flex-wrap: wrap; font-size: .82rem; color: #555; margin-top: .25rem; align-items: center; }
.policy-doc-badge { display: inline-flex; align-items: center; gap: .2rem; padding: 2px 7px; border-radius: 999px; background: #e5f1ff; color: #0068c9; font-size: .75rem; font-weight: 700; margin-left: auto; }
.policy-card-actions { display: flex; justify-content: flex-end; margin-top: .75rem; }
.policy-assist-btn { width: 100%; justify-content: center; font-weight: 700; }

.insurance-assist-card { width: min(760px, 94vw); max-height: 90vh; overflow: auto; }
.assist-policy-hero { display: flex; align-items: center; gap: .8rem; padding: .85rem; border-radius: 14px; background: rgba(37,99,235,.08); }
.assist-policy-hero h3, .assist-policy-hero p { margin: 0; }
.assist-policy-hero > div { flex: 1; min-width: 0; }
.assist-policy-icon { font-size: 2rem; }
.assist-section { margin-top: 1rem; }
.assist-section > h3 { margin: 0 0 .55rem; font-size: 1rem; }
.assist-facts { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .55rem; }
.assist-fact { display: flex; flex-direction: column; min-width: 0; padding: .65rem; border: 1px solid var(--line, #e5e7eb); border-radius: 10px; }
.assist-fact span, .assist-contact small, .assist-document-row small, .assist-source-preview small { color: var(--muted, #667085); font-size: .75rem; }
.assist-fact strong { overflow-wrap: anywhere; }
.assist-contact-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .55rem; }
.assist-contact { display: flex; align-items: center; gap: .55rem; padding: .7rem; border: 1px solid var(--line, #e5e7eb); border-radius: 10px; color: inherit; text-decoration: none; min-width: 0; }
.assist-contact span:last-child { display: flex; flex-direction: column; min-width: 0; }
.assist-contact strong { overflow-wrap: anywhere; }
.assist-contact-icon { font-size: 1.25rem; flex-shrink: 0; }
.assist-claim-link { display: inline-flex; margin-top: .6rem; padding: .6rem .8rem; border-radius: 9px; background: var(--blue, #2563eb); color: white; font-weight: 700; text-decoration: none; }
.assist-documents { display: flex; flex-direction: column; gap: .45rem; }
.assist-document-row { display: flex; align-items: center; gap: .65rem; padding: .6rem .7rem; border: 1px solid var(--line, #e5e7eb); border-radius: 10px; }
.assist-document-row > div { display: flex; flex: 1; min-width: 0; flex-direction: column; }
.assist-document-row strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.assist-example-row { display: flex; flex-wrap: wrap; gap: .4rem; }
.assist-question-box { display: flex; gap: .45rem; margin-top: .6rem; }
.assist-question-box input { flex: 1; min-width: 0; }
.assist-no-ai { display: flex; flex-direction: column; gap: .2rem; margin-top: .65rem; padding: .7rem; border-radius: 10px; background: rgba(217,119,6,.1); border: 1px solid rgba(217,119,6,.28); }
.assist-answer-status { display: flex; flex-direction: column; gap: .2rem; margin-top: .65rem; padding: .7rem; border-radius: 10px; background: rgba(37,99,235,.08); border: 1px solid rgba(37,99,235,.22); }
.assist-answer { margin-top: .65rem; padding: .8rem; border-radius: 10px; background: rgba(22,163,74,.08); border: 1px solid rgba(22,163,74,.24); }
.assist-answer > p { margin: .45rem 0 0; white-space: pre-wrap; }
.assist-citations { display: flex; flex-direction: column; gap: .5rem; margin-top: .75rem; }
.assist-citations .assist-source-preview { margin-top: 0; background: var(--surface, #fff); }
.assist-source-preview { display: grid; grid-template-columns: 1fr 1fr auto; gap: .6rem; align-items: end; margin-top: .65rem; padding: .7rem; border: 1px dashed var(--line, #d1d5db); border-radius: 10px; }
.assist-source-preview > div { display: flex; flex-direction: column; }
@media(max-width:600px){
  .insurance-assist-card { width: 96vw; }
  .assist-facts, .assist-contact-grid { grid-template-columns: 1fr; }
  .assist-question-box { flex-direction: column; }
  .assist-question-box button { width: 100%; }
  .assist-source-preview { grid-template-columns: 1fr; align-items: stretch; }
  .assist-document-row { align-items: flex-start; flex-wrap: wrap; }
  .assist-document-row button { width: 100%; }
}

/* Renewal status colours */
.policy-expired .policy-renewal { color: #dc2626; }
.policy-expiring-soon .policy-renewal { color: #d97706; }
.policy-expiring .policy-renewal { color: #ca8a04; }
.policy-expired { border-color: rgba(220,38,38,.35); }
.policy-expiring-soon { border-color: rgba(217,119,6,.3); }

/* Innbo compact summary card */
.policy-innbo-summary { margin-bottom: 1rem; }
.policy-innbo-summary-hd {
  display: flex; align-items: center; gap: .6rem; cursor: pointer;
  list-style: none; padding: .1rem 0;
}
.policy-innbo-summary-hd::-webkit-details-marker { display: none; }
.policy-innbo-meta {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: .5rem .75rem; margin: .75rem 0 .5rem;
}
.policy-innbo-meta > div { display: flex; flex-direction: column; font-size: .88rem; }
.policy-innbo-meta span { font-size: .75rem; }
.policy-innbo-actions { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .5rem; }

/* Policy type selector in dialog */
.policy-type-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: .4rem;
  margin-top: .35rem;
}
.policy-type-btn {
  display: flex; flex-direction: column; align-items: center; gap: .15rem;
  padding: .45rem .2rem; border-radius: 10px; border: 1.5px solid var(--border, #e5e7eb);
  background: rgba(255,255,255,0.7); cursor: pointer; font-size: .72rem;
  font-weight: 500; transition: all .14s;
}
.policy-type-btn span:first-child { font-size: 1.3rem; line-height: 1; }
.policy-type-btn.active {
  border-color: var(--blue, #2563eb); background: rgba(37,99,235,.1);
  color: var(--blue, #2563eb);
}
.policy-type-btn:hover:not(.active) { background: rgba(0,0,0,.05); }

/* Reusable, household-local insurance company profiles */
.policy-company-picker > label,
.policy-company-profile > label,
.policy-company-editor label {
  display: block;
  margin-bottom: .25rem;
}
.policy-company-select-row {
  display: flex;
  gap: .5rem;
  align-items: stretch;
}
.policy-company-select-row select {
  flex: 1;
  min-width: 0;
}
.policy-company-profile,
.policy-company-editor {
  margin-top: .65rem;
  padding: .75rem;
  border: 1px solid var(--line, #d9e0e8);
  border-radius: 12px;
  background: rgba(37,99,235,.045);
}
.policy-company-profile-head,
.policy-company-editor-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .6rem;
  margin-bottom: .65rem;
}
.policy-company-profile-head strong,
.policy-company-editor-head strong {
  overflow-wrap: anywhere;
}
.policy-company-contact-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .45rem;
  margin-top: .55rem;
}
.policy-company-contact-title {
  grid-column: 1 / -1;
  font-size: .8rem;
  font-weight: 700;
  color: var(--muted, #667085);
}
.policy-company-contact-summary > div:not(.policy-company-contact-title) {
  display: flex;
  flex-direction: column;
  gap: .1rem;
  padding: .5rem;
  border: 1px solid var(--line, #d9e0e8);
  border-radius: 9px;
  background: var(--surface, rgba(255,255,255,.8));
  min-width: 0;
}
.policy-company-contact-summary span {
  color: var(--muted, #667085);
  font-size: .72rem;
}
.policy-company-contact-summary strong {
  font-size: .82rem;
  overflow-wrap: anywhere;
}
.policy-company-profile-actions,
.policy-company-editor-actions {
  display: flex;
  justify-content: flex-end;
  gap: .45rem;
  flex-wrap: wrap;
  margin-top: .65rem;
}
.policy-company-department-fields {
  margin-top: .75rem;
  padding-top: .7rem;
  border-top: 1px solid var(--line, #d9e0e8);
}
.policy-company-department-fields h4 {
  margin: 0 0 .55rem;
  font-size: .9rem;
}
.policy-company-inherit-address {
  display: flex !important;
  align-items: center;
  gap: .45rem;
  margin: .55rem 0 !important;
  font-size: .85rem;
}
.policy-company-inherit-address input {
  width: auto;
  margin: 0;
}
.policy-company-editor input:disabled {
  opacity: .62;
  cursor: not-allowed;
}
@media (max-width: 600px) {
  .policy-company-select-row {
    flex-direction: column;
  }
  .policy-company-contact-summary {
    grid-template-columns: 1fr;
  }
  .policy-company-profile-head {
    align-items: flex-start;
    flex-direction: column;
  }
  .policy-company-profile-actions > button,
  .policy-company-editor-actions > button {
    flex: 1 1 100%;
  }
}

/* Insurance view header add-button */
.icon-btn {
  width: 2.2rem; height: 2.2rem; border-radius: 50%;
  background: var(--blue, #2563eb); color: #fff; border: none;
  font-size: 1.25rem; cursor: pointer; display: flex; align-items: center;
  justify-content: center; flex-shrink: 0; line-height: 1;
  box-shadow: 0 2px 8px rgba(37,99,235,.3);
}

/* 6-tab nav: tighter on small/medium mobile — handles long German labels */
@media (max-width: 540px) {
  .app-nav { left: 7px !important; right: 7px !important; }
  .app-nav-inner { padding: 6px 4px !important; }
  .app-nav .nav-tab span { font-size: 20px !important; }
  .app-nav .nav-tab strong { font-size: 8.5px !important; }
}
@media (max-width: 420px) {
  .app-nav { left: 4px !important; right: 4px !important; }
  .app-nav-inner { padding: 5px 2px !important; }
  .app-nav .nav-tab { padding: 5px 1px !important; gap: 1px !important; }
  .app-nav .nav-tab span { font-size: 18px !important; }
  .app-nav .nav-tab strong { font-size: 7.5px !important; }
  .app-nav .nav-tab.smart-tab {
    width: 50px !important; height: 50px !important;
    flex: 0 0 50px !important;
    transform: translateY(-8px) !important;
  }
}
@media (max-width: 360px) {
  .app-nav .nav-tab strong {
    font-size: 7px !important;
    letter-spacing: -0.02em !important;
  }
}

/* Empty state for policies */
.empty-state { text-align: center; padding: 2.5rem 1rem; }
.empty-state .empty-icon { font-size: 3rem; margin-bottom: .5rem; }

/* ── 5.4.0 – App theme system ─────────────────────────────────────────────
   These tokens intentionally only activate while the signed-in app is visible.
   The auth screens keep their frozen navy treatment and do not inherit these
   app-level colors. */
html[data-hj-theme="light"] body:has(#appView:not(.hidden)),
html[data-hj-theme="light"] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) {
  --bg: #f3f7fc;
  --card: rgba(255,255,255,.86);
  --text: #102541;
  --muted: #60728a;
  --line: rgba(33,72,115,.14);
  --blue: #0877e6;
  --danger: #b42318;
  --app-surface: #eaf2fb;
  --app-surface-strong: #dceafa;
  --app-header: rgba(243,247,252,.84);
  --app-nav: rgba(243,247,252,.88);
  --app-shadow: 0 18px 48px rgba(24,59,98,.09);
  background:
    radial-gradient(circle at 8% -4%, rgba(112,190,255,.23) 0, transparent 31%),
    radial-gradient(circle at 98% 16%, rgba(143,129,255,.12) 0, transparent 25%),
    var(--bg);
  color: var(--text);
}
html[data-hj-theme="dark"] body:has(#appView:not(.hidden)),
html[data-hj-theme="dark"] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) {
  --bg: #07182f;
  --card: rgba(15,39,70,.82);
  --text: #f0f6ff;
  --muted: #a4b7cf;
  --line: rgba(157,192,231,.19);
  --blue: #5bb0ff;
  --danger: #ff928b;
  --app-surface: #0c2748;
  --app-surface-strong: #12385f;
  --app-header: rgba(7,24,47,.82);
  --app-nav: rgba(7,24,47,.88);
  --app-shadow: 0 22px 55px rgba(0,0,0,.27);
  background:
    radial-gradient(circle at 8% -8%, rgba(21,102,177,.34) 0, transparent 34%),
    radial-gradient(circle at 98% 14%, rgba(79,72,170,.18) 0, transparent 28%),
    var(--bg);
  color: var(--text);
}

html[data-hj-theme="light"] #appView { color-scheme: light; }
html[data-hj-theme="dark"] #appView { color-scheme: dark; }
html[data-hj-theme] body:has(#appView:not(.hidden)) header,
html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header {
  background: var(--app-header);
  border-bottom-color: var(--line);
  color: var(--text);
}
html[data-hj-theme] body:has(#appView:not(.hidden)) .app-nav,
html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) .app-nav {
  background: var(--app-nav) !important;
  border-bottom-color: var(--line);
}
html[data-hj-theme] #appView .card,
html[data-hj-theme] #appView .panel,
html[data-hj-theme] #appView .metric {
  background: var(--card);
  border-color: var(--line);
  box-shadow: var(--app-shadow);
}
html[data-hj-theme] #appView input,
html[data-hj-theme] #appView select,
html[data-hj-theme] #appView textarea {
  background: color-mix(in srgb, var(--card) 88%, var(--app-surface));
  border-color: var(--line);
  color: var(--text);
}
html[data-hj-theme] #appView input::placeholder,
html[data-hj-theme] #appView textarea::placeholder { color: var(--muted); }
html[data-hj-theme] #appView button.secondary {
  background: color-mix(in srgb, var(--card) 88%, var(--app-surface));
  color: var(--text);
  border-color: var(--line);
}
html[data-hj-theme] #appView button.link { color: var(--blue); }
/* Keep this legacy primary-button fallback deliberately low-specificity.
   Semantic actions below are owned by Design System 1.0. */
html[data-hj-theme] #appView button:where(:not(.secondary, .link, .nav-tab, .icon, .icon-btn, .room-edit, .policy-doc-del, .danger, .quick-action, .smart-primary, .smart-cap-btn, .method-card, .policy-type-btn, .export-scope-btn, .export-fmt-btn, .ai-suggestion-chip, .room-icon-choice, .theme-choice, .auth-password-toggle)) {
  background: var(--blue);
}
html[data-hj-theme] #appView .nav-tab { color: var(--muted); }
html[data-hj-theme] #appView .nav-tab.active {
  background: color-mix(in srgb, var(--card) 92%, var(--app-surface-strong));
  color: var(--blue);
  box-shadow: 0 6px 24px rgba(35,112,190,.18);
}
html[data-hj-theme] #appView .nav-tab.smart-tab { color: var(--blue); }

/* Dashboard surfaces */
html[data-hj-theme="light"] #appView .welcome-card {
  background: linear-gradient(135deg, #0877e6 0%, #5f68e9 100%);
  box-shadow: 0 20px 48px rgba(44,103,220,.22);
}
html[data-hj-theme="dark"] #appView .welcome-card {
  background: linear-gradient(135deg, #0c3f76 0%, #164d83 52%, #273d8a 100%);
  border: 1px solid rgba(121,185,244,.2);
  box-shadow: 0 22px 58px rgba(0,0,0,.32);
}
html[data-hj-theme] #appView .quick-action {
  background: color-mix(in srgb, var(--card) 92%, var(--app-surface));
  color: var(--text);
  border-color: var(--line);
  box-shadow: 0 8px 22px rgba(21,62,103,.09);
}
html[data-hj-theme] #appView .quick-action strong,
html[data-hj-theme] #appView .quick-action .muted { color: var(--text); }
html[data-hj-theme] #appView .quick-action:hover {
  border-color: color-mix(in srgb, var(--blue) 52%, var(--line));
  box-shadow: 0 16px 34px rgba(21,102,177,.16);
}
html[data-hj-theme="light"] #appView .metric-primary {
  background: linear-gradient(135deg, #e7f3ff, #fff);
  border-color: #b9d9f7;
}
html[data-hj-theme="dark"] #appView .metric-primary {
  background: linear-gradient(135deg, #123c69, #102b4c);
  border-color: rgba(91,176,255,.34);
}
html[data-hj-theme="light"] #appView .metric-primary strong { color: #005eb8; }
html[data-hj-theme="dark"] #appView .metric-primary strong { color: #8bcaff; }
/* Approved room icon family: keep the distinct folder entry and room symbols legible. */
#dashboardView .quick-actions{grid-template-columns:repeat(4,minmax(0,1fr))}
.dashboard-room-entry{min-height:134px;padding:14px 10px 16px;gap:7px;justify-content:center}
.dashboard-room-entry-icon{width:84px;height:84px;border-radius:0;object-fit:contain}
.dashboard-room-entry strong{font-size:13px;color:#27762d}
.dashboard-quick-icon{width:84px;height:84px;display:block;object-fit:contain;flex-shrink:0}
.room-card{min-height:170px}
.room-card .room-icon{display:flex;width:56px;height:56px;align-items:center;justify-content:center}
.room-card .room-icon-image{width:56px;height:56px;border-radius:15px;object-fit:contain}
.room-icon-choice-image{width:38px;height:38px;border-radius:10px;object-fit:contain}
.active-room-icon{width:32px;height:32px;border-radius:10px;object-fit:contain}
.search-room-icon{width:36px;height:36px;border-radius:10px;object-fit:contain}
.mini-room-icon{width:38px;height:38px;border-radius:10px;object-fit:contain}
.ro-room-icon{display:grid;width:46px;height:46px;place-items:center}
.ro-room-icon-image{width:46px;height:46px;border-radius:13px;object-fit:contain}
@media(max-width:760px){#dashboardView .quick-actions{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:520px){
  #dashboardView .quick-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dashboard-room-entry{min-height:128px}
  .dashboard-room-entry-icon{width:78px;height:78px}
  .dashboard-quick-icon{width:78px;height:78px}
  .room-card .room-icon,.room-card .room-icon-image{width:52px;height:52px}
}
html[data-hj-theme] #appView .dashboard-panel:hover,
html[data-hj-theme] #appView .metric:hover {
  box-shadow: 0 22px 54px rgba(21,62,103,.17);
}
html[data-hj-theme="dark"] #appView .dashboard-panel:hover,
html[data-hj-theme="dark"] #appView .metric:hover {
  box-shadow: 0 24px 58px rgba(0,0,0,.32);
}
html[data-hj-theme] #appView .mini-row,
html[data-hj-theme] #appView .compact-row { border-bottom-color: var(--line); }
html[data-hj-theme] #appView .mini-thumb,
html[data-hj-theme] #appView .ins-dash-cell,
html[data-hj-theme] #appView .ins-cov-track {
  background: var(--app-surface);
}
html[data-hj-theme] #appView .ins-dash-cell { border-color: var(--line); }
html[data-hj-theme] #appView .ins-dash-card[open] > summary {
  border-bottom-color: var(--line);
}
html[data-hj-theme] #appView .dash-alert-item {
  background: var(--app-surface);
  border-color: var(--line);
  color: var(--text);
}
html[data-hj-theme="dark"] #appView .warranty-soon,
html[data-hj-theme="dark"] #appView .warranty-expired,
html[data-hj-theme="dark"] #appView .warranty-ok {
  border: 1px solid var(--line);
}
html[data-hj-theme] #appView .empty,
html[data-hj-theme] #appView .empty-state { color: var(--muted); }

/* Signed-in dialogs use the same tokens while auth remains untouched. */
html[data-hj-theme] body:has(#appView:not(.hidden)) dialog {
  color: var(--text);
}
html[data-hj-theme="light"] body:has(#appView:not(.hidden)) dialog { color-scheme: light; }
html[data-hj-theme="dark"] body:has(#appView:not(.hidden)) dialog { color-scheme: dark; }
html[data-hj-theme] body:has(#appView:not(.hidden)) dialog::backdrop {
  background: rgba(2,12,28,.64);
  backdrop-filter: blur(5px);
}
html[data-hj-theme] body:has(#appView:not(.hidden)) dialog .dialog-card,
html[data-hj-theme] body:has(#appView:not(.hidden)) #manualDialog {
  background: var(--card);
  border: 1px solid var(--line);
  color: var(--text);
  box-shadow: var(--app-shadow);
}
html[data-hj-theme] body:has(#appView:not(.hidden)) dialog input,
html[data-hj-theme] body:has(#appView:not(.hidden)) dialog select,
html[data-hj-theme] body:has(#appView:not(.hidden)) dialog textarea,
html[data-hj-theme] body:has(#appView:not(.hidden)) dialog .icon,
html[data-hj-theme] body:has(#appView:not(.hidden)) dialog button.secondary {
  background: color-mix(in srgb, var(--card) 88%, var(--app-surface));
  border-color: var(--line);
  color: var(--text);
}
html[data-hj-theme] body:has(#appView:not(.hidden)) dialog input::placeholder,
html[data-hj-theme] body:has(#appView:not(.hidden)) dialog textarea::placeholder,
html[data-hj-theme] body:has(#appView:not(.hidden)) dialog .muted { color: var(--muted); }
html[data-hj-theme] body:has(#appView:not(.hidden)) #manualDialog .manual-hd {
  border-bottom-color: var(--line);
}

/* Appearance preference control */
#settingsView .appearance-section-intro { margin-top: 34px; }
#settingsView .appearance-section-intro p {
  color: var(--muted);
  margin: 5px 0 0;
  max-width: 610px;
}
#settingsView .appearance-card { padding: 22px; }
.appearance-card-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}
.appearance-card-heading h3 { margin: 0 0 4px; font-size: 18px; }
.appearance-card-heading p { margin: 0; font-size: 13px; line-height: 1.5; }
html[data-hj-theme="light"] #settingsView .appearance-card-heading p,
html[data-hj-theme="light"] #settingsView .appearance-section-intro p {
  color: #315779;
}
html[data-hj-theme="dark"] #settingsView .appearance-card-heading p,
html[data-hj-theme="dark"] #settingsView .appearance-section-intro p {
  color: #b8cbe0;
}
.appearance-preview-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: linear-gradient(135deg, #0b3567, #62b6ff);
  color: #fff;
  font-size: 23px;
  flex-shrink: 0;
}
.theme-choice-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.theme-choice {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
  padding: 13px 14px;
  text-align: left;
  background: color-mix(in srgb, var(--card) 88%, var(--app-surface));
  color: var(--text);
  border: 1px solid var(--line);
  border-radius: 16px;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease, background .16s ease;
}
.theme-choice:hover { transform: translateY(-1px); border-color: color-mix(in srgb, var(--blue) 52%, var(--line)); }
.theme-choice.is-selected {
  border-color: var(--blue);
  background: color-mix(in srgb, var(--blue) 10%, var(--card));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--blue) 20%, transparent);
}
.theme-choice-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 11px;
  background: var(--app-surface-strong);
  color: var(--blue);
  font-size: 19px;
  flex-shrink: 0;
}
.theme-choice-copy { min-width: 0; flex: 1; }
.theme-choice-copy strong,
.theme-choice-copy small { display: block; }
.theme-choice-copy strong { font-size: 13px; }
.theme-choice-copy small { margin-top: 3px; color: var(--muted); font-size: 11px; line-height: 1.35; }
html[data-hj-theme="light"] #settingsView .theme-choice-copy small { color: #315779; }
html[data-hj-theme="dark"] #settingsView .theme-choice-copy small { color: #b8cbe0; }
.theme-choice-check { opacity: 0; color: var(--blue); font-weight: 900; font-size: 16px; }
.theme-choice.is-selected .theme-choice-check { opacity: 1; }
@media (max-width: 680px) {
  .theme-choice-list { grid-template-columns: 1fr; }
  .theme-choice { min-height: 58px; }
}

/* HjemArkiv 5.3.19 – draft banner */
.draft-banner{display:flex;align-items:center;gap:10px;padding:12px 14px;margin-bottom:14px;background:#fff8e1;border:1px solid #f9c740;border-radius:14px;flex-wrap:wrap}
.draft-banner-icon{font-size:20px;flex-shrink:0}
.draft-banner-text{flex:1;font-size:13px;min-width:120px}
.draft-banner-actions{display:flex;gap:7px;flex-shrink:0}
.draft-offline-msg{margin:0 0 10px;padding:11px 14px;border-radius:12px;background:#fff3f3;border:1px solid #f5c6c6;color:#8b1a1a;font-size:13px}
@media(max-width:480px){.draft-banner{flex-direction:column;align-items:flex-start}.draft-banner-actions{width:100%;justify-content:flex-end}}

/* ── 5.3.25 Policy document folder ──────────────────────────────────────── */
.policy-docs-list { display: flex; flex-direction: column; gap: .35rem; margin-top: .1rem; }
.policy-doc-row {
  display: flex; align-items: center; gap: .45rem;
  padding: .38rem .55rem; border-radius: .5rem;
  background: rgba(0,0,0,.03); border: 1px solid rgba(0,0,0,.07);
  min-width: 0;
}
.policy-doc-icon { font-size: 1.1rem; flex-shrink: 0; line-height: 1; }
.policy-doc-name {
  flex: 1; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: .86rem;
}
.policy-doc-type-badge {
  font-size: .7rem; padding: .15em .55em; border-radius: 99px;
  background: #e0f2fe; color: #0369a1; white-space: nowrap; flex-shrink: 0;
}
.policy-doc-type-sel {
  font-size: .72rem; padding: .15em .3em; border-radius: .35rem;
  border: 1px solid rgba(0,0,0,.18); background: #f0f8ff; color: #0369a1;
  white-space: nowrap; flex-shrink: 0; cursor: pointer; max-width: 9rem;
}
.policy-doc-del {
  flex-shrink: 0; background: none !important; border: none !important;
  color: #dc2626 !important; font-size: .95rem; cursor: pointer;
  padding: .15rem .3rem; border-radius: .3rem; line-height: 1;
}
.policy-doc-del:hover { background: rgba(220,38,38,.1) !important; }
.policy-docs-empty-note { font-size: .84rem; color: #888; margin: .2rem 0; }


/* ── User Manual Dialog ─────────────────────────────────────────────── */
#manualDialog {
  border: none; border-radius: 1rem; padding: 0;
  max-width: min(860px, 96vw); width: 100%;
  max-height: 90vh; overflow: hidden;
  box-shadow: 0 8px 40px rgba(0,0,0,.22);
  background: var(--surface, #fff);
}
#manualDialog::backdrop { background: rgba(0,0,0,.5); backdrop-filter: blur(2px); }
.manual-wrap { display: flex; flex-direction: column; height: 90vh; max-height: 90vh; }
.manual-hd {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.1rem 1.4rem .9rem; border-bottom: 1px solid var(--border, #e5e7eb);
  flex-shrink: 0;
}
.manual-hd h2 { margin: 0; font-size: 1.15rem; font-weight: 700; }
.manual-account-guide {
  margin-top: 1.35rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border, #e5e7eb);
}
.manual-account-guide h3 {
  margin: 0 0 .65rem;
  font-size: 1rem;
  color: var(--text, #1f2937);
}
.manual-account-guide ul { margin-bottom: 0; }
.manual-hd-actions { display: flex; gap: .5rem; align-items: center; }
.manual-hd-actions select {
  font-size: .84rem; padding: .3rem .5rem;
  border: 1px solid var(--border, #e5e7eb); border-radius: .5rem;
  background: var(--surface, #fff); color: var(--text, #111); cursor: pointer;
}
.manual-close-btn {
  background: none; border: none; font-size: 1.4rem; line-height: 1;
  cursor: pointer; color: #888; padding: .2rem .4rem; border-radius: .4rem;
}
.manual-close-btn:hover { background: var(--surface-alt, #f3f4f6); color: #333; }
.manual-back-btn {
  display: inline-flex; align-items: center; gap: .3rem;
  background: none; border: 1px solid var(--border, #e5e7eb);
  border-radius: .5rem; padding: .28rem .75rem;
  font-size: .84rem; font-weight: 600; color: var(--primary, #2563eb);
  cursor: pointer; white-space: nowrap; flex-shrink: 0;
  margin-right: .6rem;
}
.manual-back-btn:hover { background: var(--surface-alt, #f3f4f6); }
@media print { .manual-back-btn { display: none !important; } }
.manual-body {
  overflow-y: auto; padding: 1.2rem 1.4rem 2rem;
  flex: 1; scroll-behavior: smooth;
}
.manual-toc { margin-bottom: 1.6rem; }
.manual-toc h3 { font-size: .95rem; font-weight: 700; margin: 0 0 .6rem; color: #555; text-transform: uppercase; letter-spacing: .04em; }
.manual-toc ol { margin: 0; padding-left: 1.3rem; }
.manual-toc li { margin-bottom: .3rem; }
.manual-toc a { color: var(--primary, #2563eb); text-decoration: none; font-size: .93rem; }
.manual-toc a:hover { text-decoration: underline; }
.manual-ch { margin-bottom: 2rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--border, #e5e7eb); }
.manual-ch:last-child { border-bottom: none; }
.manual-ch-hd { display: flex; align-items: center; gap: .7rem; margin-bottom: .8rem; }
.manual-ch-num {
  background: var(--primary, #2563eb); color: #fff;
  font-size: .8rem; font-weight: 700; border-radius: 50%;
  width: 1.7rem; height: 1.7rem; display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.manual-ch-icon { font-size: 1.4rem; }
.manual-ch-hd h3 { margin: 0; font-size: 1.05rem; font-weight: 700; }
.manual-ch p, .manual-ch li { font-size: .93rem; line-height: 1.65; color: var(--text-muted, #444); }
.manual-ch ul, .manual-ch ol { padding-left: 1.4rem; margin: .4rem 0 .8rem; }
.manual-ch li { margin-bottom: .25rem; }
.manual-ch strong { color: var(--text, #111); }
/* Mockup elements */
.mm-box {
  background: var(--surface-alt, #f3f4f6); border: 1px solid var(--border, #e5e7eb);
  border-radius: .7rem; padding: .9rem 1rem; margin: .8rem 0; font-size: .85rem;
}
.mm-box-label { font-weight: 700; font-size: .78rem; color: #888; text-transform: uppercase; letter-spacing: .05em; margin-bottom: .5rem; }
.mm-row { display: flex; gap: .5rem; align-items: center; margin-bottom: .35rem; flex-wrap: wrap; }
.mm-chip {
  background: var(--primary, #2563eb); color: #fff;
  font-size: .75rem; padding: .2rem .55rem; border-radius: 999px; font-weight: 600;
}
.mm-chip.alt { background: #10b981; }
.mm-chip.warn { background: #f59e0b; color: #111; }
.mm-item-card {
  display: flex; align-items: center; gap: .6rem;
  background: #fff; border: 1px solid var(--border, #e5e7eb);
  border-radius: .5rem; padding: .45rem .7rem; font-size: .85rem;
}
.mm-item-thumb { width: 2rem; height: 2rem; border-radius: .35rem; background: #cbd5e1; display: flex; align-items: center; justify-content: center; font-size: 1rem; }
.mm-score-bar { background: #e5e7eb; border-radius: 999px; height: .55rem; flex: 1; overflow: hidden; }
.mm-score-fill { height: 100%; border-radius: 999px; background: var(--primary, #2563eb); }
.mm-pdf-row { display: flex; align-items: center; gap: .5rem; font-size: .84rem; padding: .3rem 0; }
.mm-pdf-icon { font-size: 1.1rem; }
.mm-step-row { display: flex; align-items: center; gap: .5rem; margin-bottom: .35rem; font-size: .85rem; }
.mm-step-num { background: #e5e7eb; border-radius: 50%; width: 1.3rem; height: 1.3rem; display: flex; align-items: center; justify-content: center; font-size: .72rem; font-weight: 700; flex-shrink: 0; }
.mm-badge { background: #ef4444; color: #fff; font-size: .68rem; padding: .1rem .38rem; border-radius: 999px; font-weight: 700; }
.mm-lang-row { display: flex; gap: .4rem; flex-wrap: wrap; }
.mm-lang-btn { border: 1px solid var(--border, #e5e7eb); border-radius: .4rem; padding: .25rem .55rem; font-size: .8rem; background: #fff; cursor: default; }
.mm-lang-btn.active { background: var(--primary, #2563eb); color: #fff; border-color: var(--primary, #2563eb); }
.help-card { padding: 1rem 1.2rem; }

/* Manual dialog language selector */
.manual-hd-lang {
  font-size: .82rem; padding: .28rem .5rem;
  border: 1px solid var(--border, #e5e7eb); border-radius: .5rem;
  background: var(--surface, #fff); color: var(--text, #111);
  cursor: pointer; max-width: 9rem;
}
.manual-cover { text-align: center; padding: 2rem 1rem 1rem; }
.manual-cover-icon-wrap {
  width: 55%; max-width: 220px;
  margin: 0 auto 1.4rem; display: block;
}
.manual-cover-img {
  width: 100%; display: block;
  border-radius: 1.5rem; box-shadow: 0 4px 20px rgba(0,0,0,.13);
}
.manual-cover-title { font-size: 1.6rem; font-weight: 700; color: var(--primary, #2563eb); margin-bottom: .3rem; }
.manual-cover-sub   { font-size: .95rem; color: #555; margin-bottom: .25rem; }
.manual-cover-sub2  { font-size: .85rem; color: #888; margin-bottom: 1.2rem; }
.manual-cover-meta  { font-size: .8rem; color: #aaa; display: flex; gap: .8rem; justify-content: center; }
.manual-footer { text-align: center; font-size: .78rem; color: #bbb; padding: 1rem 0; }

/* ── Passkeys ───────────────────────────────────────────────────────────── */
.passkey-login-option{display:flex;flex-direction:column;gap:.45rem}
.passkey-login-help{margin:0;font-size:.78rem;line-height:1.35;color:var(--muted)}
.settings-passkey-row{grid-template-columns:42px minmax(0,1fr) auto!important;align-items:center}
.settings-passkey-actions{display:flex;flex-direction:column;align-items:flex-end;gap:.35rem;max-width:16rem}
.settings-passkey-actions .field-help{margin:0;text-align:right;font-size:.72rem;line-height:1.3}
.settings-passkey-actions button:disabled{opacity:.5;cursor:not-allowed;filter:grayscale(.35)}
.settings-passkey-actions button:disabled:active{transform:none}
@media(max-width:600px){.settings-passkey-row{grid-template-columns:42px minmax(0,1fr)!important}.settings-passkey-actions{grid-column:2;align-items:flex-start;max-width:none;padding-bottom:8px}.settings-passkey-actions .field-help{text-align:left}}

/* Keep the premium auth card above the later, signed-in glass-card cascade. */
body:has(#authView:not(.hidden)) .auth-card{
  background:linear-gradient(145deg,rgba(14,43,78,.96),rgba(5,23,48,.98));
  border-color:rgba(91,164,245,.38);
  box-shadow:0 24px 80px rgba(0,0,0,.38),0 0 0 1px rgba(71,145,229,.08),0 0 42px rgba(25,111,213,.14);
  backdrop-filter:blur(22px) saturate(130%);
  -webkit-backdrop-filter:blur(22px) saturate(130%);
}
@media(min-width:601px) and (max-height:780px){
  body:has(#authView:not(.hidden)) main.shell{align-items:flex-start;padding-top:20px;padding-bottom:20px}
  .auth-card{padding:20px 30px 16px}
  .auth-brand{margin-bottom:14px}
  .auth-brand-mark{width:158px}
  .auth-header{margin-bottom:14px}
  .auth-card .auth-body{gap:.55rem;margin-bottom:.8rem}
  .auth-card .auth-divider{margin-top:.8rem;padding-top:.75rem}
  .auth-card .auth-footer{margin-top:.8rem;padding-top:.7rem}
  .auth-benefits{margin-top:12px;padding-top:10px}
  .auth-card:not(.hidden) .auth-copyright{margin-top:12px}
}

/* ── Premium 2026 auth refinement: deeper glass, spacious hierarchy ─────── */
body:has(#authView:not(.hidden)){
  background:
    radial-gradient(ellipse 46rem 26rem at 50% -8%,rgba(49,137,255,.26),transparent 68%),
    radial-gradient(ellipse 30rem 24rem at 7% 84%,rgba(13,81,164,.22),transparent 70%),
    radial-gradient(ellipse 28rem 22rem at 96% 74%,rgba(26,105,198,.16),transparent 70%),
    #04162e;
}
body:has(#authView:not(.hidden)) main.shell{padding:70px 20px 58px}
body:has(#authView:not(.hidden)) .auth-card{
  width:min(100%,34rem);
  padding:48px 52px 34px;
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:linear-gradient(140deg,rgba(22,58,101,.84),rgba(6,29,61,.9) 52%,rgba(4,20,43,.94));
  border:1px solid rgba(124,192,255,.42);
  border-radius:32px;
  box-shadow:
    0 32px 90px rgba(0,0,0,.46),
    0 0 0 1px rgba(109,181,255,.07),
    0 0 68px rgba(36,133,255,.18),
    inset 0 1px 0 rgba(255,255,255,.13);
  backdrop-filter:blur(28px) saturate(145%);
  -webkit-backdrop-filter:blur(28px) saturate(145%);
}
body:has(#authView:not(.hidden)) .auth-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 12% 0,rgba(155,211,255,.2),transparent 28%),
    linear-gradient(112deg,rgba(255,255,255,.07),transparent 34%);
}
.auth-brand{margin:0 auto 30px}
.auth-brand-mark{
  width:180px;
  aspect-ratio:1.16;
  margin:0 auto 10px;
  border-radius:22px;
  box-shadow:0 18px 42px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.12);
}
.auth-brand-tagline{font-size:.91rem;letter-spacing:.015em;text-shadow:0 1px 12px rgba(155,230,63,.18)}
.auth-header{margin-bottom:30px}
.auth-header h2{font-size:2rem;letter-spacing:-.035em}
.auth-card .auth-body{gap:1.1rem;margin-bottom:1.35rem}
.auth-card .field-wrap{gap:.45rem}
.auth-card .field-wrap label{font-size:.81rem;letter-spacing:.015em}
.auth-input-shell{position:relative}
.auth-input-shell .auth-field-icon{
  position:absolute;
  z-index:2;
  top:50%;
  left:18px;
  display:grid;
  width:21px;
  height:21px;
  place-items:center;
  color:rgba(164,207,249,.77);
  transform:translateY(-50%);
  pointer-events:none;
}
.auth-input-shell .auth-field-icon svg,
.auth-password-toggle svg,
.auth-button-icon,
.auth-benefit-icon svg{
  width:100%;
  height:100%;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.auth-card .auth-input-shell input{
  height:60px;
  margin:0;
  padding:0 52px;
  border-radius:17px;
  background:rgba(2,17,39,.54);
  border-color:rgba(152,203,250,.28);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.04),0 6px 16px rgba(0,0,0,.08);
}
.auth-card .auth-input-shell input:focus{
  background:rgba(3,21,47,.72);
  border-color:#66b0ff;
  box-shadow:0 0 0 4px rgba(66,153,255,.16),0 0 26px rgba(54,138,255,.16);
}
.auth-card .auth-password-shell input{padding-right:58px}
.auth-card .auth-password-toggle{
  position:absolute;
  z-index:3;
  top:50%;
  right:10px;
  display:grid;
  width:40px;
  height:40px;
  min-height:0;
  padding:9px;
  place-items:center;
  color:rgba(175,215,251,.78);
  background:transparent;
  border:0;
  border-radius:11px;
  box-shadow:none;
  transform:translateY(-50%);
}
.auth-card .auth-password-toggle:hover,
.auth-card .auth-password-toggle:focus-visible{color:#d9ecff;background:rgba(92,167,244,.14);outline:0}
.auth-card .auth-password-toggle[aria-pressed="true"]{color:#73b8ff}
.auth-card .remember-me-label{margin-top:2px;font-size:.86rem}
.auth-card .auth-actions{gap:.8rem}
.auth-card #loginBtn,
.auth-card #signupBtn{
  min-height:57px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border-radius:17px;
  font-size:1rem;
}
.auth-card #loginBtn{
  color:#fff;
  background:linear-gradient(135deg,#1677ee 0%,#3199ff 55%,#2083f6 100%);
  box-shadow:0 15px 30px rgba(18,122,239,.3),0 0 28px rgba(51,151,255,.22),inset 0 1px 0 rgba(255,255,255,.24);
}
.auth-card #loginBtn:hover{box-shadow:0 18px 34px rgba(18,122,239,.38),0 0 34px rgba(51,151,255,.28),inset 0 1px 0 rgba(255,255,255,.28);transform:translateY(-1px)}
.auth-card #signupBtn{
  color:#eef6ff;
  background:rgba(7,30,61,.6);
  border:1px solid rgba(161,207,250,.36);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 8px 22px rgba(0,0,0,.12);
}
.auth-card #signupBtn:hover{background:rgba(31,79,130,.48);border-color:rgba(173,218,255,.62)}
.auth-button-icon{width:20px;height:20px;flex:0 0 20px}
.auth-shield-icon{color:#d6f2ff}
.auth-card .passkey-login-option{gap:.55rem;padding:2px 0}
.auth-card .passkey-login-help{padding-left:2px;font-size:.8rem;line-height:1.45}
.auth-card .passkey-login-option .secondary{min-height:51px;border-radius:16px}
.auth-card .auth-divider{
  margin-top:1.45rem;
  padding-top:1.35rem;
  border-top-color:rgba(151,201,248,.19);
}
.auth-card .auth-divider>.link-sm{font-size:.84rem;text-decoration:none}
.auth-card .auth-divider>.link-sm::before{content:"";display:inline-block;width:22px;height:1px;margin:0 9px 4px 0;background:rgba(150,203,250,.38)}
.auth-card .auth-divider>.link-sm::after{content:"";display:inline-block;width:22px;height:1px;margin:0 0 4px 9px;background:rgba(150,203,250,.38)}
.auth-card .auth-invite-section{margin-top:14px}
.auth-card .auth-footer{margin-top:1.45rem;padding-top:1rem;border-top-color:rgba(151,201,248,.16)}
.auth-card .version-chip{font-size:.7rem;color:rgba(181,216,250,.68);background:rgba(119,175,231,.08);border-color:rgba(143,196,245,.16)}
.auth-card .auth-privacy{display:inline-flex;align-items:center;gap:.3rem;font-size:.72rem;color:rgba(155,230,179,.72)}
.auth-privacy-icon{font-size:.78rem;line-height:1}
.auth-benefits{
  gap:14px;
  margin:26px 0 0;
  padding:23px 0 0;
  border-top-color:rgba(151,201,248,.18);
}
.auth-benefits li{gap:6px;color:rgba(232,243,255,.92);font-size:.82rem}
.auth-benefits li strong{font-size:.82rem}
.auth-benefits li small{max-width:116px;color:rgba(186,211,239,.62);font-size:.67rem;font-weight:500;line-height:1.3}
.auth-benefit-icon{
  width:42px;
  height:42px;
  padding:10px;
  border-radius:14px;
  color:#8dc6ff;
  background:rgba(42,126,222,.11);
  border-color:rgba(122,187,248,.35);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 8px 18px rgba(0,0,0,.1);
}
.auth-benefit-safe{color:var(--auth-green);background:rgba(112,180,44,.1);border-color:rgba(155,230,63,.45)}
.auth-card:not(.hidden) .auth-copyright{margin-top:22px;color:rgba(187,209,235,.42);font-size:.69rem}
@media(min-width:601px) and (max-height:780px){
  body:has(#authView:not(.hidden)) main.shell{padding:52px 20px 38px}
  body:has(#authView:not(.hidden)) .auth-card{padding:34px 42px 28px}
  .auth-brand{margin-bottom:23px}
  .auth-brand-mark{width:156px}
  .auth-header{margin-bottom:22px}
  .auth-card .auth-body{gap:.85rem;margin-bottom:1rem}
  .auth-card .auth-input-shell input{height:55px}
  .auth-card .auth-divider{margin-top:1rem;padding-top:1rem}
  .auth-benefits{margin-top:18px;padding-top:16px}
}
@media(max-width:600px){
  body:has(#authView:not(.hidden)) main.shell{padding:64px 12px max(30px,env(safe-area-inset-bottom))}
  body:has(#authView:not(.hidden)) .auth-card{padding:34px 20px 26px;border-radius:27px}
  .auth-brand{margin-bottom:25px}
  .auth-brand-mark{width:158px}
  .auth-header{margin-bottom:24px}
  .auth-header h2{font-size:1.76rem}
  .auth-card .auth-input-shell input{height:57px}
  .auth-benefits{gap:7px}
  .auth-benefits li small{font-size:.62rem}
}

/* ── Auth brand lockup: lives above, never inside, the login glass card ─── */
.auth-brand-header{display:none}
body:has(#authView:not(.hidden)) main.shell{
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  padding-top:78px;
}
body:has(#authView:not(.hidden)) .auth-brand-header{
  display:block;
  width:min(100%,68.75rem);
  margin:0 auto 26px;
}
body:has(#authView:not(.hidden)) header .header-inner{padding-top:78px}
.auth-brand-lockup{display:flex;align-items:center;gap:15px}
.auth-brand-symbol{
  flex:0 0 76px;
  width:76px;
  height:76px;
  color:#fff;
  filter:drop-shadow(0 10px 20px rgba(0,0,0,.28));
}
.auth-brand-symbol svg{display:block;width:100%;height:100%}
.auth-brand-copy{min-width:0}
.auth-brand-eyebrow,
.auth-card-eyebrow{
  margin:0;
  color:rgba(191,220,250,.76);
  font-size:.66rem;
  font-weight:800;
  letter-spacing:.14em;
  line-height:1.1;
}
.auth-brand-name{
  display:flex;
  margin:3px 0 4px;
  color:#fff;
  font-size:2rem;
  font-weight:800;
  letter-spacing:-.055em;
  line-height:1;
}
.auth-brand-name span:last-child{color:#49a7ff}
.auth-brand-header .auth-brand-tagline{
  margin:0;
  color:var(--auth-green);
  font-size:.79rem;
  font-weight:650;
  letter-spacing:.01em;
  line-height:1.3;
  text-shadow:0 1px 12px rgba(155,230,63,.18);
}
.auth-card .auth-header{
  margin-bottom:30px;
  text-align:left;
}
.auth-card .auth-card-eyebrow{margin-bottom:7px;color:#91c6fb}
.auth-card .auth-header h2{margin:0;font-size:2rem}
@media(min-width:601px) and (max-height:780px){
  body:has(#authView:not(.hidden)) main.shell{padding-top:66px}
  body:has(#authView:not(.hidden)) .auth-brand-header{margin-bottom:20px}
  .auth-brand-symbol{flex-basis:66px;width:66px;height:66px}
  .auth-brand-name{font-size:1.78rem}
  .auth-card .auth-header{margin-bottom:22px}
}
@media(max-width:600px){
  body:has(#authView:not(.hidden)) main.shell{padding-top:72px}
  body:has(#authView:not(.hidden)) .auth-brand-header{width:min(100%,34rem);margin-bottom:20px}
  body:has(#authView:not(.hidden)) header .header-inner{padding-top:76px}
  .auth-brand-lockup{gap:11px}
  .auth-brand-symbol{flex-basis:57px;width:57px;height:57px}
  .auth-brand-eyebrow,.auth-card-eyebrow{font-size:.58rem;letter-spacing:.12em}
  .auth-brand-name{margin:2px 0 3px;font-size:1.62rem}
  .auth-brand-header .auth-brand-tagline{font-size:.68rem}
  .auth-card .auth-header{margin-bottom:24px}
}

/* ── Final mobile reference pass: auth header + card top only ───────────── */
.hlang-icon{display:inline-block}
.hlang-label{display:none}
@media(max-width:600px){
  body:has(#authView:not(.hidden)) main.shell{padding-top:72px}
  body:has(#authView:not(.hidden)) .auth-brand-header{
    width:100%;
    margin-bottom:24px;
  }
  body:has(#authView:not(.hidden)) header .hlang-globe{
    width:auto;
    height:40px;
    padding:0 2px 0 0;
    gap:8px;
    background:transparent;
    border-color:transparent;
    box-shadow:none;
    transform:translateY(20px);
  }
  body:has(#authView:not(.hidden)) header .hlang-globe:hover{background:transparent}
  body:has(#authView:not(.hidden)) .hlang-icon{
    display:grid;
    width:40px;
    height:40px;
    place-items:center;
    background:rgba(7,31,61,.76);
    border:1px solid rgba(125,187,248,.5);
    border-radius:50%;
    box-shadow:0 8px 24px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.08);
    font-size:1rem;
  }
  body:has(#authView:not(.hidden)) .hlang-label{
    display:block;
    color:rgba(226,240,255,.82);
    font-size:.74rem;
    font-weight:650;
    white-space:nowrap;
  }
  .auth-brand-lockup{gap:13px}
  .auth-brand-symbol{
    flex-basis:82px;
    width:82px;
    height:82px;
  }
  .auth-brand-eyebrow{
    font-size:.68rem;
    letter-spacing:.14em;
  }
  .auth-brand-name{
    margin:4px 0 5px;
    font-size:2.08rem;
  }
  .auth-brand-header .auth-brand-tagline{
    font-size:.76rem;
    line-height:1.28;
  }
  body:has(#authView:not(.hidden)) .auth-card{
    padding:38px 21px 30px;
    border-radius:29px;
    border-color:rgba(127,197,255,.48);
    background:linear-gradient(145deg,rgba(23,63,108,.88),rgba(5,27,57,.95) 58%,rgba(3,19,41,.98));
    box-shadow:
      0 28px 70px rgba(0,0,0,.48),
      0 0 0 1px rgba(94,177,255,.09),
      0 0 58px rgba(36,133,255,.25),
      inset 0 1px 0 rgba(255,255,255,.15);
  }
  .auth-card .auth-header{
    margin-bottom:30px;
  }
  .auth-card .auth-card-eyebrow{
    margin-bottom:8px;
    font-size:.68rem;
    letter-spacing:.14em;
  }
  .auth-card .auth-header h2{
    font-size:2.08rem;
    line-height:1.08;
  }
  .auth-card .auth-body{
    gap:1.05rem;
    margin-bottom:1.3rem;
  }
  .auth-card .auth-input-shell input{height:60px}
  .auth-card .remember-me-label{margin-top:3px}
  .auth-benefits{
    gap:8px;
    margin-top:28px;
    padding-top:22px;
  }
  .auth-benefits li{
    min-width:0;
    gap:8px;
    padding:14px 7px 13px;
    border:1px solid rgba(111,181,245,.25);
    border-radius:16px;
    background:linear-gradient(145deg,rgba(31,94,158,.21),rgba(4,27,56,.28));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 8px 18px rgba(0,0,0,.1);
  }
  .auth-benefits li strong{font-size:.76rem}
  .auth-benefits li small{
    max-width:100%;
    color:rgba(201,224,248,.72);
    font-size:.63rem;
    line-height:1.38;
  }
  .auth-benefit-icon{
    width:46px;
    height:46px;
    padding:11px;
    border-radius:15px;
    color:#9ccfff;
    background:rgba(48,139,236,.14);
    border-color:rgba(124,193,255,.42);
  }
  .auth-benefit-safe{
    color:var(--auth-green);
    background:rgba(116,187,48,.12);
    border-color:rgba(155,230,63,.5);
  }
}
@media(max-width:375px){
  .auth-brand-lockup{gap:11px}
  .auth-brand-symbol{
    flex-basis:72px;
    width:72px;
    height:72px;
  }
  .auth-brand-name{font-size:1.9rem}
  body:has(#authView:not(.hidden)) .hlang-label{font-size:.68rem}
}
@media(max-width:340px){
  .auth-brand-lockup{gap:8px}
  .auth-brand-symbol{
    flex-basis:62px;
    width:62px;
    height:62px;
  }
  .auth-brand-eyebrow{font-size:.62rem}
  .auth-brand-name{font-size:1.64rem}
  .auth-brand-header .auth-brand-tagline{font-size:.68rem}
  body:has(#authView:not(.hidden)) .hlang-label{font-size:.62rem}
}

/* ── Mobile reference lock: final proportion pass, auth top only ───────── */
@media(max-width:600px){
  .auth-brand-lockup{gap:14px}
  .auth-brand-symbol{
    flex-basis:86px;
    width:86px;
    height:86px;
  }
  .auth-brand-eyebrow{font-size:.7rem}
  .auth-brand-name{font-size:2.16rem}
  .auth-brand-header .auth-brand-tagline{font-size:.78rem}
  body:has(#authView:not(.hidden)) .auth-card .auth-card-eyebrow{font-size:.7rem}
  body:has(#authView:not(.hidden)) .auth-card .field-wrap label{font-size:.84rem}
}
@media(max-width:375px){
  .auth-brand-lockup{gap:11px}
  .auth-brand-symbol{
    flex-basis:76px;
    width:76px;
    height:76px;
  }
  .auth-brand-name{font-size:1.98rem}
}
@media(max-width:340px){
  .auth-brand-lockup{gap:8px}
  .auth-brand-symbol{
    flex-basis:66px;
    width:66px;
    height:66px;
  }
  .auth-brand-eyebrow{font-size:.64rem}
  .auth-brand-name{font-size:1.7rem}
  .auth-brand-header .auth-brand-tagline{font-size:.69rem}
}

/* ── Benefit cards only: premium glass treatment ───────────────────────── */
.auth-benefits{
  align-items:stretch;
  gap:10px;
  margin-top:24px;
  padding-top:20px;
}
.auth-benefits li{
  box-sizing:border-box;
  min-height:136px;
  padding:15px 9px 14px;
  gap:8px;
  border:1px solid rgba(111,181,245,.28);
  border-radius:17px;
  background:linear-gradient(145deg,rgba(34,94,158,.22),rgba(4,27,56,.36));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 10px 22px rgba(0,0,0,.14);
}
.auth-benefits li strong{
  color:rgba(245,249,255,.98);
  font-size:.8rem;
  line-height:1.15;
}
.auth-benefits li small{
  max-width:100%;
  color:rgba(207,226,247,.76);
  font-size:.68rem;
  font-weight:500;
  line-height:1.38;
}
.auth-benefit-icon{
  width:48px;
  height:48px;
  padding:11px;
  border-radius:15px;
  background:rgba(48,139,236,.14);
  border-color:rgba(124,193,255,.44);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 8px 18px rgba(0,0,0,.12);
}
.auth-benefit-safe{
  color:var(--auth-green);
  background:rgba(116,187,48,.13);
  border-color:rgba(155,230,63,.52);
  box-shadow:inset 0 1px 0 rgba(220,255,177,.1),0 8px 18px rgba(39,96,27,.18);
}
@media(max-width:600px){
  .auth-benefits{
    gap:8px;
    margin-top:28px;
    padding-top:22px;
  }
  .auth-benefits li{
    min-height:132px;
    padding:14px 7px 13px;
  }
  .auth-benefits li strong{font-size:.76rem}
  .auth-benefits li small{font-size:.63rem}
  .auth-benefit-icon{
    width:46px;
    height:46px;
    padding:11px;
  }
}
@media(max-width:375px){
  .auth-benefits li{
    min-height:126px;
    padding-left:5px;
    padding-right:5px;
  }
  .auth-benefits li strong{font-size:.72rem}
  .auth-benefits li small{font-size:.6rem}
  .auth-benefit-icon{
    width:43px;
    height:43px;
    padding:10px;
  }
}

/* ── Signed-in surface completion ──────────────────────────────────────────
   Older authenticated screens use the same semantic names with fallbacks
   from the original light-only palette. Alias those names to the active app
   tokens so every signed-in view follows System, Dark, and Light uniformly.
   This block is intentionally scoped to #appView; the login/auth experience
   above remains unchanged. */
html[data-hj-theme] body:has(#appView:not(.hidden)) {
  --bg-2: var(--app-surface);
  --surface: var(--card);
  --surface-alt: var(--app-surface);
  --border: var(--line);
  --primary: var(--blue);
  --accent: var(--blue);
  --accent-soft: color-mix(in srgb, var(--blue) 12%, var(--card));
  --fg: var(--text);
  --text-secondary: var(--muted);
  --text-muted: var(--muted);
  --shadow: var(--app-shadow);
  --success: #16794a;
  --success-icon: #16794a;
  --success-surface: #edf8f1;
  --warning: #8b4a00;
  --warning-surface: #fff8e6;
  --danger-surface: #fff0ee;
}

html[data-hj-theme="dark"] body:has(#appView:not(.hidden)),
html[data-hj-theme="dark"] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) {
  --success: #7ee2a8;
  --success-icon: #16794a;
  --success-surface: #123b32;
  --warning: #ffd27a;
  --warning-surface: #4a3515;
  --danger-surface: #4b2529;
}

/* A signed-in account can temporarily have no household. It is not an auth
   view, so it follows the selected app theme while login stays untouched. */
html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) #homeSetup {
  background: var(--card);
  border-color: var(--line);
  color: var(--text);
  box-shadow: var(--app-shadow);
}
html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) #homeSetup input,
html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) #homeSetup select,
html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) #homeSetup textarea,
html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) #homeSetup button.secondary {
  background: color-mix(in srgb, var(--card) 88%, var(--app-surface));
  border-color: var(--line);
  color: var(--text);
}

/* Inventory, documents, and settings */
html[data-hj-theme] #appView .active-room,
html[data-hj-theme] #appView .active-room-bar,
html[data-hj-theme] #appView .rooms-panel,
html[data-hj-theme] #appView .feature-grid article,
html[data-hj-theme] #appView .settings-list,
html[data-hj-theme] #appView .method-card,
html[data-hj-theme] #appView .method-panel,
html[data-hj-theme] #appView .document-row,
html[data-hj-theme] #appView .item-grid .item,
html[data-hj-theme] #appView .room-card {
  background: var(--card);
  border-color: var(--line);
  color: var(--text);
}
html[data-hj-theme] #appView .active-room,
html[data-hj-theme] #appView .active-room-bar,
html[data-hj-theme] #appView .feature-grid article,
html[data-hj-theme] #appView .document-icon,
html[data-hj-theme] #appView .method-card,
html[data-hj-theme] #appView .method-panel {
  background: color-mix(in srgb, var(--card) 86%, var(--app-surface));
}
html[data-hj-theme] #appView .room-card:hover,
html[data-hj-theme] #appView .method-card:hover {
  border-color: color-mix(in srgb, var(--blue) 52%, var(--line));
}
html[data-hj-theme] #appView .document-row,
html[data-hj-theme] #appView .settings-list > div,
html[data-hj-theme] #appView .item {
  border-bottom-color: var(--line);
}
html[data-hj-theme] #appView .thumb,
html[data-hj-theme] #appView .smart-thumb,
html[data-hj-theme] #appView .review-thumb {
  background: var(--app-surface);
}

/* Upload and attachment surfaces */
html[data-hj-theme] #appView .upload-box,
html[data-hj-theme] #appView .file-card,
html[data-hj-theme] #appView .file-open,
html[data-hj-theme] #appView .doc-preview,
html[data-hj-theme] #appView .barcode-scan-btn,
html[data-hj-theme] #appView .product-found-card {
  background: color-mix(in srgb, var(--card) 88%, var(--app-surface));
  border-color: var(--line);
  color: var(--text);
}
html[data-hj-theme] #appView .upload-box:hover,
html[data-hj-theme] #appView .barcode-scan-btn:hover {
  background: color-mix(in srgb, var(--blue) 9%, var(--card));
  border-color: var(--blue);
}
html[data-hj-theme] #appView .file-kind,
html[data-hj-theme] #appView .primary-badge {
  background: color-mix(in srgb, var(--blue) 12%, var(--card));
  color: var(--text);
}
html[data-hj-theme] #appView .primary-badge,
html[data-hj-theme] #appView .policy-doc-type-badge {
  color: var(--blue);
}

/* Smart registration and its multi-step states */
html[data-hj-theme] #appView .smart-photo-box,
html[data-hj-theme] #appView .s2-header,
html[data-hj-theme] #appView .s2-intel-ready-card,
html[data-hj-theme] #appView .s2-intel-error-card,
html[data-hj-theme] #appView .smart-save-card,
html[data-hj-theme] #appView .review-card,
html[data-hj-theme] #appView .barcode-state-msg,
html[data-hj-theme] #appView .s2-bc-notfound,
html[data-hj-theme] #appView .s2-ai-ready-card,
html[data-hj-theme] #appView .s2-ai-progress-row,
html[data-hj-theme] #appView .s2-ai-suggestions,
html[data-hj-theme] #appView .receipt-fields input,
html[data-hj-theme] #appView .receipt-fields select {
  background: color-mix(in srgb, var(--card) 84%, var(--app-surface));
  border-color: var(--line);
  color: var(--text);
}
html[data-hj-theme] #appView .smart-change-label,
html[data-hj-theme] #appView .s2-ignore-btn,
html[data-hj-theme] #appView .s2-retry-btn {
  background: color-mix(in srgb, var(--card) 88%, var(--app-surface));
  border-color: var(--line);
  color: var(--text);
}
html[data-hj-theme] #appView .smart-change-label:hover,
html[data-hj-theme] #appView .s2-ignore-btn:hover,
html[data-hj-theme] #appView .s2-retry-btn:hover {
  background: color-mix(in srgb, var(--blue) 10%, var(--card));
}
html[data-hj-theme] #appView .smart-status,
html[data-hj-theme] #appView .barcode-status-loading,
html[data-hj-theme] #appView .barcode-state-info,
html[data-hj-theme] #appView .s2-lookup-msg {
  background: color-mix(in srgb, var(--blue) 11%, var(--card));
  color: var(--text);
}
html[data-hj-theme] #appView .privacy-note,
html[data-hj-theme] #appView .smart-privacy-note,
html[data-hj-theme] #appView .barcode-status-ok,
html[data-hj-theme] #appView .barcode-found-pill,
html[data-hj-theme] #appView .step4-ready,
html[data-hj-theme] #appView .s2-bc-found {
  background: var(--success-surface);
  border-color: color-mix(in srgb, var(--success) 42%, var(--line));
  color: var(--success);
}
html[data-hj-theme] #appView .barcode-status-miss,
html[data-hj-theme] #appView .barcode-state-warn,
html[data-hj-theme] #appView .rv-missing {
  background: var(--warning-surface);
  border-color: color-mix(in srgb, var(--warning) 42%, var(--line));
  color: var(--warning);
}
html[data-hj-theme] #appView .receipt-msg-error,
html[data-hj-theme] #appView .smart-photo-error,
html[data-hj-theme] #appView .s2-ai-banner {
  background: var(--danger-surface);
  border-color: color-mix(in srgb, var(--danger) 45%, var(--line));
  color: var(--text);
}
html[data-hj-theme] #appView .s2-analysis-summary,
html[data-hj-theme] #appView .doc-analysis-card,
html[data-hj-theme] #appView .doc-analysis-summary,
html[data-hj-theme] #appView .doc-checks {
  background: var(--app-surface);
  border-color: var(--line);
  color: var(--text);
}
html[data-hj-theme] #appView .s2-done-tick,
html[data-hj-theme] #appView .step4-ready-icon,
html[data-hj-theme] #appView .save-success-check,
html[data-hj-theme] #appView .s2-bc-icon {
  background: var(--success-icon);
  color: #fff;
}
html[data-hj-theme] #appView .s2-bc-label { color: var(--success); }
html[data-hj-theme] #appView .s2-bc-code { color: var(--text); }
html[data-hj-theme] #appView .s2-bc-product { color: var(--muted); }
html[data-hj-theme] #appView .receipt-msg-error .receipt-error-text { color: var(--danger); }

/* AI assistant cards and messages */
html[data-hj-theme] #appView .ai-item-card,
html[data-hj-theme] #appView .ai-room-row,
html[data-hj-theme] #appView .ai-messages,
html[data-hj-theme] #appView .ai-input-row,
html[data-hj-theme] #appView .ai-action-btn {
  background: color-mix(in srgb, var(--card) 88%, var(--app-surface));
  border-color: var(--line);
  color: var(--text);
}
html[data-hj-theme] #appView .ai-bubble-assistant,
html[data-hj-theme] #appView .ai-bubble-user {
  color: var(--text);
}
html[data-hj-theme] #appView .ai-bubble-user {
  background: color-mix(in srgb, var(--blue) 20%, var(--card));
}
html[data-hj-theme] #appView .ai-bubble-assistant {
  background: var(--app-surface);
}
html[data-hj-theme] #appView .ai-action-btn:hover {
  background: color-mix(in srgb, var(--blue) 10%, var(--card));
}

/* Insurance overview, policy editor, and status notices */
html[data-hj-theme] #appView .policy-card,
html[data-hj-theme] #appView .policy-innbo-summary,
html[data-hj-theme] #appView .ins-settings-compact,
html[data-hj-theme] #appView .ins-dash-cell,
html[data-hj-theme] #appView .vehicle-info-card,
html[data-hj-theme] #appView .policy-type-btn,
html[data-hj-theme] #appView .policy-doc-row {
  background: color-mix(in srgb, var(--card) 88%, var(--app-surface));
  border-color: var(--line);
  color: var(--text);
}
html[data-hj-theme] #appView .policy-type-btn.active,
html[data-hj-theme] #appView .pill.active {
  background: color-mix(in srgb, var(--blue) 14%, var(--card));
  border-color: var(--blue);
  color: var(--blue);
}
html[data-hj-theme] #appView .policy-type-btn:hover:not(.active),
html[data-hj-theme] #appView .policy-doc-row:hover {
  background: color-mix(in srgb, var(--blue) 8%, var(--card));
}
html[data-hj-theme] #appView .warn-danger,
html[data-hj-theme] #appView .dash-alert-danger {
  background: var(--danger-surface);
  border-color: color-mix(in srgb, var(--danger) 42%, var(--line));
  color: var(--danger);
}
html[data-hj-theme] #appView .warn-caution,
html[data-hj-theme] #appView .dash-alert-caution,
html[data-hj-theme] #appView .dash-alert-urgent {
  background: var(--warning-surface);
  border-color: color-mix(in srgb, var(--warning) 42%, var(--line));
  color: var(--warning);
}
html[data-hj-theme] #appView .warn-info {
  background: color-mix(in srgb, var(--blue) 11%, var(--card));
  border-color: color-mix(in srgb, var(--blue) 35%, var(--line));
  color: var(--blue);
}

/* Manual, export, invite and small overview dialogs are signed-in surfaces. */
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-body,
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-toc,
html[data-hj-theme] body:has(#appView:not(.hidden)) .export-step,
html[data-hj-theme] body:has(#appView:not(.hidden)) .inv-share-link-box,
html[data-hj-theme] body:has(#appView:not(.hidden)) .inv-share-code-box,
html[data-hj-theme] body:has(#appView:not(.hidden)) .ro-room-card,
html[data-hj-theme] body:has(#appView:not(.hidden)) .vo-row,
html[data-hj-theme] body:has(#appView:not(.hidden)) .wo-row {
  background: var(--card);
  border-color: var(--line);
  color: var(--text);
}
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-ch,
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-hd,
html[data-hj-theme] body:has(#appView:not(.hidden)) .export-step-label,
html[data-hj-theme] body:has(#appView:not(.hidden)) .policy-docs-list {
  border-color: var(--line);
}
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-ch p,
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-ch li,
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-account-guide h3,
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-cover-sub,
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-cover-sub2,
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-toc h3,
html[data-hj-theme] body:has(#appView:not(.hidden)) .policy-docs-empty-note {
  color: var(--muted);
}
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-ch strong,
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-hd h2 {
  color: var(--text);
}

/* ── HjemArkiv 5.4.0 manual editorial profile ──────────────────────────── */
/* The manual is deliberately a light, printable document in every app theme. */
html[data-hj-theme] body:has(#appView:not(.hidden)) #manualDialog,
#manualDialog {
  max-width: min(1020px, 96vw);
  background: #edf3f8 !important;
  border: 1px solid #cbd9e5 !important;
  color: #12233f !important;
  box-shadow: 0 24px 75px rgba(4, 24, 52, .3) !important;
}
#manualDialog .manual-wrap { height: min(90vh, 940px); max-height: 90vh; }
html[data-hj-theme] body:has(#appView:not(.hidden)) #manualDialog .manual-hd,
#manualDialog .manual-hd {
  padding: .82rem 1.2rem;
  background: #fdfefe;
  border-bottom: 1px solid #d8e2eb !important;
  color: #12233f;
}
.manual-hd-left { display: flex; align-items: center; gap: .75rem; min-width: 0; }
.manual-brand-lockup,
.manual-runner-brand {
  display: inline-flex; align-items: center; gap: .42rem; color: #12233f;
  white-space: nowrap;
}
.manual-brand-lockup b,
.manual-runner-brand b { font-size: .98rem; letter-spacing: -.045em; }
.manual-brand-lockup b span,
.manual-runner-brand b span { color: #2879d5; }
.manual-hd-mark {
  width: 25px; height: 25px; padding: 4px; border-radius: 8px;
  background: #12233f; color: #fff; flex: 0 0 auto;
}
.manual-hd-title {
  padding-left: .75rem; border-left: 1px solid #d8e2eb; color: #6a8197;
  font-size: .77rem; letter-spacing: .08em; font-weight: 700; text-transform: uppercase;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
#manualDialog .manual-hd-actions { gap: .45rem; }
#manualDialog .manual-hd-actions select,
#manualDialog .manual-hd-lang {
  background: #f4f8fb; border-color: #cbd9e5; color: #35516d;
  border-radius: 8px; font-weight: 600;
}
#manualDialog .manual-close-btn {
  color: #59718b; border: 1px solid #cbd9e5; border-radius: 8px; font-size: 1.2rem;
}
#manualDialog .manual-close-btn:hover { background: #edf3f8; color: #12233f; }
#manualDialog .manual-back-btn {
  color: #2563eb; background: #f4f8fb; border-color: #cbd9e5; border-radius: 8px;
}
#manualDialog .manual-body {
  background: #edf3f8 !important; color: #12233f; padding: 0;
  overflow-y: auto; scroll-behavior: auto;
}
.manual-cover {
  position: relative; isolation: isolate; overflow: hidden; min-height: 680px;
  display: flex; flex-direction: column; justify-content: space-between;
  padding: 2rem clamp(1.5rem, 6vw, 5.5rem); background: #071b36; color: #f7fbff;
}
.manual-cover::after {
  content: ""; position: absolute; z-index: -1; right: -230px; top: 18%;
  width: 510px; height: 510px; border-radius: 50%; border: 1px solid rgba(155, 230, 63, .24);
  box-shadow: 0 0 0 52px rgba(155,230,63,.04), 0 0 0 105px rgba(155,230,63,.025);
}
.manual-cover-grid {
  position: absolute; inset: 0; z-index: -1; opacity: .15;
  background-image: linear-gradient(90deg, transparent 49.8%, #7ea9c9 50%, transparent 50.2%), linear-gradient(0deg, transparent 49.8%, #7ea9c9 50%, transparent 50.2%);
  background-size: 84px 84px; mask-image: linear-gradient(135deg, transparent 10%, #000 72%);
}
.manual-cover-top,
.manual-cover-meta {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  letter-spacing: .14em; font-size: .62rem; color: #9fb6cc;
}
.manual-cover-top b { color: #fff; font-size: .82rem; letter-spacing: .02em; }
.manual-cover-main { width: min(100%, 700px); margin: auto 0; padding: 4.7rem 0; }
.manual-cover-brand { display: flex; align-items: center; gap: 1.2rem; }
.manual-cover-mark { width: clamp(70px, 11vw, 94px); height: clamp(70px, 11vw, 94px); color: #fff; flex: 0 0 auto; }
.manual-cover-eyebrow,
.manual-cover-label {
  margin: 0; color: #c5d8e8; font-size: .67rem; font-weight: 800;
  letter-spacing: .24em; text-transform: uppercase;
}
.manual-cover-title {
  margin: .3rem 0 0; color: #f8fbff; font-size: clamp(2.4rem, 5.8vw, 4rem);
  line-height: 1; letter-spacing: -.065em; font-weight: 800;
}
.manual-cover-title span { color: #62a7f8; }
.manual-cover-headline {
  max-width: 680px; margin: .95rem 0 0; color: #f8fbff;
  font-size: clamp(2.25rem, 5.2vw, 4.5rem); line-height: 1.02;
  letter-spacing: -.065em; font-weight: 800;
}
.manual-cover-headline em { color: #a8c2dd; font-style: normal; }
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-cover-tag,
.manual-cover-tag { margin: .6rem 0 0; color: #9be63f; font-size: .88rem; font-weight: 600; }
.manual-cover-rule {
  width: min(100%, 610px); height: 1px; margin: clamp(3rem, 8vh, 5.6rem) 0 1.45rem;
  background: linear-gradient(90deg, #9be63f, rgba(155,230,63,0));
}
.manual-cover-label { color: #9be63f; }
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-cover-sub,
.manual-cover-sub {
  max-width: 630px; margin: .75rem 0 0; color: #b9cce0; font-size: 1rem; line-height: 1.55;
}
.manual-cover-meta {
  justify-content: flex-start; padding-top: 1.15rem; border-top: 1px solid rgba(165,193,214,.24);
  gap: 2.7rem;
}
.manual-cover-meta > span { display: flex; flex-direction: column; gap: .28rem; }
.manual-cover-meta small { color: #83a0ba; font-size: .56rem; }
.manual-cover-meta b { color: #fff; font-size: .82rem; letter-spacing: .04em; }
.manual-cover-meta .manual-cover-langs {
  display: block; margin-left: auto; align-self: end; color: #9be63f; font-size: .62rem;
}
.manual-toc,
.manual-ch {
  width: min(100%, 900px); min-height: auto; margin: 0 auto;
  padding: clamp(2rem, 5vw, 4.25rem) clamp(1.4rem, 7vw, 5.75rem);
  background: #fdfefe !important; color: #12233f; border: 0 !important;
}
.manual-toc { margin-top: 0; }
.manual-page-runner,
.manual-page-footer {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding-bottom: .7rem; border-bottom: 1px solid #d8e2eb;
  color: #7890a7; font-size: .59rem; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase;
}
.manual-runner-brand { color: #12233f; font-size: .79rem; letter-spacing: -.03em; text-transform: none; }
.manual-runner-mark {
  width: 20px; height: 20px; padding: 3px; border-radius: 6px; background: #12233f; color: #fff;
}
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-toc h3,
.manual-toc h3 {
  margin: 3.5rem 0 1.75rem; color: #12233f; font-size: clamp(1.7rem, 3vw, 2.55rem);
  line-height: 1; letter-spacing: -.055em; text-transform: none;
}
.manual-toc ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem 2rem; margin: 0; padding: 0; list-style: none; }
.manual-toc li { margin: 0; padding: .5rem 0; border-bottom: 1px solid #edf1f4; line-height: 1.45; }
.manual-toc a { display: grid; grid-template-columns: 2.25rem 1.7rem minmax(0, 1fr); align-items: start; column-gap: .65rem; color: #35516d; font-size: .9rem; line-height: 1.35; }
.manual-toc a:hover { color: #2563eb; text-decoration: none; }
.manual-toc-num { display: inline-flex; justify-content: flex-end; min-width: 0; padding-top: .05em; color: #7890a7; font-size: .82rem; font-variant-numeric: tabular-nums; }
.manual-toc-icon { display: inline-flex; align-items: center; justify-content: center; width: 1.7rem; min-width: 1.7rem; height: 1.35rem; font-size: 1.05rem; line-height: 1; }
.manual-app-icon {
  display: inline-block; width: 1em; height: 1em; min-width: 1em;
  color: currentColor; vertical-align: -.12em; overflow: visible;
  fill: none; stroke: currentColor; stroke-width: 1.8;
  stroke-linecap: round; stroke-linejoin: round;
}
.manual-back-btn,
.manual-print-launch { display: inline-flex; align-items: center; gap: .35rem; }
.manual-toc-icon .manual-app-icon { width: 1.15rem; height: 1.15rem; color: #2879d5; }
.manual-toc-title { min-width: 0; }
.manual-ch { margin-bottom: 1px; padding-top: clamp(2.2rem, 6vw, 5rem); }
.manual-ch-hd {
  display: grid; grid-template-columns: 2.25rem 2.5rem minmax(0, 1fr);
  align-items: center; column-gap: 1rem; margin: 3rem 0 1.8rem;
}
.manual-ch-num {
  width: 2.25rem; height: 2.25rem; border-radius: 9px; background: #2563eb;
  font-size: .86rem; box-shadow: 0 4px 12px rgba(37,99,235,.23);
}
.manual-ch-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2.5rem; min-width: 2.5rem; height: 2.5rem; font-size: 1.25rem; line-height: 1;
}
.manual-ch-icon .manual-app-icon { width: 1.55rem; height: 1.55rem; color: #2879d5; }
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-ch-hd h2,
.manual-ch-hd h2 {
  align-self: center;
  color: #12233f; font-size: clamp(1.65rem, 3.4vw, 2.45rem); font-weight: 800;
  letter-spacing: -.055em; line-height: 1.05; min-width: 0;
  overflow-wrap: anywhere; hyphens: auto;
}
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-ch p,
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-ch li,
.manual-ch p, .manual-ch li { color: #35516d; font-size: .94rem; line-height: 1.72; }
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-ch strong,
.manual-ch strong { color: #12233f; }
.manual-ch-body > p { margin: 0 0 1rem; }
.manual-ch-body > p + p { margin-top: .45rem; }
.manual-ch-body > ul,
.manual-ch-body > ol { margin-top: .8rem; margin-bottom: 1.1rem; }
.manual-ch-body > ul li,
.manual-ch-body > ol li { margin-bottom: .45rem; }
.manual-ch-body > * + .mm-box,
.manual-ch-body > * + .manual-account-guide { margin-top: 1.15rem; }
.manual-ch .mt {
  display: grid; grid-template-columns: 1.35rem minmax(0, 1fr); align-items: start; column-gap: .5rem;
}
.manual-note-icon {
  display: inline-flex; align-items: center; justify-content: center; width: 1.35rem; min-width: 1.35rem;
  height: 1.35rem; font-size: 1rem; line-height: 1;
}
.manual-note-icon .manual-app-icon { width: 1rem; height: 1rem; }
.manual-note-copy { min-width: 0; }
.manual-ch .mm-nav {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem;
}
.mm-nav-item {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .3rem;
  min-height: 3.45rem; padding: .45rem .25rem; border: 1px solid #dbe5ed; border-radius: 9px;
  background: #fff; color: #35516d; text-align: center;
}
.mm-nav-icon {
  display: inline-flex; align-items: center; justify-content: center; width: 1.35rem; height: 1.35rem;
  font-size: 1.1rem; line-height: 1;
}
.mm-nav-icon .manual-app-icon { width: 1.15rem; height: 1.15rem; color: #2879d5; }
.mm-nav-item > span:last-child { font-size: .74rem; line-height: 1.2; }
.manual-ch .mm-item-icon,
.manual-ch .mm-policy-icon,
.manual-ch .mm-vehicle-icon {
  display: inline-flex; align-items: center; justify-content: center; width: 2rem; min-width: 2rem;
  height: 2rem; font-size: 1.25rem; line-height: 1;
}
.manual-ch .mm-item-icon .manual-app-icon,
.manual-ch .mm-policy-icon .manual-app-icon,
.manual-ch .mm-vehicle-icon .manual-app-icon { width: 1.45rem; height: 1.45rem; color: #2879d5; }
.manual-ch .mm-item-info,
.manual-ch .mm-policy-info,
.manual-ch .mm-w-info {
  display: flex; flex-direction: column; gap: .12rem; min-width: 0;
}
.manual-ch .mm-item-info > span { display: inline-flex; align-items: center; flex-wrap: wrap; gap: .3rem; }
.mm-inline-status-copy { min-width: 0; }
.mm-inline-status-icon {
  display: inline-flex; align-items: center; justify-content: center; width: 1rem; min-width: 1rem;
  height: 1rem; font-size: .86rem; line-height: 1;
}
.mm-inline-status-icon .manual-app-icon,
.manual-ch .mm-doc-row > span:first-child .manual-app-icon,
.manual-ch .mm-warranty-row > span:first-child .manual-app-icon,
.mm-export-icon .manual-app-icon,
.mm-filter-icon .manual-app-icon { width: 1em; height: 1em; }
.mm-inline-status-label { min-width: 0; }
.manual-ch .mm-doc-row > span:first-child,
.manual-ch .mm-warranty-row > span:first-child {
  display: inline-flex; align-items: center; justify-content: center; width: 1.35rem; min-width: 1.35rem;
  height: 1.35rem; font-size: 1rem; line-height: 1;
}
.manual-ch .mm-doc-row {
  display: grid; grid-template-columns: 1.35rem max-content minmax(0, 1fr);
  align-items: center; column-gap: .5rem; padding: .35rem 0;
}
.manual-ch .mm-doc-row > span:last-child { min-width: 0; overflow-wrap: anywhere; }
.manual-ch .mm-warranty-row,
.manual-ch .mm-policy-card,
.manual-ch .mm-vehicle-card {
  display: grid; grid-template-columns: 2rem minmax(0, 1fr); align-items: center; column-gap: .65rem;
}
.manual-ch .mm-vehicle-card { display: block; }
.manual-ch .mm-vehicle-row { overflow-wrap: anywhere; }
.manual-ch .mm-warranty-row { grid-template-columns: 1.35rem minmax(0, 1fr); padding: .35rem 0; }
.manual-ch .mm-filter-row,
.manual-ch .mm-export-row { display: flex; align-items: center; flex-wrap: wrap; gap: .55rem; }
.manual-ch .mm-export-btn,
.manual-ch .mm-filter-chip { display: inline-flex; align-items: center; gap: .35rem; }
.mm-export-icon,
.mm-filter-icon {
  display: inline-flex; align-items: center; justify-content: center; width: 1.05rem; min-width: 1.05rem;
  height: 1.05rem; font-size: .95rem; line-height: 1;
}
.mm-export-label,
.mm-filter-label { min-width: 0; }
.manual-account-guide {
  margin-top: 1.7rem; padding: 1.15rem 1.1rem; border: 0; border-left: 3px solid #39884b;
  border-radius: 0 9px 9px 0; background: #edf8f0;
}
html[data-hj-theme] body:has(#appView:not(.hidden)) .manual-account-guide h3,
.manual-account-guide h3 { color: #245a37; }
.manual-page-footer { margin-top: 2.8rem; padding: 1rem 0 0; border-top: 1px solid #d8e2eb; border-bottom: 0; }
.manual-page-footer b { color: #2879d5; font-size: .92rem; }
.manual-footer {
  width: min(100%, 900px); margin: 0 auto; padding: 1.2rem; background: #fdfefe;
  color: #7890a7; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase;
}
/* Existing handbook illustrations are restyled as current light-theme app surfaces. */
.manual-ch .mm-box {
  background: #f4f8fb; border: 1px solid #cbd9e5; border-radius: 12px;
  padding: 1.1rem; color: #47627b; box-shadow: 0 8px 20px rgba(38,75,110,.06);
}
.manual-ch .mm-box-label { color: #2879d5; font-size: .65rem; letter-spacing: .15em; }
.manual-ch .mm-item-card,
.manual-ch .mm-policy-card,
.manual-ch .mm-vehicle-card,
.manual-ch .mm-smart-card {
  background: #fff; border-color: #dbe5ed; border-radius: 9px; color: #35516d;
}
.manual-ch .mm-chip,
.manual-ch .mm-lang-btn.active { background: #2879d5; border-color: #2879d5; }
.manual-ch .mm-chip.alt { background: #39884b; }
.manual-ch .mm-chip.warn { background: #f5b82e; }
.manual-ch .mm-num { color: #2879d5; }
.manual-ch .mm-score-fill { background-color: #2879d5; }
.manual-ch .mm-score-circle { background: #2879d5; }
.manual-ch .mm-lang-btn,
.manual-ch .mm-filter-chip,
.manual-ch .mm-export-btn { background: #fff; border-color: #cbd9e5; color: #35516d; }
.manual-ch .mm-active { background: #2879d5; color: #fff; border-color: #2879d5; }
@media (max-width: 680px) {
  #manualDialog .manual-hd {
    display: grid; grid-template-columns: 36px minmax(0, 1fr);
    align-items: flex-start; gap: .65rem;
  }
  .manual-hd-left { width: 36px; min-width: 0; }
  #manualDialog .manual-brand-lockup { display: none; }
  #manualDialog .manual-back-btn {
    width: 36px; min-width: 36px; height: 32px; margin-right: 0; padding: .35rem .45rem;
    justify-content: flex-start; overflow: hidden;
  }
  .manual-hd-title { display: none; }
  #manualDialog .manual-hd-actions {
    width: auto; min-width: 0; grid-column: 2;
    flex-wrap: wrap; justify-content: flex-end;
  }
  #manualDialog .manual-hd-actions .secondary:not(.manual-print-launch) { display: none; }
  #manualDialog .manual-hd-actions .manual-print-launch {
    display: inline-flex; min-height: 32px; padding: .38rem .5rem;
    font-size: .72rem; line-height: 1.1; white-space: nowrap;
  }
  .manual-cover { min-height: 610px; padding: 1.5rem 1.35rem; }
  .manual-cover-main { padding: 3.6rem 0; }
  .manual-cover-mark { width: 66px; height: 66px; }
  .manual-cover-brand { gap: .8rem; }
  .manual-cover-meta { gap: 1.2rem; }
  .manual-cover-langs { display: none !important; }
  .manual-toc ol { grid-template-columns: 1fr; }
  .manual-ch .mm-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .manual-page-runner > span:not(.manual-runner-brand):nth-child(2),
  .manual-page-footer span:nth-child(2) { display: none; }
  .manual-page-runner { font-size: .52rem; }
}
@media print {
  #manualDialog { box-shadow: none !important; border: 0 !important; max-width: none; max-height: none; }
  #manualDialog .manual-hd { display: none; }
  #manualDialog .manual-wrap { height: auto; max-height: none; }
  #manualDialog .manual-body { overflow: visible; }
  .manual-cover, .manual-toc { break-after: page; page-break-after: always; }
  .manual-ch { break-before: page; page-break-before: always; }
}

@media (max-width: 600px) {
  html[data-hj-theme] #appView .item-grid .item,
  html[data-hj-theme] #appView .review-card,
  html[data-hj-theme] #appView .policy-card {
    box-shadow: 0 8px 24px rgba(0, 0, 0, .08);
  }
  html[data-hj-theme="dark"] #appView .item-grid .item,
  html[data-hj-theme="dark"] #appView .review-card,
  html[data-hj-theme="dark"] #appView .policy-card {
    box-shadow: 0 12px 30px rgba(0, 0, 0, .24);
  }
}

/* ── Shared signed-in brand header ─────────────────────────────────────────
   Login keeps its own frozen navy presentation. Once an account is active,
   this compact lockup carries the approved HjemArkiv identity in every theme. */
.app-brand-lockup {
  display: flex; align-items: center; gap: .7rem; min-width: 0; flex: 1 1 auto;
  color: #fff;
}
.app-brand-symbol {
  flex: 0 0 46px; width: 46px; height: 46px; color: #fff;
  filter: drop-shadow(0 5px 11px rgba(0,0,0,.25));
}
.app-brand-symbol svg { display: block; width: 100%; height: 100%; }
.app-brand-mark { display: none; }
.app-brand-copy { min-width: 0; }
.app-brand-eyebrow,
.app-brand-name,
.app-brand-tagline { margin: 0; }
.app-brand-eyebrow {
  color: rgba(202,226,251,.78); font-size: .52rem; font-weight: 800;
  letter-spacing: .14em; line-height: 1.05;
}
.app-brand-name {
  display: flex; margin: .1rem 0 .14rem; color: #fff;
  font-size: 1.46rem; font-weight: 800; letter-spacing: -.055em; line-height: .95;
}
.app-brand-name span:last-child { color: #49a7ff; }
.app-brand-tagline {
  color: #9be63f; font-size: .64rem; font-weight: 650; line-height: 1.2;
  letter-spacing: .005em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
html[data-hj-theme] body:has(#appView:not(.hidden)) header,
html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header {
  background: linear-gradient(105deg, #061a36 0%, #082957 68%, #0b3569 100%) !important;
  border-bottom: 1px solid rgba(139,196,250,.28);
  color: #fff;
  box-shadow: 0 5px 18px rgba(2,15,34,.2);
}
html[data-hj-theme] body:has(#appView:not(.hidden)) header .header-inner,
html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .header-inner {
  min-height: 64px; gap: 1rem; padding-top: .45rem; padding-bottom: .45rem;
}
html[data-hj-theme] body:has(#appView:not(.hidden)) header .header-actions,
html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .header-actions {
  gap: .4rem;
}
html[data-hj-theme] body:has(#appView:not(.hidden)) header .hlang-globe,
html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .hlang-globe {
  min-height: 34px; padding: .4rem .52rem; gap: .34rem; border-radius: 9px;
  color: #eff7ff; background: rgba(255,255,255,.09); border: 1px solid rgba(165,210,252,.32);
  font-size: .76rem;
}
html[data-hj-theme] body:has(#appView:not(.hidden)) header .hlang-globe:hover,
html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .hlang-globe:hover {
  background: rgba(89,170,255,.2);
}
html[data-hj-theme] body:has(#appView:not(.hidden)) header .hlang-label,
html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .hlang-label {
  display: inline; font-weight: 700;
}
html[data-hj-theme] body:has(#appView:not(.hidden)) header #logoutBtn,
html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header #logoutBtn {
  min-height: 34px; padding: .4rem .62rem; border-radius: 9px;
  color: #eff7ff; background: rgba(255,255,255,.09); border-color: rgba(165,210,252,.32);
  box-shadow: none; font-size: .76rem; white-space: nowrap;
}
html[data-hj-theme] body:has(#appView:not(.hidden)) header #logoutBtn:hover,
html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header #logoutBtn:hover {
  background: rgba(89,170,255,.2);
}
@media (min-width: 761px) {
  html[data-hj-theme] body:has(#appView:not(.hidden)) .app-nav,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) .app-nav { top: 64px; }
}
@media (max-width: 600px) {
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .header-inner,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .header-inner {
    min-height: 58px; gap: .5rem; padding: .38rem .75rem;
  }
  .app-brand-lockup { gap: .48rem; }
  .app-brand-symbol { flex-basis: 36px; width: 36px; height: 36px; }
  .app-brand-eyebrow { font-size: .43rem; }
  .app-brand-name { margin: .08rem 0 .1rem; font-size: 1.16rem; }
  .app-brand-tagline { font-size: .54rem; }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .header-actions,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .header-actions { gap: .28rem; }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .hlang-globe,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .hlang-globe {
    min-height: 34px; width: 34px; padding: 0; justify-content: center;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .hlang-label,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .hlang-label { display: none; }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header #logoutBtn,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header #logoutBtn {
    min-height: 34px; padding: .4rem .48rem; font-size: .68rem;
  }
}

/* ── New room dialog: one continuous responsive form flow ─────────────── */
#roomDialog {
  width: min(880px, calc(100% - 24px));
}
#roomForm .room-fields {
  grid-template-columns: minmax(0, 1fr);
}
#roomForm .room-icon-field,
#roomForm .room-icon-choices,
#roomForm .room-icon-choice {
  min-width: 0;
}
#roomForm .room-icon-choices {
  grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
  gap: 10px;
  width: 100%;
}
#roomForm .room-icon-choice {
  width: 100%;
  min-height: 78px;
  padding: 8px 6px;
}
#roomForm .room-icon-choice span {
  display: -webkit-box;
  width: 100%;
  max-height: 2.4em;
  overflow: hidden;
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: auto;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: #082c62;
  -webkit-text-fill-color: #082c62;
  font-weight: 600;
  line-height: 1.2;
  opacity: 1;
  text-shadow: none;
  text-align: center;
}
#roomForm .room-icon-choice.selected span {
  color: #082c62;
  -webkit-text-fill-color: #082c62;
}
@media (max-width: 420px) {
  #roomForm .room-icon-choices {
    grid-template-columns: repeat(auto-fit, minmax(88px, 1fr));
    gap: 8px;
  }
}
@media (max-width: 360px) {
  .app-brand-symbol { flex-basis: 33px; width: 33px; height: 33px; }
  .app-brand-name { font-size: 1.08rem; }
  .app-brand-tagline { font-size: .5rem; }
}

/* ── Signed-in mobile header correction ───────────────────────────────────
   Keep the lockup on one horizontal row even when older mobile rules are
   present elsewhere in this long-lived stylesheet. Auth screens are excluded
   by the signed-in selectors and keep their frozen composition. */
@media (max-width: 600px) {
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .header-inner,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .header-inner {
    display: flex; flex-direction: row; align-items: center; flex-wrap: nowrap;
    height: 92px; min-height: 92px; max-height: 92px; overflow: hidden;
    gap: .45rem; padding: .45rem .7rem;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .app-brand-lockup,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .app-brand-lockup {
    display: flex; flex-direction: row; align-items: center; flex: 1 1 auto;
    min-width: 0; width: auto; overflow: hidden; gap: .45rem;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .app-brand-symbol,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .app-brand-symbol {
    flex: 0 0 34px; width: 34px; height: 34px;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .app-brand-copy,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .app-brand-copy {
    display: block; flex: 1 1 0%; width: 0; min-width: 0; overflow: hidden;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .app-brand-eyebrow,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .app-brand-eyebrow {
    font-size: .42rem; line-height: 1; white-space: nowrap;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .app-brand-name,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .app-brand-name {
    margin: .08rem 0 .1rem; font-size: 1.12rem; line-height: .95; white-space: nowrap;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .app-brand-tagline,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .app-brand-tagline {
    display: block; max-width: 100%; max-height: 2.16em;
    font-size: clamp(.4rem, 1.9vw, .5rem); line-height: 1.08;
    white-space: normal; overflow: hidden; text-overflow: clip;
    overflow-wrap: normal;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .header-actions,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .header-actions {
    display: flex; flex: 0 0 auto; flex-direction: row; align-items: center;
    flex-wrap: nowrap; gap: .25rem; min-width: max-content;
  }
}
@media (max-width: 360px) {
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .header-inner,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .header-inner {
    height: 88px; min-height: 88px; max-height: 88px; padding-inline: .35rem;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .app-brand-lockup,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .app-brand-lockup { gap: .25rem; }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .app-brand-symbol,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .app-brand-symbol {
    flex-basis: 26px; width: 26px; height: 26px;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .app-brand-name,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .app-brand-name { font-size: 1.04rem; }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .app-brand-tagline,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .app-brand-tagline {
    font-size: .36rem; line-height: 1.1;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .header-actions,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .header-actions { gap: .18rem; }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header #logoutBtn,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header #logoutBtn {
    padding-inline: .32rem; font-size: .58rem;
  }
}

/* All localized signed-in straplines use the same compact two-line treatment.
   The flex text column above leaves the globe and logout controls fixed on the
   right, while this rule prevents long translations from being ellipsized. */
@media (max-width: 600px) {
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .app-brand-tagline,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .app-brand-tagline {
    max-height: 2.16em;
  }
}

/* ── Reference mobile dashboard composition ─────────────────────────────────
   The signed-in phone layout is intentionally dense: the brand bar, welcome
   card, four actions, and follow-up cards should all read in one glance. */
@media (max-width: 600px) {
  html[data-hj-theme] body:has(#appView:not(.hidden)) .shell,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) .shell {
    padding-inline: 8px;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .header-inner,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .header-inner {
    height: 44px; min-height: 44px; max-height: 44px; padding: 3px 8px;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .app-brand-lockup,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .app-brand-lockup {
    gap: .38rem;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .app-brand-symbol,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .app-brand-symbol {
    flex: 0 0 31px; width: 31px; height: 31px; filter: none;
  }
  .app-brand-symbol .app-brand-vector { display: none; }
  .app-brand-mark { display: block; width: 100%; height: 100%; object-fit: contain; }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .app-brand-eyebrow,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .app-brand-eyebrow {
    font-size: .34rem; letter-spacing: .12em; line-height: 1;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .app-brand-name,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .app-brand-name {
    margin: .03rem 0 .04rem; font-size: .94rem; line-height: .9;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .app-brand-tagline,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .app-brand-tagline {
    max-height: 2.1em; font-size: .36rem; line-height: 1.05; white-space: normal;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .header-actions,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .header-actions {
    gap: .22rem;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header .hlang-globe,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header .hlang-globe {
    min-height: 27px; width: 27px; border-radius: 7px; font-size: .7rem;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) header #logoutBtn,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) header #logoutBtn {
    min-height: 27px; padding: .25rem .45rem; border-radius: 7px; font-size: .59rem;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) .app-nav,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) .app-nav {
    display: none;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) main,
  html[data-hj-theme] body:has(#homeSetup:not(.hidden)):has(#logoutBtn:not(.hidden)) main {
    padding-top: 4px;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) .welcome-card {
    height: 96px; min-height: 0; margin: 0 0 5px; padding: 6px 12px 7px; border-radius: 13px;
    gap: 4px; align-items: stretch; box-shadow: 0 8px 18px rgba(44,103,220,.2);
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) .welcome-card h2 {
    font-size: 20px; line-height: 1.05; margin: 2px 0;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) .welcome-card p {
    font-size: 10px; line-height: 1.15;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) .welcome-card .smart-primary {
    align-self: flex-end; width: 100%; min-height: 24px; padding: 5px 8px;
    border-radius: 7px; font-size: 10px; line-height: 1; box-shadow: none;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) .quick-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px;
    margin: 0 0 5px;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) .quick-action {
    min-height: 74px; padding: 8px 5px 6px; gap: 4px; border-radius: 11px;
    border-color: rgba(255,255,255,.18); box-shadow: none;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) .quick-action:hover {
    transform: none; box-shadow: none; border-color: rgba(255,255,255,.42);
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) .dashboard-room-entry-icon {
    width: 78px; height: 78px; object-fit: contain;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) .dashboard-quick-icon {
    width: 39px; height: 39px; object-fit: contain;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) .quick-action strong {
    color: #fff; font-size: 10px; line-height: 1;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) .dash-alert-banner,
  html[data-hj-theme] body:has(#appView:not(.hidden)) .ins-dash-card,
  html[data-hj-theme] body:has(#appView:not(.hidden)) .warranty-standalone,
  html[data-hj-theme] body:has(#appView:not(.hidden)) .card:has(#completenessBody) {
    border-radius: 10px; margin-bottom: 4px; padding: 7px 9px;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) .ins-dash-summary h2,
  html[data-hj-theme] body:has(#appView:not(.hidden)) .warranty-standalone h2,
  html[data-hj-theme] body:has(#appView:not(.hidden)) .card:has(#completenessBody) h2 {
    font-size: 11px; margin: 1px 0;
  }
  html[data-hj-theme] body:has(#appView:not(.hidden)) .ins-dash-summary .eyebrow,
  html[data-hj-theme] body:has(#appView:not(.hidden)) .warranty-standalone .eyebrow,
  html[data-hj-theme] body:has(#appView:not(.hidden)) .card:has(#completenessBody) .eyebrow {
    font-size: 6px; letter-spacing: .1em;
  }
}