.main-container { display:block; max-width:1120px; }
.workspace-page[hidden], .workspace-back[hidden] { display:none !important; }
.workspace-page h1 { font-size:28px; margin:26px 0; letter-spacing:-.5px; }
.workspace-page > p { color:var(--text-secondary); margin:0 0 24px; }
.workspace-back { display:inline-block; margin-top:16px; }
.workspace-tiles { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin:0 0 32px; }
.workspace-tile { display:flex; flex-direction:column; gap:12px; padding:24px; border:1px solid var(--border-subtle); border-radius:14px; background:var(--bg-secondary); color:var(--text-primary); text-decoration:none; }
.workspace-tile:hover { border-color:var(--accent); transform:translateY(-2px); }
.workspace-tile:focus-visible, .workspace-user-menu summary:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.workspace-tile strong { font-size:18px; }
.workspace-tile > span:last-child { font-size:13px; line-height:1.6; color:var(--text-secondary); }
.workspace-mark { font-size:28px; color:var(--accent); }
.workspace-mark svg { display:block; width:26px; height:26px; }
.history-card > .card-header { display:none; }
.workspace-clear { margin-top:24px; }
.workspace-page .card { width:100%; max-width:none; margin:0 0 24px; }
#workspace-home #connect-form { display:grid; grid-template-columns:1fr 1.3fr auto; align-items:start; gap:20px; }
#workspace-home .managed-service-notice, #workspace-home #error-msg { grid-column:1/-1; }
#workspace-home #connect-form > .form-group > label,
#workspace-home .label-row { min-height:24px; margin:0 0 6px; display:flex; align-items:center; }
#workspace-home .label-row { justify-content:space-between; gap:12px; flex-wrap:wrap; }
#workspace-home .label-row label { margin:0; }
#workspace-home .auth-mode-link { font-size:13px; }
#workspace-home .form-actions { padding-top:30px; display:flex; flex-direction:column; gap:8px; }
#workspace-home #device-id, #workspace-home #password { height:44px; }
#workspace-home .btn-connect { min-width:150px; height:44px; padding:10px 14px; margin:0; }
.workspace-setup { margin-bottom:24px; }
.workspace-setup summary { padding:16px 0; cursor:pointer; }
.workspace-setup .setup-guide { margin:0; }
.workspace-groups { display:grid; gap:12px; margin-bottom:24px; }
.workspace-group { display:flex; align-items:center; flex-wrap:wrap; gap:12px; padding:20px; border:1px solid var(--border-subtle); border-radius:12px; }
.workspace-group strong { flex:1; min-width:120px; }
.workspace-account-actions { display:flex; gap:16px; margin-bottom:24px; }
.workspace-danger { color:#f3a5a5; border:1px solid #73434a; }
.user-info { background:transparent; border:0; padding:0; }
.workspace-user-menu { position:relative; }
.workspace-user-menu summary { min-height:44px; padding:10px 18px; cursor:pointer; border:1px solid var(--border-subtle); border-radius:24px; }
.workspace-user-menu-body { position:absolute; right:0; top:calc(100% + 10px); min-width:230px; padding:8px; background:var(--bg-secondary,#181820); border:1px solid var(--border-subtle); border-radius:12px; z-index:100; box-shadow:0 12px 35px #0006; }
.workspace-user-menu-body > * { display:block; width:100%; padding:12px; min-height:44px; text-align:left; background:transparent; border:0; border-radius:6px; font:inherit; color:var(--text-primary); text-decoration:none; cursor:pointer; }
.workspace-user-menu-body > [hidden], .admin-accounts[hidden] { display: none !important; }
.workspace-user-menu-body > *:hover { background:var(--bg-tertiary,#272733); }
.remember-login { display:flex; align-items:center; gap:10px; font-size:14px; cursor:pointer; }
.remember-login input { width:18px; height:18px; accent-color:var(--accent); }
@media(max-width:1000px) {
 #workspace-home #connect-form { display:block; }
 #workspace-home .form-actions { padding-top:0; }
}
@media(max-width:720px) {
 .workspace-tiles { grid-template-columns:repeat(2,1fr); gap:12px; }
 .workspace-tile { padding:18px; }
 #workspace-home #connect-form { display:block; }
 #workspace-home .form-actions { padding-top:0; }
 .workspace-page h1 { font-size:24px; }
}

@media(max-width:720px) { .top-bar-actions { justify-content:flex-end; width:100%; } .workspace-user-menu-body { max-width:calc(100vw - 32px); } }
/* Saved account entries are separate from password entry and worker pairing. */
.trusted-account-row { display: flex; align-items: center; border: 1px solid var(--border-color, #333); border-radius: 8px; margin-top: 8px; }
.trusted-account-name { flex: 1; text-align: left; padding: 16px; background: transparent; color: inherit; border: 0; cursor: pointer; }
.trusted-account-row details { position: relative; margin-right: 12px; }
.trusted-account-row summary { cursor: pointer; padding: 10px; list-style: none; }
.trusted-account-row details button { position: absolute; right: 0; z-index: 2; min-width: 160px; padding: 12px; background: #24242c; color: white; border: 1px solid #555; border-radius: 6px; }
#trusted-accounts h3 { margin: 20px 0 8px; font-size: 14px; }
.download-links { padding:24px; }
.download-links[hidden] { display:none; }
.download-links h2 { margin:0 0 12px; }
.download-links p { color:var(--text-secondary); line-height:1.6; }
.download-links form { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:20px; }
.download-links form > label { flex-basis:100%; }
.download-links form > input:not([type=checkbox]) { box-sizing:border-box; max-width:100%; padding:10px; background:var(--bg-secondary); color:var(--text-primary); border:1px solid var(--border-subtle); border-radius:6px; }
.download-links form > input[type=checkbox] { width:20px; height:20px; }
.download-links button[hidden] { display:none; }
.download-links select { padding:10px; background:var(--bg-secondary); color:var(--text-primary); border:1px solid var(--border-subtle); border-radius:6px; }
.download-links input[type=number] { width:140px; padding:10px; background:var(--bg-secondary); color:var(--text-primary); border:1px solid var(--border-subtle); border-radius:6px; }
.download-link-list { display:grid; gap:16px; }
.download-link-row { display:flex; flex-wrap:wrap; gap:10px; border-top:1px solid var(--border-subtle); padding-top:16px; }
.download-link-row input { width:100%; box-sizing:border-box; padding:12px; color:var(--text-primary); background:var(--bg-secondary); border:1px solid var(--border-subtle); border-radius:6px; }
.download-link-row p { flex-basis:100%; margin:0; }
/* Administrator account controls use the shared workspace layout. */
.admin-account-list { display: grid; gap: 12px; margin: 20px 0; }
.admin-account-row { border: 1px solid var(--border-color, #39404d); border-radius: 12px; padding: 16px; overflow-wrap: anywhere; }
.admin-account-row h3 { margin-top: 0; }
.admin-account-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.admin-accounts > button { margin: 4px; }

/* Comfortable workspace palette; retain a separate light-theme preference. */
body {
 --bg-primary:#202a33; --bg-secondary:#28343e; --bg-card:#28343e;
 --bg-card-elevated:#303e49; --bg-tertiary:#354550;
 --bg-card-border:#43535f; --border-subtle:#43535f; --border-strong:#637583;
 --text-primary:#d8e2e7; --text-secondary:#b5c3cd; --text-muted:#abbcc8;
 --accent:#91beb6; --accent-hover:#a3ccc4; --accent-fg:#182c2b;
 --accent-tint:#91beb619; --brand-mark:#a2c7e5; --brand-mark-hover:#c2dcf0;
 --success:#96c9af; --danger:#e6a7a7;
 color-scheme:dark;
 scrollbar-color:var(--border-strong) var(--bg-primary);
}
body.light-theme {
 --bg-primary:#e8edeb; --bg-secondary:#f1f4f1; --bg-card:#f1f4f1;
 --bg-card-elevated:#e2e9e5; --bg-tertiary:#dae4df;
 --bg-card-border:#becbc5; --border-subtle:#becbc5; --border-strong:#849c92;
 --text-primary:#2e4542; --text-secondary:#4c635f; --text-muted:#526962;
 --accent:#316c60; --accent-hover:#28594f; --accent-fg:#f0f5f1;
 --accent-tint:#316c6014; --brand-mark:#315e83; --brand-mark-hover:#244c6c;
 --success:#316c50; --danger:#984b4b;
 color-scheme:light;
}
.main-container { max-width:1560px; padding:80px 32px 24px; }
.workspace-page h1 { margin:18px 0 24px; }
#workspace-workers .history-card { padding:20px; }
#address-book-list {
 display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
 gap:14px; max-height:none; overflow:visible; scrollbar-gutter:auto;
}
#address-book-list .book-row {
 display:flex; flex-direction:column; align-items:stretch; gap:16px;
 min-width:0; padding:18px; margin:0; border-radius:10px;
 background:var(--bg-card-elevated); border:1px solid var(--border-subtle);
}
#address-book-list .connection-info { flex:1 1 auto; min-width:0; }
#address-book-list .connection-name { font-size:15px; font-weight:600; margin-bottom:6px; }
#address-book-list .connection-id { color:var(--text-secondary); }
#address-book-list .connection-meta { line-height:1.5; margin-top:6px; }
#address-book-list .book-row-actions { gap:6px; align-items:center; }
#address-book-list .book-row-actions > button:first-child { background:var(--accent); color:var(--accent-fg); border-color:transparent; }
#address-book-list .book-row-actions button { min-height:36px; }
#address-book-list .book-more { margin-left:auto; }
#address-book-list .book-more summary { font-size:12px; }
#address-book-list .book-more[open] { width:100%; margin:0; border-top:1px solid var(--border-subtle); }
#address-book-list .book-more-actions { max-width:none; }
#address-book-list .empty-state { grid-column:1/-1; }
.book-toolbar { position:sticky; top:52px; z-index:5; background:var(--bg-card); padding:12px 0; margin-bottom:12px; border-bottom:1px solid var(--border-subtle); }
.book-toolbar .book-filters { margin:0; }
.book-toolbar .book-sort { display:flex; align-items:center; gap:10px; margin-bottom:0; }
.book-pagination { padding-bottom:6px; }
.enroll-body { padding:20px 24px 24px; }
#enroll-error { text-align:left; line-height:1.6; color:var(--text-primary); background:var(--bg-card-elevated); border-color:var(--border-strong); border-left:3px solid var(--danger); }
#enroll-error.enrollment-notice { border-left-color:var(--brand-mark); }
#settings-modal .settings-scope { padding:16px 24px; }
#settings-modal .settings-nav-item.active { background:var(--accent-tint); color:var(--text-primary); border-left:3px solid var(--accent); }
#settings-modal .modal-footer { background:var(--bg-card); }
#settings-modal select, #settings-modal button { font:inherit; }
#settings-modal button:disabled { background:var(--bg-card-elevated); color:var(--text-muted); }
@media(min-width:1000px) {
 #workspace-home { max-width:1120px; margin:auto; }
}
@media(max-width:720px) {
 .main-container { padding:16px; }
 #workspace-workers .history-card { padding:12px; }
 #address-book-list { grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); }
 .book-toolbar { position:static; }
 .enroll-body { padding:16px; }
}

#settings-modal .settings-scope { display:flex; flex-wrap:wrap; align-items:center; gap:12px; border-bottom:1px solid var(--border-subtle); }
#settings-modal .settings-scope label { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
#settings-modal .settings-scope select, #settings-modal .settings-scope button { padding:8px 12px; min-height:38px; border:1px solid var(--border-subtle); border-radius:6px; background:var(--bg-card-elevated); color:var(--text-primary); }
#settings-modal .settings-scope .input-hint { flex-basis:100%; margin:0; }

.workspace-worker-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:16px 0; }
.workspace-worker-heading h1 { margin:0; }
.workspace-worker-heading #btn-enroll-device { width:auto !important; margin:0 !important; }
.book-toolbar { display:grid; grid-template-columns:1fr auto; gap:12px; padding-top:0; }
.book-toolbar .book-filters { grid-column:1/-1; }
.book-toolbar .book-sort { margin:0; }
.book-toolbar .book-pagination { padding:0; gap:20px; }
#address-book-list .book-row { padding:16px; gap:10px; }
#address-book-list .book-row-actions { display:grid; grid-template-columns:1fr auto; }
#address-book-list .book-more { grid-column:1/-1; justify-self:end; }
#address-book-list .book-more summary { padding:4px; }
@media(max-width:720px) {
 .workspace-worker-heading { align-items:flex-start; }
 .workspace-worker-heading h1 { font-size:24px; }
 .workspace-worker-heading #btn-enroll-device { max-width:180px; }
 .book-toolbar { grid-template-columns:1fr; }
 .book-toolbar .book-pagination { justify-content:space-between; }
}
/* Theme changes should not fade through low-contrast intermediate colors. */
.card, .connection-item, button, input, select, .workspace-tile {
 transition-property:border-color, box-shadow, transform;
}
