.account-card{max-width:480px;margin:7vh auto;padding:32px;background:#fff;border:1px solid #d9e1df;border-radius:18px}.account-card form{display:grid;gap:18px}.account-card h1{font-size:30px;margin:24px 0 12px}.account-card img{height:auto}.account-card label{display:grid;gap:7px}.account-card button{margin-top:10px}.online-bar{position:sticky;top:0;z-index:50;background:#172e31;color:#fff;padding:10px 22px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:14px}.online-bar button{background:transparent;border:1px solid #a6b9b8;color:white;border-radius:7px;padding:6px 10px;cursor:pointer}.online-bar #sync-status{margin-right:auto}.online-bar.warn{background:#824c20}.online-panel{max-width:1000px;margin:20px auto;padding:24px;background:#fff;border:1px solid #ddd;border-radius:12px}.online-panel form{display:grid;gap:15px}.online-panel table{width:100%}.online-panel .actions{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0}.online-panel h2{margin:22px 0 14px}body.shared-mode .side-bottom p{font-size:14px}body.shared-mode #content{padding-top:24px}.online-lock{position:fixed;inset:0;z-index:1000;background:#172e31aa;display:grid;place-items:center}.online-lock>div{max-width:620px;margin:20px;padding:30px;border-radius:18px;background:white}.online-lock button{margin:10px 12px 0 0}body.shared-mode #online-root~.shell{min-height:calc(100vh - 50px)}
.shared-mode{--online-bar-height:48px}@media(min-width:801px){.shared-mode aside{top:var(--online-bar-height)}}

/* Accountbeheer blijft binnen het scherm; alleen de inhoud scrolt. */
dialog.online-panel{position:fixed;inset:0;width:min(1000px,calc(100vw - 32px));max-width:none;height:min(860px,calc(100dvh - 32px));max-height:calc(100dvh - 32px);margin:auto;padding:0;overflow:hidden;border:1px solid #d9e1df;border-radius:14px;box-shadow:0 20px 80px #10252540}
dialog.online-panel[open]{display:flex;flex-direction:column}
dialog.online-panel::backdrop{background:#10252599}
.online-panel-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 24px;border-bottom:1px solid #d9e1df;background:white;flex-shrink:0}
.online-panel .online-panel-head h2{margin:0;font-size:24px}
.online-panel-body{padding:24px;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;flex:1}
.online-panel-body>h2:first-child{margin-top:0}
@media(max-width:600px){dialog.online-panel{width:calc(100vw - 12px);height:calc(100dvh - 12px);max-height:calc(100dvh - 12px);border-radius:9px}.online-panel-head{padding:14px 16px}.online-panel .online-panel-head h2{font-size:20px}.online-panel-body{padding:16px}}
