:root {
  --portal-purple: #6942c5;
  --portal-green: #198b50;
  --portal-red: #bc3a40;
  --portal-yellow: #dd8a13;
}

.portal-page { min-height: 100vh; background: #f4f8fb; }
.portal-main { padding: 54px 0 78px; }
.concept-disclaimer-card { margin-bottom: 22px; border-color: #f0c56f; border-left: 5px solid #df951b; background: #fffaf0; }
.concept-disclaimer-card h2 { margin: 6px 0 10px; }
.concept-disclaimer-card p { max-width: 980px; }
.portal-hero { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 30px; }
.portal-kicker { margin-bottom: 8px; color: var(--blue); font-size: .76rem; font-weight: 900; letter-spacing: .11em; }
.portal-hero h1 { margin: 0; font-size: clamp(2rem, 4vw, 3rem); }
.portal-lead { max-width: 660px; margin: 12px 0 0; color: var(--muted); }
.portal-card { padding: 26px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: 0 12px 30px rgba(8,46,75,.06); }
.portal-card h2, .portal-card h3 { margin-bottom: 8px; }
.portal-card p:last-child { margin-bottom: 0; }
.portal-grid { display: grid; gap: 20px; }
.portal-grid.two { grid-template-columns: minmax(0, 1.4fr) minmax(285px, .8fr); }
.portal-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.portal-grid.admin-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.portal-stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; margin-bottom: 20px; }
.portal-stat { min-height: 122px; display: flex; flex-direction: column; justify-content: space-between; padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: 0 10px 26px rgba(8,46,75,.06); }
.portal-stat span { color: var(--muted); font-weight: 700; }
.portal-stat strong { color: var(--navy); font-size: 2rem; line-height: 1; }
.portal-stat small { color: var(--muted); }

.account-menu { position: relative; }
.account-menu > summary { display: inline-flex; align-items: center; gap: 8px; list-style: none; cursor: pointer; }
.account-menu > summary::-webkit-details-marker { display: none; }
.account-menu .account-menu-panel { position: absolute; right: 0; top: calc(100% + 10px); z-index: 40; width: 245px; padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: #fff; box-shadow: var(--shadow); }
.account-menu-panel [hidden] { display: none !important; }
.account-menu-panel small { display: block; padding: 6px 9px 10px; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.account-menu-panel a, .account-menu-panel button { display: flex; width: 100%; padding: 9px; border: 0; border-radius: 7px; color: var(--ink); background: transparent; text-align: left; font-weight: 750; cursor: pointer; }
.account-menu-panel a:hover, .account-menu-panel button:hover { color: var(--blue); background: var(--soft); }
.account-menu-panel hr { margin: 6px 0; border: 0; border-top: 1px solid var(--line); }
.role-pill, .membership-pill { display: inline-flex; align-items: center; width: fit-content; min-height: 26px; padding: 4px 10px; border-radius: 99px; font-size: .76rem; font-weight: 900; }
.role-pill { color: #fff; background: var(--portal-purple); }
.role-pill:empty { display: none; }
.role-pill.role-admin { background: #5f2bb5; }
.role-pill.role-beheerder { background: #146dc0; }
.role-pill.role-vip { color: #604a00; background: #f8da68; }
.role-pill.role-gebruiker { color: #146a4e; background: #dff8eb; }
.role-pill[hidden] { display: none !important; }
.extension-link-page-button[hidden] { display: none !important; }
.membership-pill { color: #416075; background: #edf3f7; }
.membership-pill.status-active { color: #126f44; background: #e3f8e9; }

.portal-grid--top { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-bottom: 20px; }
.account-summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-width: 0; margin: 0; }
.account-summary > div:last-child { min-width: 0; margin-left: auto; text-align: right; }
.account-summary [data-account-email] { max-width: 100%; margin-left: auto; overflow-wrap: anywhere; word-break: break-word; font-size: clamp(1.15rem, 2.2vw, 1.75rem); line-height: 1.08; }
.dashboard-admin-button { display: inline-flex; align-items: center; justify-content: center; min-width: 190px; min-height: 48px; margin-top: 16px; padding: 12px 22px; border-radius: 10px; font-weight: 850; }
.dashboard-admin-button[hidden] { display: none !important; }
.profile-identity { display: flex; align-items: center; gap: 16px; }
.profile-avatar { display: grid; place-items: center; flex: 0 0 auto; width: 58px; height: 58px; border-radius: 16px; color: #fff; background: linear-gradient(135deg, var(--blue), var(--cyan)); font-size: 1.4rem; font-weight: 950; }
.profile-identity h2 { margin: 0 0 3px; font-size: 1.26rem; }.profile-identity p { margin: 0; color: var(--muted); }
.membership-box { padding: 18px; border-radius: 12px; background: linear-gradient(135deg, #edf8f5, #e7f4fb); }.membership-box span { display: block; color: var(--muted); font-size: .84rem; font-weight: 750; }.membership-box strong { display: block; margin: 3px 0 7px; color: var(--navy); font-size: 1.16rem; }
.membership-remaining.is-expired { color: #c62828; font-weight: 800; }
.portal-callout { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: 20px 0; }
.portal-callout .button-primary { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; min-height: 46px; padding: 11px 18px; border: 1px solid transparent; border-radius: 10px; color: #fff; background: var(--blue); font-weight: 850; box-shadow: 0 8px 18px rgba(20,127,209,.2); transition: transform .18s ease, background .18s ease, box-shadow .18s ease; }
.portal-callout .button-primary:hover { color: #fff; background: #0d6db8; transform: translateY(-2px); box-shadow: 0 12px 22px rgba(20,127,209,.26); }
.portal-gate .button-primary { display: inline-flex; align-items: center; justify-content: center; min-width: 220px; min-height: 52px; padding: 13px 24px; border: 0; border-radius: 12px; color: #fff; background: var(--blue); font-size: 1rem; font-weight: 850; box-shadow: 0 8px 18px rgba(20,127,209,.2); cursor: pointer; transition: transform .18s ease, background .18s ease, box-shadow .18s ease; }
.portal-gate .button-primary:hover { background: #0d6db8; transform: translateY(-2px); box-shadow: 0 12px 22px rgba(20,127,209,.26); }
.extension-link-card { display: block; margin-bottom: 20px; }
.extension-link-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.extension-link-heading > div { min-width: 0; }
.extension-link-heading h2 { margin-bottom: 8px; }
.extension-link-heading > div > p { margin: 0; }
.extension-link-warning { max-width: 850px; margin-top: 9px !important; color: var(--muted); font-size: .84rem; line-height: 1.45; }
.extension-link-status { display: inline-flex; align-items: center; gap: 7px; margin: 5px 0 0; font-size: .88rem; font-weight: 850; }.extension-link-status span { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; color: #fff; }.extension-link-status.is-linked { color: #167346; }.extension-link-status.is-linked span { background: #1b9855; }.extension-link-status.is-unlinked { color: #a13636; }.extension-link-status.is-unlinked span { background: #c74646; }.extension-link-status.is-unknown { color: #815b12; }.extension-link-status.is-unknown span { background: #d39422; }
.extension-link-main-button { min-width: 205px; min-height: 54px !important; padding: 14px 22px !important; border-radius: 13px !important; font-size: 1rem; }
.extension-link-page-button { display: inline-flex; align-items: center; justify-content: center; min-width: 220px; min-height: 52px; padding: 13px 24px; border: 0; border-radius: 12px !important; font-size: 1rem; font-weight: 850; box-shadow: 0 8px 18px rgba(20,127,209,.2); cursor: pointer; }
.extension-link-dialog { width: min(94vw, 820px); height: min(72vh, 430px); padding: 0; border: 0; border-radius: 20px; overflow: hidden; box-shadow: 0 25px 70px rgba(6,44,78,.3); }
.extension-link-dialog::backdrop { background: rgba(4,28,48,.62); backdrop-filter: blur(3px); }
.extension-link-dialog iframe { width: 100%; height: 100%; border: 0; background: #f4f8fb; }
.extension-link-close { position: absolute; z-index: 2; top: 12px; right: 14px; width: 38px; height: 38px; border: 0; border-radius: 50%; color: var(--navy); background: #e9f2f7; font-size: 1.5rem; cursor: pointer; }
.extension-link-embedded { min-height: 0; overflow: hidden; }
.extension-link-embedded .portal-main { width: 100%; padding: 20px; }
.extension-link-embedded .payment-card { min-height: calc(430px - 40px); padding: 22px 26px; }
.extension-link-embedded .payment-card img { max-height: 62px; width: auto; }
.extension-link-embedded .payment-card h1 { margin: 8px 0 10px; }
.extension-link-embedded .payment-card .portal-alert { margin: 20px 0 0; }
.payment-card .extension-link-page-button + .portal-alert { margin-top: 20px; }

.note-toolbar, .toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.note-list { display: grid; gap: 14px; }
.note-card { padding: 17px 18px; border: 1px solid #c9dce8; border-radius: 12px; background: #fbfdff; box-shadow: 0 5px 14px rgba(8,46,75,.04); }
.note-card-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; }.note-card h3 { margin: 0; font-size: 1.05rem; }.note-card p { margin: 10px 0; color: var(--muted); line-height: 1.5; }.note-card small { color: var(--muted); font-size: .78rem; }.note-card-actions { display: flex; flex: 0 0 auto; gap: 10px; }.note-card-actions .button-small { min-height: 44px; color: #fff; background: var(--blue); border: 1px solid var(--blue); border-radius: 9px; cursor: pointer; }.note-card-actions .button-small:hover { background: #0d6db8; }.note-card-actions .button-danger { background: #c74646; border-color: #c74646; }.note-card-actions .button-danger:hover { background: #a93232; }
.note-item { padding: 15px; border: 1px solid var(--line); border-radius: 10px; background: #fbfdff; }
.note-item-top { display: flex; gap: 12px; align-items: start; justify-content: space-between; }.note-item h3 { margin: 0; font-size: 1rem; }.note-item p { margin: 8px 0 0; white-space: pre-wrap; }.note-item time { display: block; margin-top: 9px; color: var(--muted); font-size: .76rem; }
.icon-text-button { border: 0; color: var(--blue); background: transparent; font-weight: 800; cursor: pointer; }.icon-text-button.danger { color: var(--portal-red); }
.note-form, .support-form { display: grid; gap: 13px; }
.portal-label { display: grid; gap: 5px; color: var(--navy); font-size: .85rem; font-weight: 850; }
.portal-input, .portal-select, .portal-textarea { width: 100%; min-height: 43px; padding: 10px 12px; border: 1px solid #c7d8e4; border-radius: 9px; color: var(--ink); background: #fff; font: inherit; }
.portal-textarea { min-height: 132px; resize: vertical; }.portal-input:focus, .portal-select:focus, .portal-textarea:focus { outline: 3px solid rgba(20,127,209,.16); border-color: var(--blue); }
.portal-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-bottom: 14px; }.button-small { min-height: 44px; padding: 10px 16px; border-radius: 9px; font-size: .9rem; }.portal-page button, .portal-page .button-primary, .portal-page .button-ghost { border-radius: 9px; }
.portal-table [data-user-save]{min-width:104px;transition:transform .12s ease,box-shadow .12s ease,background .16s ease,color .16s ease}
.portal-table [data-user-save]:active,.portal-table [data-user-save].is-saving{transform:translateY(2px) scale(.97);box-shadow:inset 0 3px 7px rgba(0,0,0,.24);background:#0d6db8;color:#fff}
.portal-table [data-user-save].is-saved{border-color:#16803c;background:#16803c;color:#fff;box-shadow:0 0 0 3px rgba(22,128,60,.14)}
.portal-table [data-user-save]:disabled{cursor:wait;opacity:1}
.extension-link-content{min-width:0;flex:1}.extension-device-list{display:grid;gap:10px;margin-top:14px}.extension-device-item{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:#f8fbfd}.extension-device-item strong,.extension-device-item small{display:block}.extension-device-item small{margin-top:3px;color:var(--muted)}.extension-device-actions{display:flex;flex:0 0 auto;flex-wrap:wrap;justify-content:flex-end;gap:10px}.extension-device-item .button-danger{color:#fff;background:#c74646;border-color:#c74646}
.extension-device-item.is-cooling{border-color:#e6c47b;background:#fff9ec}.extension-device-item .device-state{color:#815b12;font-weight:800}
.extension-device-copy{min-width:0}.device-relink-button{color:#fff!important;background:var(--blue)!important;border-color:var(--blue)!important;font-weight:850;box-shadow:0 5px 12px rgba(20,127,209,.18)}.device-relink-button:hover{background:#0d6db8!important}.device-relink-button:disabled{cursor:wait;opacity:.72}.device-link-feedback{margin-top:7px!important;color:#315c79!important;font-weight:750}.device-link-feedback.is-success{color:#167346!important}.device-link-feedback.is-error{color:#a13636!important}
.admin-user-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:6px;max-width:292px}.admin-user-actions .button-small{min-width:0;min-height:38px;padding:7px 9px;white-space:normal;font-size:.78rem;line-height:1.15}.admin-user-actions .protected-badge{grid-column:1/-1}.admin-user-delete{color:#fff!important;background:#c74646!important;border-color:#c74646!important}.admin-user-delete:hover{background:#a93232!important;border-color:#a93232!important}.admin-user-delete:disabled{cursor:wait;opacity:.7}
.membership-validity{display:grid;align-items:start;gap:7px;min-width:0}.membership-validity>[data-expiry]{width:100%;min-width:0;min-height:37px;padding:6px 8px;border:1px solid #b9cbd7;border-radius:7px;background:#fff;font:inherit}.membership-validity>[data-expiry]:disabled{color:#7b8992;background:#edf1f3;border-color:#d4dde2;cursor:not-allowed}.membership-validity .lifetime{display:inline-flex;align-items:center;gap:7px;width:max-content;color:var(--navy);font-weight:750;cursor:pointer}.membership-validity .lifetime input{width:17px;height:17px;margin:0;accent-color:var(--blue)}.membership-validity .lifetime:has(input:disabled){cursor:default;opacity:.65}
.device-name-editor{display:flex;align-items:center;gap:8px;margin-top:8px}.device-name-input{width:min(260px,100%);min-height:38px;padding:7px 10px;border:1px solid #c7d8e4;border-radius:8px;color:var(--ink);background:#fff;font:inherit}.device-name-input:focus{outline:3px solid rgba(20,127,209,.16);border-color:var(--blue)}.device-name-save{min-height:38px!important;padding:7px 12px!important}
.admin-device-dialog{width:min(92vw,680px);max-height:min(82vh,650px);padding:0;border:0;border-radius:18px;overflow:hidden;box-shadow:0 25px 70px rgba(6,44,78,.3)}
.admin-device-dialog::backdrop{background:rgba(4,28,48,.62);backdrop-filter:blur(3px)}
.admin-device-dialog-content{max-height:min(82vh,650px);padding:28px;overflow-y:auto}.admin-device-dialog-content h2{margin:0 48px 8px 0}
.note-form:not([hidden]) + .portal-alert { margin-top: 14px; }
.admin-back-button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 16px; }
.admin-back-button--page { width: min(1120px, calc(100% - 48px)); margin: 22px auto 0; }
.payment-back-button { display: inline-flex; align-items: center; justify-content: center; min-width: 220px; min-height: 50px; padding: 13px 22px; border-radius: 10px; font-weight: 850; }
.portal-alert { margin-bottom: 18px; padding: 12px 14px; border: 1px solid #b7d6ea; border-radius: 10px; color: #23546e; background: #eff9ff; }.portal-alert.error { border-color: #f1b7bb; color: #9d252b; background: #fff3f3; }.portal-alert.success { border-color: #b7dfbf; color: #176a35; background: #effbf1; }
.portal-empty { padding: 24px; border: 1px dashed #c7d8e4; border-radius: 10px; color: var(--muted); text-align: center; }
.portal-gate { max-width: 600px; margin: 50px auto; text-align: center; }.portal-gate .button { margin-top: 18px; }

.support-help { padding: 18px; border-left: 4px solid var(--orange); border-radius: 8px; background: var(--cream); color: #546a78; }.support-help strong { display: block; color: var(--navy); }
.support-list { display: grid; gap: 14px; }.request-item { display: grid; grid-template-columns: minmax(0, 1fr) minmax(190px, auto); gap: 22px; align-items: start; padding: 18px; border: 1px solid var(--line); border-radius: 12px; background: #fafdff; box-shadow: 0 5px 14px rgba(8,46,75,.04); }.request-item h3 { margin: 3px 0 8px; font-size: 1.05rem; }.request-item p { margin: 5px 0; color: var(--muted); font-size: .9rem; white-space: pre-wrap; }.request-item small { display: block; margin-top: 10px; color: var(--navy); font-weight: 750; }.request-meta { font-size: .78rem !important; }
.request-tag { display: inline-flex; width: fit-content; padding: 3px 8px; border-radius: 50px; color: #764800; background: #fff0cf; font-size: .72rem; font-weight: 850; }.request-state { display: grid; justify-items: end; gap: 14px; color: var(--muted); font-size: .78rem; font-weight: 800; }.request-status { display: inline-flex; padding: 5px 9px; border-radius: 99px; color: #8a5700; background: #fff0cf; }.request-status--in_behandeling { color: #125b91; background: #e5f3ff; }.request-status--afgerond { color: #166c42; background: #e4f7eb; }.request-actions { display: flex; flex-wrap: wrap; justify-content: end; gap: 10px; }.request-actions button { min-height: 44px; padding: 10px 14px; border: 1px solid #bfd4e2; border-radius: 9px; color: var(--navy); background: #fff; font: inherit; font-size: .82rem; font-weight: 800; cursor: pointer; }.request-actions button:hover:not(:disabled) { color: #fff; background: var(--blue); border-color: var(--blue); }.request-actions button:disabled { opacity: .45; cursor: default; }
.request-status--geweigerd{color:#962d34;background:#fde8e9}.request-actions .is-reject{color:#a52f37;border-color:#e7b4b7}.request-actions .is-reject:hover:not(:disabled){background:#b93b43;border-color:#b93b43}
.support-answer-box{margin-top:16px;padding-top:15px;border-top:1px solid var(--line)}.support-answer-box .portal-textarea{min-height:110px;margin-top:7px}.support-answer-help{margin:5px 0 0!important;font-size:.78rem!important}
.support-replies{display:grid;gap:10px;margin-top:16px}.support-replies>strong{color:var(--navy)}.support-reply{padding:12px 14px;border:1px solid #c9dce8;border-radius:10px;background:#fff}.support-reply>div{display:flex;justify-content:space-between;gap:12px;color:var(--blue);font-size:.78rem;font-weight:850}.support-reply time{color:var(--muted);font-weight:600}.support-reply p{margin:8px 0 0!important;color:var(--ink)!important}.support-reply small{margin-top:7px!important}.support-reply--geweigerd{border-color:#ebc5c7;background:#fff8f8}
.support-status-nav{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}.support-status-nav a{padding:11px 17px;border:1px solid #b8d2e3;border-radius:10px;color:var(--navy);font-weight:800;background:#fff}.support-status-nav a:hover,.support-status-nav a.is-active{border-color:var(--blue);color:#fff;background:var(--blue)}.support-admin-tools{display:grid;gap:7px;margin-bottom:22px}.support-admin-tools>label{font-weight:800;color:var(--navy)}.support-admin-tools>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px}.support-reference{display:inline-flex;margin:6px 0 8px;padding:4px 8px;border-radius:6px;background:#eaf5fc;color:var(--navy);font-size:.78rem;font-weight:850;letter-spacing:.04em}.support-user-meta{display:grid;gap:2px;margin-top:10px}.support-user-meta small{margin:0!important}.request-item.is-archived{background:#f6f7f8;opacity:.94}.support-reply-dialog{width:min(680px,calc(100% - 32px));padding:0;border:0;border-radius:18px;box-shadow:0 25px 70px rgba(3,35,58,.3)}.support-reply-dialog::backdrop{background:rgba(7,35,53,.58)}.support-reply-dialog form{position:relative;display:grid;gap:13px;padding:30px}.support-reply-dialog h2,.support-reply-dialog p{margin:0}.support-reply-dialog textarea{min-height:250px;line-height:1.55}.request-actions .is-archive{border-color:#7a8994}.request-actions .is-restore{border-color:#16814a;color:#126b3e}
.support-bulk-tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:-4px 0 22px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:#f5f9fc}.support-bulk-tools label{display:flex;align-items:center;gap:7px;margin-right:auto;font-weight:800}.support-bulk-tools>span{color:var(--muted);font-size:.84rem;font-weight:750}.support-select{display:flex;align-items:center;gap:7px;margin-bottom:8px;color:var(--navy);font-size:.8rem;font-weight:800}.request-item.is-trashed{background:#f3f3f3;opacity:.9}
.support-status-nav a{display:inline-flex;align-items:center;gap:9px;padding:10px 12px 10px 17px;border-radius:11px;box-shadow:0 4px 10px rgba(8,46,75,.04)}.support-status-nav a strong{display:grid;place-items:center;min-width:27px;height:27px;padding:0 7px;border-radius:99px;color:#0b69ad;background:#e6f4fd;font-size:.76rem;line-height:1}.support-status-nav a:hover strong,.support-status-nav a.is-active strong{color:var(--blue);background:#fff}
@media(max-width:700px){.support-admin-tools>div{grid-template-columns:1fr}.support-status-nav a{flex:1 1 45%;text-align:center}.support-reply-dialog form{padding:23px}.support-reply-dialog textarea{min-height:220px}}
@media(max-width:700px){.extension-link-heading{align-items:stretch;flex-direction:column}.extension-link-main-button{width:100%}.extension-device-item{align-items:stretch;flex-direction:column}.extension-device-actions{justify-content:flex-start}.extension-device-actions .button-small{flex:1 1 150px}.device-name-editor{align-items:stretch;flex-direction:column}.device-name-input{width:100%}}

.site-list { display: grid; gap: 16px; }
.site-card { display: grid; grid-template-columns: 150px minmax(0, 1fr) 230px; gap: 22px; align-items: center; min-height: 116px; padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.site-logo { display: block; width: 150px; height: 76px; padding: 8px; border: 1px solid #e2ebf1; border-radius: 11px; background: #fff; object-fit: contain; object-position: center; box-sizing: border-box; }
.site-card p { margin: 0; color: var(--muted); line-height: 1.5; }
.site-card-actions { display: grid; gap: 10px; justify-items: stretch; }
.site-open-button { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 11px 16px; border: 1px solid var(--blue); border-radius: 9px; color: #fff; background: var(--blue); font-size: .9rem; font-weight: 850; box-shadow: 0 7px 15px rgba(20,127,209,.18); }
.site-open-button:hover { color: #fff; background: #0d6db8; border-color: #0d6db8; }
.site-card--soon .site-logo { opacity: .72; }

.admin-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 22px; }.admin-tab { min-height: 44px; border: 1px solid #c7d8e4; border-radius: 9px; color: var(--navy); background: #fff; padding: 10px 16px; font-weight: 850; cursor: pointer; }.admin-tab:hover { color: #fff; background: var(--blue); border-color: var(--blue); }.admin-tab--link { margin-left: auto; color: #fff; background: var(--blue); border-color: var(--blue); }.admin-tab--link:hover { background: #0d6db8; border-color: #0d6db8; }.admin-sections { display: grid; gap: 20px; }.admin-panel { scroll-margin-top: 90px; }.admin-panel h2 { margin-top: 0; }
.pricing-card--test h2 { margin-bottom: 28px; }
.pricing-test-copy { max-width: 850px; margin: 0; font-size: clamp(1.2rem, 2vw, 1.55rem); line-height: 1.55; }
.pricing-plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:18px}.pricing-plan{margin:0}.pricing-plan h2{margin:.45rem 0 .75rem}.pricing-plan p:not(.portal-kicker){color:var(--muted)}.pricing-plan span{display:block;margin-top:20px;color:#516a7d;font-size:.85rem}.pricing-plan--plus{border:2px solid var(--blue);box-shadow:0 16px 34px rgba(20,127,209,.12)}
.admin-overview-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.admin-overview-database-row{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.admin-overview-database-row .admin-overview-tile{height:100%}
.admin-overview-tile { display: flex; min-height: 0; padding: 18px; flex-direction: column; color: var(--navy); text-decoration: none; transition: transform .18s ease, box-shadow .18s ease; }
[data-admin-role-rights][hidden] { display: none !important; }
[data-admin-membership-plans][hidden] { display: none !important; }
[data-admin-updates][hidden] { display: none !important; }
.admin-update-form{display:grid;grid-template-columns:minmax(120px,.55fr) minmax(170px,.75fr) minmax(260px,1.7fr);gap:14px;align-items:end}.admin-update-form label{display:grid;gap:6px;color:var(--navy);font-weight:800}.admin-update-important{display:flex!important;align-items:center;align-self:center;gap:8px!important}.admin-update-important input{width:18px;height:18px;accent-color:var(--blue)}.admin-update-changes,.admin-update-actions{grid-column:1/-1}.admin-update-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.admin-update-list{display:grid;gap:12px}.admin-update-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:15px;border:1px solid var(--line);border-radius:12px;background:#f8fbfd}.admin-update-item h3{margin:0 0 5px}.admin-update-item p{margin:0;color:var(--muted)}

.membership-plan-create-card>p,.membership-plan-list+p{color:var(--muted)}
.membership-plan-form{display:grid;grid-template-columns:minmax(220px,1.5fr) minmax(150px,.7fr) minmax(170px,.8fr) auto;gap:14px;align-items:end}
.membership-plan-form .button-primary{min-height:43px;white-space:nowrap}
.membership-plan-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:8px}.membership-plan-heading h2{margin:5px 0 0}.membership-plan-heading>strong{padding:8px 12px;border-radius:999px;color:var(--blue);background:#e8f5fd;white-space:nowrap}
.membership-plan-list{display:grid;gap:12px;margin-top:20px}
.membership-plan-row{display:grid;grid-template-columns:minmax(190px,1.3fr) minmax(135px,.65fr) minmax(165px,.8fr) minmax(80px,.45fr) auto;gap:12px;align-items:end;padding:15px;border:1px solid var(--line);border-radius:12px;background:#f9fcfe}
.membership-plan-active{display:flex;align-items:center;gap:8px;min-height:43px;color:var(--navy);font-weight:800}.membership-plan-active input{width:18px;height:18px;accent-color:var(--blue)}
.membership-plan-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-height:43px}.membership-plan-actions .button-small{min-height:43px;white-space:nowrap}.membership-plan-actions .protected-badge{white-space:nowrap}

.concept-access-badge{display:inline-flex;align-items:center;width:max-content;padding:3px 7px;border-radius:999px;font-size:.68rem;font-weight:800;line-height:1.1}
.concept-access-badge.is-approved{color:#0b6b38;background:#dcf7e8}
.concept-access-badge.is-pending{color:#8b5300;background:#fff0c8}
.button-small.button-success{color:#fff;border-color:#16814a;background:#16814a}
.button-small.button-warning{color:#744400;border-color:#e5a12a;background:#fff2cf}
.account-delete-dialog{width:min(540px,calc(100% - 32px));padding:0;border:0;border-radius:18px;color:var(--ink);background:#fff;box-shadow:0 28px 80px rgba(3,35,58,.34)}
.account-delete-dialog::backdrop{background:rgba(7,35,53,.62)}
.account-delete-dialog-inner{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px 16px;padding:28px}
.account-delete-dialog-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;color:#fff;background:#c74646;font-size:1.35rem;font-weight:950}
.account-delete-dialog h2,.account-delete-dialog p{margin:0}.account-delete-dialog .portal-kicker{margin:0 0 4px}.account-delete-dialog-inner>p{grid-column:1/-1;line-height:1.55}
.account-delete-dialog-user{padding:11px 13px;border:1px solid #f0c4c4;border-radius:10px;color:#8e2020;background:#fff5f5;font-weight:850;overflow-wrap:anywhere}
.account-delete-dialog-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:10px;margin-top:4px}.account-delete-dialog-actions .button-small{min-width:125px}
.admin-overview-tile:hover { color: var(--navy); transform: translateY(-3px); box-shadow: 0 16px 34px rgba(6,44,78,.14); }
.admin-overview-tile h2 { margin: 5px 0 10px; font-size: clamp(1.25rem, 2vw, 1.65rem); line-height: 1.08; }
.admin-overview-tile p { margin: 0 0 10px; color: #536b7d; font-size: .9rem; line-height: 1.4; }
.admin-overview-tile p strong { color: var(--blue); font-size: 1.45rem; }
.admin-overview-tile>span:last-child { margin-top: auto; padding-top: 7px; font-size: .85rem; font-weight: 850; }
.admin-overview-list { display: grid; gap: 3px; margin: 0 0 7px; }
.admin-overview-list div { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 12px; }
.admin-overview-list dt { color: #536b7d; font-size: .82rem; }
.admin-overview-list dd { margin: 0; color: var(--blue); font-size: 1rem; font-weight: 900; }
.admin-overview-list--attention dt,.admin-overview-list--attention dd { color: #a65a00; font-weight: 900; }
.admin-overview-tile--database { border-color: #9ccdea; background: linear-gradient(135deg,#fff,#eff9ff); }
.portal-page[data-portal-page]:not([data-portal-resolved]) [data-portal-gate],
.portal-page[data-portal-page]:not([data-portal-resolved]) [data-admin-denied],
.portal-page[data-portal-page]:not([data-portal-resolved]) [data-portal-content] { visibility: hidden !important; }
.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; background: #fff; }.portal-table { width: 100%; min-width: 780px; border-collapse: collapse; font-size: .87rem; }.portal-table th, .portal-table td { padding: 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }.portal-table th { color: #516a7d; background: #f4f8fb; font-size: .76rem; letter-spacing: .025em; text-transform: uppercase; }.portal-table tr:last-child td { border-bottom: 0; }.portal-table tr.is-pinned td { background: #f8fbff; }.portal-table td:first-child strong, .portal-table td:first-child small { display: block; }.admin-user-identity { display: flex; min-width:0; align-items: center; gap: 10px; }.admin-user-identity>div{min-width:0}.admin-user-details{display:grid;grid-template-rows:auto auto auto;justify-items:start;gap:5px}.user-pin-button { display: grid; place-items: center; flex: 0 0 auto; width: 31px; height: 31px; padding: 0; border: 1px solid #c8d9e5; border-radius: 8px; background: #fff; cursor: pointer; filter: grayscale(1); opacity: .55; }.user-pin-button:hover, .user-pin-button.is-pinned { border-color: var(--blue); background: #eaf6ff; filter: none; opacity: 1; }.portal-table .user-display-name { display:flex!important;align-items:center;flex-wrap:wrap;gap:5px;margin:0;color:var(--navy);font-weight:850; }.portal-table td:first-child strong { color: var(--muted); font-size: .82rem; overflow-wrap:anywhere; }.portal-table .portal-select { min-height: 35px; padding: 6px 8px; font-size: .82rem; }.admin-search { display: flex; gap: 8px; max-width: 520px; margin-bottom: 16px; }.admin-search .portal-input { min-height: 42px; }.admin-search .button-primary { border-radius: 9px; }
.admin-user-groups{display:grid;gap:16px}.admin-user-group{border:1px solid #c8dbe8;border-radius:13px;background:#f7fbfe;overflow:hidden}.admin-user-group>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 17px;color:var(--navy);background:#eef7fc;font-size:1rem;font-weight:900;cursor:pointer;list-style:none}.admin-user-group>summary::-webkit-details-marker{display:none}.admin-user-group>summary::after{content:'+';order:3;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;color:#fff;background:var(--blue)}.admin-user-group[open]>summary::after{content:'−'}.admin-user-group>summary strong{margin-left:auto;padding:3px 9px;border-radius:99px;color:#0b69ad;background:#fff;font-size:.78rem}.admin-user-group .table-wrap{border:0;border-top:1px solid var(--line);border-radius:0;overflow-x:hidden}.admin-users-table{min-width:0;table-layout:fixed}.admin-users-table .admin-col-user{width:25%}.admin-users-table .admin-col-role{width:10%}.admin-users-table .admin-col-plan{width:17%}.admin-users-table .admin-col-validity{width:18%}.admin-users-table .admin-col-actions{width:30%}.admin-users-table select{width:100%;max-width:100%;min-width:0;box-sizing:border-box}.admin-users-table td,.admin-users-table th{padding:10px 9px}.admin-user-group--pending>summary{background:#fff4d8}.admin-user-group--pending>summary::after{background:#d98a00}
.extension-link-indicator { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding:0 6px; margin-left: 5px; border-radius: 99px; color: #fff; font-size: .75rem; font-weight: 950; vertical-align: middle; }.extension-link-indicator.is-linked { background: #1b9855; }.extension-link-indicator.is-unlinked { background: #c74646; }
.permission-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }.permission-row { display: flex; align-items: center; gap: 10px; padding: 11px; border: 1px solid var(--line); border-radius: 9px; background: #fff; font-size: .87rem; font-weight: 750; }.permission-row input { width: 18px; height: 18px; accent-color: var(--portal-purple); }.admin-owner-note { margin-top: 12px; color: var(--muted); font-size: .83rem; }

@media (max-width: 820px) {
  .portal-main { padding: 35px 0 55px; }.portal-hero { display: block; }.portal-hero h1 { margin-top: 4px; }.portal-grid.two, .portal-grid.three, .portal-grid.admin-stats, .portal-grid--top { grid-template-columns: 1fr; }.portal-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }.admin-overview-grid,.admin-overview-database-row,.pricing-plan-grid { grid-template-columns: 1fr; }.site-card { grid-template-columns: 130px 1fr; }.site-logo { width: 130px; height: 68px; }.site-card-actions { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); }.permission-grid { grid-template-columns: 1fr; }.membership-plan-form,.membership-plan-row,.admin-update-form{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-update-title,.admin-update-important{grid-column:auto}.membership-plan-actions{justify-content:flex-start}
}
@media (min-width:821px) and (max-width:1120px){.admin-overview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 660px) {
  .portal-main { padding-top: 26px; }.portal-card { padding: 19px; }.portal-hero { margin-bottom: 20px; }.profile-identity { align-items: start; }.account-summary { align-items: flex-start; }.account-summary [data-account-email] { font-size: 1.05rem; }.portal-callout { align-items: stretch; flex-direction: column; }.portal-callout .button-primary { width: 100%; }.request-item { grid-template-columns: 1fr; gap: 14px; }.request-state { justify-items: start; }.request-actions { justify-content: start; }.note-toolbar, .toolbar { align-items: stretch; flex-direction: column; }.admin-search { max-width: none; }.account-menu .account-menu-panel { right: auto; left: 0; }.site-card { grid-template-columns: 1fr; }.site-logo { width: 100%; height: 88px; }.site-card-actions { grid-column: auto; grid-template-columns: 1fr; }.membership-plan-form,.membership-plan-row,.admin-update-form{grid-template-columns:1fr}.admin-update-title,.admin-update-important{grid-column:1}.admin-update-item{grid-template-columns:1fr}.membership-plan-heading{align-items:flex-start;flex-direction:column}.membership-plan-actions{justify-content:stretch}.membership-plan-actions>*{flex:1}.account-delete-dialog-inner{grid-template-columns:1fr;padding:22px}.account-delete-dialog-inner>*{grid-column:1}.account-delete-dialog-actions{display:grid;grid-template-columns:1fr 1fr}.account-delete-dialog-actions .button-small{min-width:0}
}