:root {
  color-scheme: dark;
  --base: #0c0d16;
  --panel: #151722;
  --panel-raised: #1c1e2c;
  --line: #363547;
  --ink: #f4f1ff;
  --muted: #a8a4ba;
  --accent: #b7a0ff;
  --accent-bright: #e3d9ff;
  --warm: #efb394;
  color: var(--ink);
  background: var(--base);
}

body {
  color: var(--ink);
  background: radial-gradient(circle at 86% -14%, #6d4aa83a, transparent 36%),
    radial-gradient(circle at -8% 90%, #bb6b8a1d, transparent 34%), var(--base);
}

button { border-color: #8f78cd; background: #59468d; color: #fbf8ff; }
button:hover:not(:disabled) { border-color: #d6c7ff; background: #745bb1; color: #fff; box-shadow: 0 0 0 1px #b7a0ff55, 0 8px 28px #a87cf155; }
button:focus-visible, a:focus-visible, .table-column-resize:focus-visible { outline: 2px solid var(--accent-bright); outline-offset: 3px; }
.light { background: #222335; border-color: #59546f; color: #e7ddff; }
.light:hover:not(:disabled) { background: #484069; border-color: #c4adff; color: #fff; }
.danger { background: #412a3d; border-color: #99546e; color: #ffdce7; }
.danger:hover:not(:disabled) { background: #873e5c; border-color: #ff9fbd; color: #fff; }
.eyebrow { color: #c5b1ff; font: 800 10px/1.4 ui-monospace, Consolas, monospace; letter-spacing: .19em; }

.brand-mark { background: linear-gradient(135deg, #c5b2ff, #8268c9 62%, #efb394); color: #181323; box-shadow: 0 0 25px #aa87f37a; }
.gate { background: radial-gradient(circle at 50% 42%, #4e357833, transparent 38%), #0b0c14; }
.gate:before { content: ""; position: absolute; inset: 0; opacity: .25; background-image: linear-gradient(#917ab72b 1px, transparent 1px), linear-gradient(90deg, #917ab72b 1px, transparent 1px); background-size: 44px 44px; mask-image: radial-gradient(circle at center, black, transparent 72%); pointer-events: none; }
.gate-card { background: linear-gradient(155deg, #222130fa, #151723f7 72%); border: 1px solid #9180b277; box-shadow: 0 28px 100px #000a, 0 0 70px #8b66bd25; backdrop-filter: blur(18px); }
.gate-card:before { content: ""; position: absolute; inset: 0 22% auto; height: 1px; background: linear-gradient(90deg, transparent, #d5c1ff, transparent); }
.gate-card h1 { color: #fff; }
.gate-card>p:not(.eyebrow) { color: #bbb7cb; }
.gate-card small { color: #9893ad; }
.gate-card>button { background: linear-gradient(105deg, #9275d9, #7354ae); color: #fff; border-color: #b9a0f4; }
.gate-card>button:hover:not(:disabled) { background: linear-gradient(105deg, #8e72d0, #6d4da9); border-color: #e8dcff; color: #fff; box-shadow: 0 0 30px #a77bff88; }
.gate-story { border-color: #514660; }
.gate-art:before, .gate-art:after { border-color: #ad8cf044; }
.art-node { background: #252038d9; border-color: #9e82dc88; color: #e7dbff; box-shadow: 0 10px 30px #9f6fec3b; }

.topbar, .site-footer { background: #141520f5; border-color: #3c374e; box-shadow: 0 5px 24px #07071188; }
.topbar { border-bottom: 1px solid #574b75; }
.brand strong, .account-identity strong { color: #fff; }
.brand small, .account-identity time, .site-footer { color: #aaa4be; }
.account-actions button { background: #242537; border-color: #635579; color: #e5dbff; }
.account-actions button:hover:not(:disabled) { background: #504373; border-color: #d0b9ff; color: #fff; }
.preview-banner { background: #3f3144; border-color: #a0778a; color: #ffdcc2; }

.workspace { border-color: #323144; box-shadow: 0 16px 60px #0004; }
.sidebar { background: linear-gradient(180deg, #1a1b29, #12141f); border-color: #3b394d; }
.sidebar h2 { color: #fff; }
.sidebar-head button { background: #6d53a7; border-color: #a58bd6; color: #fff; box-shadow: 0 5px 18px #8d63d94d; }
.sidebar input, .editor>input { background: #11131e; border-color: #4e4a62; color: #f7f2ff; }
.sidebar input::placeholder, .editor textarea::placeholder { color: #77748d; }
.sidebar input:focus, .editor input:focus, .editor textarea:focus { border-color: #b69cf1; box-shadow: 0 0 0 3px #a686ec30; }
.note-tab { color: #c2bed2; background: transparent; border-color: transparent; }
.note-tab.active { background: #393052; box-shadow: inset 3px 0 #bd9fff, 0 0 18px #9d73f626; color: #f5edff; }
.note-tab:hover:not(:disabled) { background: #574678; border-color: #8b72bb; color: #fff; box-shadow: 0 0 22px #a979f466; }
.tab-icon, .note-tab:hover:not(:disabled) .tab-icon { color: #c9aeff; }
.sidebar-foot { color: #8d88a5; }

.paper { background: radial-gradient(circle at 100% 0, #62469c18, transparent 32%), #171823; }
.breadcrumbs, .note-updated { color: #9a95b0; }
.breadcrumbs span { color: #77718f; }
.breadcrumbs strong { color: #d0baff; }
.paper h1, .paper-empty h2 { color: #fbf9ff; }
.paper-empty { color: #a9a2bc; }
.empty-mark { color: #bca0ff; }
.markdown-body { color: #e7e3f0; }
.markdown-body h2 { border-color: #454258; }
.markdown-body a { color: #d5baff; }
.markdown-body blockquote { background: #25243a; border-color: #b9a0f4; color: #d1cae3; }
.markdown-body code { background: #2c2941; color: #e6d7ff; }
.markdown-body pre { background: #10111b; border-color: #4e4765; }
.markdown-body pre code { background: transparent; color: inherit; }
.markdown-body th, .markdown-body td { border-color: #4c485d; }
.markdown-body th { background: #302d41; }
.markdown-body hr { border-color: #665981; }
.markdown-body .table-wrap { border-color: #524b66; }
.markdown-body .table-wrap th { background: #373149; color: #f3eaff; }
.markdown-body .table-wrap th, .markdown-body .table-wrap td { border-color: #514b60; }
.markdown-body .table-wrap tbody tr:nth-child(even) { background: #211f30; }

.editor-toolbar { background: #242334; border-color: #504761; }
.editor-toolbar>span, .preview-label { color: #bca4e2; }
.editor-toolbar button, .table-grid button { background: #343048; border-color: #696080; color: #e9ddff; }
.editor-toolbar button:hover:not(:disabled), .table-grid button:hover:not(:disabled) { background: #5b4a7e; border-color: #bba3ee; color: #fff; box-shadow: 0 0 15px #9d70e044; }
.language-picker { color: #c2b9d7; }
.language-picker select, .table-workbench-tools select { background: #181825; border-color: #6b5c82; color: #f0e8ff; }
.color-palette, .emoji-picker { background: #222132; border-color: #524966; }
.color-palette label, .color-palette small { color: #c5bed3; }
.color-palette button { border-color: #eee7ff; box-shadow: 0 0 0 1px #9d8aaf; }
.emoji-picker-head strong { color: #fff; }
.emoji-picker-head input { background: #12131f; border-color: #625876; color: #fff; }
.emoji-picker-head button { color: #e5d8ff; }
.emoji-categories button { background: #312d43; border-color: #625776; color: #d8cbed; }
.emoji-categories button[aria-selected="true"] { background: #7359a9; border-color: #b59ce9; color: #fff; }
.emoji-grid button { color: #fff; }
.emoji-grid button:hover:not(:disabled) { background: #54436d; }
.editor-split { border-color: #514862; }
.editor textarea { background: #11131d; color: #e8e4f3; }
.live-preview { background: #1d1d2a; border-color: #514862; }
.format-hint { color: #a8a1b7; }
.format-hint code { color: #d4bbff; }
.editor-actions span { color: #ffd0a9; }

.table-workbench { background: #1c1d2b; border-color: #554b68; }
.table-workbench h3 { color: #fff; }
.table-workbench-tools label, .table-workbench-help, .table-dimensions { color: #b7aec7; }
.table-grid-scroll { border-color: #5a506d; background: #12131e; }
.table-grid { min-width: 0; table-layout: fixed; border-color: #534a65; background: #151622; }
.table-grid th, .table-grid td { min-width: 0; border-color: #464357; }
.table-grid th { position: relative; background: #332d48; }
.table-grid td { background: #1a1a29; }
.table-grid tr:last-child td { border-bottom: 0; }
.table-grid input { min-width: 0; background: transparent; color: #f1ebfb; }
.table-grid input:focus { background: #27243a; border-color: #a98ce2; box-shadow: 0 0 0 3px #a98ce233; }
.table-grid .table-add-cell, .table-grid .table-add-row { background: #272439; }
.table-grid .table-add-cell { min-width: 0; }
.table-grid .table-row-controls { padding: 5px; background: #211e31; white-space: nowrap; }
.table-row-controls button { min-width: 26px; padding: 5px 6px; margin: 0 1px; }
.table-row-controls .table-row-handle { cursor: grab; font-size: 17px; line-height: 1; }
.table-row-controls .table-row-handle:active { cursor: grabbing; }
.table-grid tr.dragging { opacity: .45; }
.table-grid tr.drag-target td { border-top: 2px solid #c7a7ff; background: #302842; }
.table-column-resize { position: absolute; top: 0; right: -5px; z-index: 2; width: 12px; height: 100%; cursor: col-resize; touch-action: none; }
.table-column-resize:after { content: ""; display: block; width: 2px; height: 55%; margin: 13px auto; border-radius: 2px; background: #b09ada; transition: background .15s, box-shadow .15s; }
.table-column-resize:hover:after, .table-column-resize:active:after { background: #fff; box-shadow: 0 0 10px #c7a7ff; }
.table-preview-edit { background: #4b3f69; border-color: #8a70b9; color: #f1e9ff; }

.review { background: #1b1c2a; border-color: #534863; }
.review-row { border-color: #454052; }
.review-row small { color: #aba4bd; }
.delete-dialog { background: #1d1b2a; border-color: #7d607c; color: #f7f1ff; }
.delete-dialog::backdrop { background: #05050dc7; }
.delete-dialog-icon { background: #66324d; color: #ffd1df; }
.delete-dialog h2, .delete-dialog strong { color: #fff; }
.delete-dialog p:not(.eyebrow) { color: #c5b8ca; }
.delete-dialog-actions .danger { background: #9d4561; border-color: #d17c96; color: #fff; }
.delete-dialog-actions .danger:hover:not(:disabled) { background: #bd5b79; border-color: #ffb5c9; }

.site-footer:before { background: linear-gradient(90deg, transparent, #bda2ff 48%, #efb394 72%, transparent); }
.footer-icon { background: linear-gradient(135deg, #c5b2ff, #7856b7); color: #1c1428; }
.footer-developer strong { color: #f4e9ff; }

@media (max-width: 650px) {
  .topbar { box-shadow: 0 3px 16px #0007; }
  .table-grid th, .table-grid td { min-width: 0; }
  .table-row-controls button { min-width: 24px; }
}