/* DRUMOJO 2.4.1 semantic appearance layer, account UI and mobile adaptation */
:root{color-scheme:light;--k25-page:#f2f3f5;--k25-surface:#fff;--k25-text:#182839;--k25-text-muted:#526274;--k25-border:#d4dbe0;--k25-accent:#245a7c;--k25-soft:#e8eef0;--k25-menu:#fafbfc;--k25-input:#fff}
html[data-k25-appearance=dark]{color-scheme:dark;--k25-page:#0d1721;--k25-surface:#152332;--k25-text:#eff5fa;--k25-text-muted:#c0cbd6;--k25-border:#415263;--k25-accent:#9ed8f1;--k25-soft:#203749;--k25-menu:#132130;--k25-input:#192b3b}
@media(prefers-color-scheme:dark){html[data-k25-appearance=system]{color-scheme:dark;--k25-page:#0d1721;--k25-surface:#152332;--k25-text:#eff5fa;--k25-text-muted:#c0cbd6;--k25-border:#415263;--k25-accent:#9ed8f1;--k25-soft:#203749;--k25-menu:#132130;--k25-input:#192b3b}}
html,body{background:var(--k25-page);color:var(--k25-text)}
body{--canvas:var(--k25-page);--white:var(--k25-surface);--ink:var(--k25-text);--muted:var(--k25-text-muted);--line:var(--k25-border);--accent:var(--k25-accent)}
.drumojo-display-toggle{border:1px solid var(--k25-border);border-radius:999px;color:var(--k25-text);background:var(--k25-surface);font-size:11px;white-space:nowrap;min-height:40px;padding:8px 13px;font-weight:650;line-height:1.3}
.drumojo-display-toggle:hover{border-color:var(--k25-accent)}
.site-header,.site-nav.open{background:var(--k25-menu);color:var(--k25-text);border-color:var(--k25-border)}
.site-nav a,.header-actions>.nav-signin{color:var(--k25-text)}
:is(.chapter,.feature-card,.plan-card,.manage-main,.auth-panel,.stat-box,.workflow,.bottom-cta){background:var(--k25-surface);color:var(--k25-text);border-color:var(--k25-border)}
:is(.chapter,.feature-card,.plan-card,.manage-main,.auth-panel,.stat-box,.workflow,.bottom-cta) :is(p,small){color:var(--k25-text-muted)}
:is(.chapter,.feature-card,.plan-card,.manage-main,.auth-panel,.stat-box,.workflow,.bottom-cta) :is(h1,h2,h3,strong,th,td){color:var(--k25-text)}
.inner,.hero{background:var(--k25-page);color:var(--k25-text)}
.inner :is(h1,h2,h3),.hero-copy :is(h1,h2),.hero-copy p{color:var(--k25-text)}
.inner :is(.inner-head>p:last-child,.feature-card p,.plan-card p,.manage-subtle),.hero-lead,.workflow p{color:var(--k25-text-muted)}
.feature-card,.plan-card,.manage-main{border-color:var(--k25-border)}
.manage-nav button{color:var(--k25-text);font-size:14px;min-height:46px}
.manage-nav button.active{background:var(--k25-soft);color:var(--k25-text);font-weight:750}
.manage-main{box-shadow:0 9px 35px #00000008}
.manage-table :is(th,td){border-color:var(--k25-border);color:var(--k25-text)}
:is(.auth-panel,.manage-main) :is(input:not([type=color]),select,textarea){background:var(--k25-input);color:var(--k25-text);border:1px solid var(--k25-border);border-radius:10px;min-height:45px}
:is(.auth-panel,.manage-main) .form-field,.manage-main .form-field small{color:var(--k25-text)}
:is(.auth-panel,.manage-main) input:focus-visible,:is(.auth-panel,.manage-main) select:focus-visible{outline:3px solid var(--k25-accent);outline-offset:2px}
:is(.auth-panel,.manage-main) :is(input,textarea)::placeholder{color:var(--k25-text-muted)}
.stat-box{background:var(--k25-soft)}.stat-box small{color:var(--k25-text-muted)}
.info-note{background:var(--k25-soft);color:var(--k25-text);border-color:var(--k25-accent)}
:is(.button-outline,.button-secondary){background:var(--k25-surface);color:var(--k25-text);border:1px solid var(--k25-border)}
:is(.button-outline,.button-secondary):hover{background:var(--k25-soft)}
.form-status.info{background:var(--k25-soft);color:var(--k25-text)}
.workspaces-list{display:grid;gap:10px;margin:19px 0 28px}.workspace-choice{background:var(--k25-soft);border:1px solid var(--k25-border);border-radius:13px;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;gap:15px}.workspace-choice b{font-size:15px}.workspace-choice small{display:block;color:var(--k25-text-muted);font-size:12px;margin-top:5px}.workspace-choice .button{flex:none}.role-editor{display:flex;align-items:center;gap:9px}.role-editor select{min-width:108px;font-size:13px}.role-editor .button{min-height:43px;padding:6px 12px}
@media(max-width:1000px){.manage-layout{grid-template-columns:1fr}.manage-nav{position:static;display:flex;overflow:auto;max-width:calc(100vw - 32px);padding:0 0 10px}.manage-nav button{flex-shrink:0;white-space:nowrap}}
@media(max-width:780px){.drumojo-display-toggle{font-size:0;min-width:40px;width:40px;height:40px;padding:0}.drumojo-display-toggle:after{content:'◐';font-size:22px;line-height:1}.site-header{gap:9px}.manage-layout{gap:13px}.manage-main{padding:22px 16px}.workspace-choice{padding:13px 12px}}
@media(max-width:450px){.workspace-choice{align-items:start;flex-direction:column}.manage-main .role-editor{flex-direction:column;align-items:start}.manage-nav{max-width:calc(100vw - 16px)}}
@media print{.drumojo-display-toggle{display:none!important}html{color-scheme:light!important}}

/* Preserve WCAG contrast when bright accent colors are selected for a dark interface. */
html[data-k25-appearance=dark] :is(.button-primary,.button.button-primary),html[data-k25-appearance=dark] .hero-actions .button-primary{background:#285d7b;color:#fff;border-color:#4489af}
@media(prefers-color-scheme:dark){html[data-k25-appearance=system] :is(.button-primary,.button.button-primary),html[data-k25-appearance=system] .hero-actions .button-primary{background:#285d7b;color:#fff;border-color:#4489af}}
html[data-k25-appearance=dark] :is(.eyebrow,.tag,.section-label),html[data-k25-appearance=dark] .plan-card .price-note{color:#c8d6e5}
@media(prefers-color-scheme:dark){html[data-k25-appearance=system] :is(.eyebrow,.tag,.section-label),html[data-k25-appearance=system] .plan-card .price-note{color:#c8d6e5}}
html[data-k25-appearance=dark] .manage-nav button:hover,html[data-k25-appearance=dark] .manage-table tbody tr:hover{background:var(--k25-soft)}
@media(prefers-color-scheme:dark){html[data-k25-appearance=system] .manage-nav button:hover,html[data-k25-appearance=system] .manage-table tbody tr:hover{background:var(--k25-soft)}}
/* Quiet low-light cards, conspicuous actionable text, and no pale decorative overlays behind headings. */
html[data-k25-appearance=dark] .hero:before{opacity:.10}
html[data-k25-appearance=dark] :is(.workflow-action,.auth-links a,.feature-card .tag,.plan-card .tag){color:#addff7}
@media(prefers-color-scheme:dark){html[data-k25-appearance=system] .hero:before{opacity:.10}html[data-k25-appearance=system] :is(.workflow-action,.auth-links a,.feature-card .tag,.plan-card .tag){color:#addff7}}
.setup-description{font-size:13px;line-height:1.6;color:var(--k25-text-muted);margin:0 0 18px}.setup-journey{margin:30px 0 24px;border:1px solid var(--k25-border);border-radius:16px;overflow:hidden}.journey-heading{padding:16px 20px;background:var(--k25-soft)}.journey-heading h3{margin:0!important}.journey-heading small{display:block;color:var(--k25-text-muted);font-size:11px;margin-top:5px}.journey-list{display:grid;grid-template-columns:1fr 1fr}.journey-list>button,.journey-list>a{color:var(--k25-text);background:var(--k25-surface);padding:19px 20px;border:0;border-bottom:1px solid var(--k25-border);text-align:left;min-height:94px;cursor:pointer}.journey-list>button:nth-child(odd),.journey-list>a:nth-child(odd){border-right:1px solid var(--k25-border)}.journey-list :is(strong,span){display:block}.journey-list strong{font-size:13px}.journey-list span{color:var(--k25-text-muted);font-size:12px;margin-top:6px;line-height:1.5}.journey-list>button:hover,.journey-list>a:hover{background:var(--k25-soft)}.tenant-preview{display:flex;align-items:center;gap:18px;border:1px solid var(--k25-border);border-radius:14px;background:var(--k25-soft);padding:18px;margin-bottom:24px;min-height:120px}.tenant-emblem{height:70px;width:70px;border-radius:14px;background:#1b425d;color:#fff;display:grid;place-items:center;font-size:29px;font-weight:750;overflow:hidden;flex:none}.tenant-emblem img{max-height:68px;max-width:68px;object-fit:contain}.tenant-preview span{display:block;letter-spacing:.1em;font-size:9px;color:var(--k25-text-muted)}.tenant-preview strong{display:block;font-size:22px;line-height:1.2;color:var(--k25-text);margin:8px 0}.tenant-preview small{color:var(--k25-text-muted);font-size:11px}@media(max-width:620px){.journey-list{grid-template-columns:1fr}.journey-list>button:nth-child(odd),.journey-list>a:nth-child(odd){border-right:0}.tenant-preview{align-items:flex-start}}
