.kcp-appearance{position:relative;flex:0 0 auto;z-index:35}
.kcp-appearance>summary{display:flex;align-items:center;gap:8px;list-style:none;cursor:pointer;padding:8px 11px;border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--ink);font-size:.84rem;font-weight:850}
.kcp-appearance>summary::-webkit-details-marker{display:none}
.kcp-appearance-dot{width:18px;height:18px;border-radius:50%;background:var(--brand);box-shadow:inset 0 0 0 3px var(--panel),0 0 0 1px var(--brand)}
.kcp-appearance-panel{position:absolute;top:calc(100% + 12px);right:0;width:min(340px,calc(100vw - 24px));padding:16px;border:1px solid var(--line);border-radius:20px;background:var(--panel);color:var(--ink);box-shadow:0 18px 55px #11152f30}
.kcp-appearance-panel header{display:flex;align-items:center;justify-content:space-between;font-size:1rem}
.kcp-appearance-panel header button{padding:3px 9px;background:transparent!important;color:var(--muted)!important;font-size:1.4rem}
.kcp-appearance-panel p{margin:14px 0 9px;color:var(--muted);font-size:.78rem;font-weight:800}
.kcp-appearance-modes{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.kcp-appearance-modes button{padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink)!important;font-size:.8rem}
.kcp-appearance-modes button[aria-pressed="true"]{border-color:var(--brand);box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 22%,transparent)}
.kcp-appearance-colours{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.kcp-appearance-colours button{width:36px;height:36px;padding:0;margin:auto;border-radius:50%;background:var(--swatch)!important;color:transparent!important;border:3px solid var(--panel);box-shadow:0 0 0 1px var(--line);position:relative}
.kcp-appearance-colours button[aria-pressed="true"]{box-shadow:0 0 0 2px var(--panel),0 0 0 4px var(--brand)}
.kcp-appearance-colours button:focus-visible,.kcp-appearance>summary:focus-visible{outline:3px solid var(--brand);outline-offset:3px}
html[data-kcp-mode="dark"]{color-scheme:dark;--bg:#0c1120;--ink:#edf0fa;--muted:#a4aec4;--panel:#151c2e;--line:#303a50;--shadow:0 20px 60px #0005}
html[data-kcp-mode="dark"] body{background:var(--bg);color:var(--ink)}
html[data-kcp-mode="dark"] .topbar,html[data-kcp-mode="dark"] .panel,html[data-kcp-mode="dark"] .portal-card,html[data-kcp-mode="dark"] .module,html[data-kcp-mode="dark"] .module-frame,html[data-kcp-mode="dark"] .admin-nav,html[data-kcp-mode="dark"] .admin-action-card,html[data-kcp-mode="dark"] .table,html[data-kcp-mode="dark"] .tr.head{background:var(--panel);color:var(--ink)}
html[data-kcp-mode="dark"] input,html[data-kcp-mode="dark"] select,html[data-kcp-mode="dark"] textarea{background:#0f1728;color:var(--ink);border-color:var(--line)}
html[data-kcp-mode="dark"] .topbar nav a,html[data-kcp-mode="dark"] .module small,html[data-kcp-mode="dark"] .muted{color:var(--muted)}
html[data-kcp-mode="dark"] .kcp-appearance-panel{background:var(--panel)}
@media(max-width:850px){.kcp-appearance{margin-left:auto}.kcp-appearance-panel{position:fixed;top:78px;right:12px}}
@media(max-width:560px){.kcp-appearance-label{display:none}.kcp-appearance>summary{width:42px;height:42px;justify-content:center;padding:0}}

/* K-News shares the same palette and contrast mode as the main portal. */
html[data-kcp-mode="dark"] body{--bg:#0c1120;--ink:#edf0fa;--muted:#a4aec4;--panel:#151c2e;--line:#303a50;--brand:var(--accent,#7c3aed);background:var(--bg);color:var(--ink)}
html[data-kcp-mode="dark"] .news-header,html[data-kcp-mode="dark"] .utility-bar,html[data-kcp-mode="dark"] .card,html[data-kcp-mode="dark"] .panel,html[data-kcp-mode="dark"] .reader-panel,html[data-kcp-mode="dark"] .article-shell,html[data-kcp-mode="dark"] .tr.head{background:var(--panel);color:var(--ink);border-color:var(--line)}
html[data-kcp-mode="dark"] .hero{background:radial-gradient(circle at 20% 0,#182442,transparent 30%),radial-gradient(circle at 90% 20%,#28203a,transparent 28%),var(--bg);color:var(--ink)}
html[data-kcp-mode="dark"] input,html[data-kcp-mode="dark"] textarea,html[data-kcp-mode="dark"] select{background:#0f1728;color:var(--ink);border-color:var(--line)}

.kcp-appearance-global{position:fixed;top:12px;right:14px;z-index:1000}
.kcp-appearance-global .kcp-appearance-panel{top:calc(100% + 10px)}