/*
  Quiet brand refinement for 大神写作分身.
  The original layout and component geometry are intentionally untouched.
*/

:root {
  --brand-navy: #1e2f5a;
  --brand-blue: #2e5bff;
  --ai-cyan: #35bfc8;
  --brand-gold: #e9b94f;
  --bg: #f3f4f6;
  --surface: #ffffff;
  --surface-soft: #f6f7f9;
  --surface-quiet: #fafafa;
  --line: #e7e9ed;
  --line-strong: #d8dce3;
  --text: #202124;
  --text-2: #505864;
  --muted: #858d99;
  --blue: #2563d9;
  --blue-ink: #1d55bc;
  --blue-soft: #eef4ff;
  --black: #202124;
  --success: #2a7a57;
  --danger: #c23d3d;
  --focus-ring: rgba(37, 99, 217, .18);
  --shadow-float: 0 18px 48px rgba(31, 35, 41, .11);
  font-family: Inter, "Noto Sans SC", "Microsoft YaHei UI", "Microsoft YaHei", "Source Han Sans SC", "PingFang SC", sans-serif;
}

body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Brand appears as identity, not decoration. */
.brand img {
  border-radius: 7px;
  box-shadow: 0 1px 5px rgba(30, 47, 90, .11);
}

.brand strong {
  color: var(--brand-navy);
  font-weight: 740;
}

.topbar {
  border-bottom-color: var(--line);
  background: rgba(255, 255, 255, .985);
}

/* Buttons keep the product's familiar black hierarchy. */
.primary-button {
  border-color: var(--black);
  background: var(--black);
  box-shadow: none;
}

.primary-button:hover {
  border-color: #111318;
  background: #111318;
}

.ghost-button:hover,
.icon-button:hover {
  border-color: transparent;
  background: #f2f3f5;
  color: var(--text);
}

.soft-button:hover {
  border-color: #c8cdd5;
  background: #f7f8fa;
  color: var(--text);
}

.avatar-button {
  border-color: var(--line);
  background: #f5f6f8;
  color: #424a55;
}

.avatar-button:hover {
  border-color: #cbd1d9;
  background: #eceff3;
  color: var(--brand-navy);
}

button:focus-visible,
[role="button"]:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[contenteditable]:focus-visible {
  outline-color: var(--focus-ring);
}

/* Shelf is deliberately left close to the accepted original. */
.story-entry {
  border-color: #e1e5ea;
  background: #fff;
  box-shadow: 0 8px 24px rgba(32, 39, 48, .04);
}

.story-entry:hover {
  border-color: #cbd4e0;
  box-shadow: 0 10px 28px rgba(32, 39, 48, .07);
}

.story-entry-icon {
  background: transparent url("/static/brand/dashen-pixel-mark.png") center / 54px 54px no-repeat;
  color: transparent;
  box-shadow: 0 3px 10px rgba(30, 47, 90, .1);
}

.story-entry-icon .icon { opacity: 0; }

.story-entry-copy small,
.book-kind,
.text-button {
  color: var(--blue-ink);
}

.book-card {
  border-color: var(--line);
  box-shadow: none;
}

.book-card:hover {
  border-color: #cbd1d9;
  box-shadow: 0 9px 22px rgba(28, 34, 42, .055);
}

.book-cover {
  box-shadow: 0 8px 18px rgba(22, 28, 36, .13);
}

.search-field:focus-within {
  border-color: #9eb6eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 217, .055);
}

/* Workspace surfaces retain their original positions and density. */
.module-rail {
  border-right-color: var(--line);
  background: #fafbfc;
}

.rail-button,
.rail-bottom-button {
  color: #626b78;
}

.rail-button:hover,
.rail-bottom-button:hover {
  background: #f0f2f5;
  color: var(--text);
}

.rail-button.active {
  background: #edf0f4;
  color: var(--text);
  box-shadow: none;
}

.rail-button.active .icon {
  color: var(--brand-navy);
  stroke-width: 1.85;
}

/*
  Primary product navigation uses the approved compact pixel language.
  At this small size the icons stay monochrome so navigation remains quiet.
*/
.brand-skin-preview #moduleNav .rail-button > .icon,
.brand-skin-preview .rail-bottom-button > .icon {
  display: none;
}

.brand-skin-preview #moduleNav .rail-button::before,
.brand-skin-preview .rail-bottom-button::before {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  content: "";
  background-color: #66758d;
  -webkit-mask: var(--pixel-nav-icon) center / contain no-repeat;
  mask: var(--pixel-nav-icon) center / contain no-repeat;
  transition: background-color 130ms ease;
}

.brand-skin-preview #moduleNav .rail-button[data-module="writing"] {
  --pixel-nav-icon: url("/static/brand/icons/pixelarticons/writing.svg");
}

.brand-skin-preview #moduleNav .rail-button[data-module="project"] {
  --pixel-nav-icon: url("/static/brand/icons/pixelarticons/direction.svg");
}

.brand-skin-preview #moduleNav .rail-button[data-module="outline"] {
  --pixel-nav-icon: url("/static/brand/icons/pixelarticons/outline.svg");
}

.brand-skin-preview #moduleNav .rail-button[data-module="world"] {
  --pixel-nav-icon: url("/static/brand/icons/pixelarticons/setting.svg");
}

.brand-skin-preview #moduleNav .rail-button[data-module="characters"] {
  --pixel-nav-icon: url("/static/brand/icons/pixelarticons/characters.svg");
}

.brand-skin-preview #moduleNav .rail-button[data-module="related"] {
  --pixel-nav-icon: url("/static/brand/icons/pixelarticons/related.svg");
}

.brand-skin-preview .rail-bottom-button {
  --pixel-nav-icon: url("/static/brand/icons/pixelarticons/setting.svg");
}

.brand-skin-preview #moduleNav .rail-button:hover::before,
.brand-skin-preview .rail-bottom-button:hover::before {
  background-color: var(--brand-navy);
}

.brand-skin-preview #moduleNav .rail-button.active {
  background: #edf3ff;
  color: var(--brand-navy);
}

.brand-skin-preview #moduleNav .rail-button.active::before {
  background-color: var(--brand-blue);
}

/* Global actions share the same family, while editor commands stay line-based. */
.brand-skin-preview .topbar .ghost-button[data-modal] > .icon,
.brand-skin-preview .library-tools .primary-button[data-modal="new-book"] > .icon {
  display: none;
}

.brand-skin-preview .topbar .ghost-button[data-modal]::before,
.brand-skin-preview .library-tools .primary-button[data-modal="new-book"]::before {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  content: "";
  background-color: currentColor;
  -webkit-mask: var(--pixel-action-icon) center / contain no-repeat;
  mask: var(--pixel-action-icon) center / contain no-repeat;
}

.brand-skin-preview [data-modal="stats"] {
  --pixel-action-icon: url("/static/brand/icons/pixelarticons/stats.svg");
}

.brand-skin-preview [data-modal="search"] {
  --pixel-action-icon: url("/static/brand/icons/pixelarticons/search.svg");
}

.brand-skin-preview [data-modal="import"] {
  --pixel-action-icon: url("/static/brand/icons/pixelarticons/import.svg");
}

.brand-skin-preview [data-modal="export"] {
  --pixel-action-icon: url("/static/brand/icons/pixelarticons/export.svg");
}

.brand-skin-preview [data-modal="theme"] {
  --pixel-action-icon: url("/static/brand/icons/pixelarticons/theme.svg");
}

.brand-skin-preview [data-modal="trash"] {
  --pixel-action-icon: url("/static/brand/icons/pixelarticons/trash.svg");
}

.brand-skin-preview [data-modal="new-book"] {
  --pixel-action-icon: url("/static/brand/icons/pixelarticons/new.svg");
}

.context-column,
.context-content {
  border-right-color: var(--line);
  background: #f8f9fb;
}

.book-summary,
.context-footer {
  border-color: var(--line);
}

.book-summary strong {
  color: var(--text);
}

.context-item:hover {
  background: #f0f2f5;
}

.context-item.active {
  background: #edf3fd;
  color: #234e9c;
}

.context-item-number,
.context-item-number.character-avatar-marker {
  background: #eceff3;
  color: #667181;
}

.context-item.active .context-item-number,
.context-item.active .context-item-number.character-avatar-marker {
  background: #dce7f8;
  color: #234e9c;
}

.chapter-context-row:hover .chapter-row-menu,
.chapter-row-menu:focus-visible,
.setting-context-row:hover .setting-row-menu,
.setting-row-menu:focus-visible {
  background: rgba(255, 255, 255, .88);
  color: var(--text);
  box-shadow: 0 3px 10px rgba(31, 35, 41, .07);
}

.main-toolbar,
.main-status {
  border-color: var(--line);
}

.main-toolbar-title,
.document h1,
.writing-title-row h1 {
  color: #1b1d22;
}

.writing-title-row h1 {
  font-weight: 720;
}

.writing-paper {
  color: #16181d;
  font-size: 17px;
  line-height: 2.05;
  caret-color: var(--blue);
}

.field-input,
.field-textarea {
  border-color: var(--line-strong);
}

.field-input:hover,
.field-textarea:hover {
  border-color: #c4cad3;
}

.field-textarea:focus,
.field-input:focus {
  border-color: #91ace5;
  box-shadow: 0 0 0 3px rgba(37, 99, 217, .055);
}

.selection-pill.active {
  border-color: #b3c7ed;
  background: #edf3fd;
  color: #234e9c;
}

/* AI identity is concentrated in the assistant, where it is useful. */
.assistant-panel {
  border-left-color: var(--line);
  background: #f8f9fb;
}

.assistant-tabs {
  border-bottom-color: var(--line);
  background: #fafbfc;
}

.assistant-tab.active {
  color: var(--text);
}

.assistant-tab.active::after {
  background: var(--black);
}

.assistant-body,
.assistant-sticky-controls,
.assistant-toolbox {
  background: #f8f9fb;
}

.assistant-body.reference-mode {
  background: #fff;
}

.assistant-resize-handle:hover::after,
.assistant-resize-handle:focus-visible::after,
body.assistant-resizing .assistant-resize-handle::after {
  background: #a6b4c9;
}

.assistant-intro h2,
.assistant-chapter-outline > header strong {
  color: var(--text);
}

.assistant-action:hover,
.assistant-more-tools summary:hover {
  color: var(--text);
}

.assistant-generation-action select {
  background: #edf3f4;
  color: #326a70;
}

.assistant-composer {
  border-color: #d4d9e1;
  background: #fff;
  box-shadow: 0 7px 20px rgba(31, 35, 41, .045);
}

.assistant-composer:focus-within {
  border-color: #9cb2df;
  box-shadow: 0 7px 20px rgba(31, 35, 41, .05), 0 0 0 3px rgba(37, 99, 217, .045);
}

.assistant-composer button,
.character-chat-entry,
.assistant-reopen {
  background: var(--black);
  color: #fff;
}

.assistant-composer button:hover,
.assistant-reopen:hover {
  background: #111318;
}

.assistant-composer .composer-voice {
  background: transparent;
  color: var(--muted);
}

.assistant-reopen {
  box-shadow: 0 8px 22px rgba(20, 24, 30, .18);
}

.assistant-reopen .icon { display: none; }

.assistant-reopen::before {
  content: "";
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  background: url("/static/brand/dashen-pixel-mark.png") center / contain no-repeat;
}

.chat-message.ai > strong {
  display: flex;
  align-items: center;
  gap: 6px;
}

.chat-message.ai > strong::before {
  content: "";
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  border-radius: 5px;
  background: url("/static/brand/dashen-pixel-mark.png") center / 21px 21px no-repeat;
  box-shadow: 0 1px 4px rgba(30, 47, 90, .08);
}

.chat-message.user {
  background: #e9edf3;
  color: var(--text);
}

.character-chat-thread .chat-message.ai {
  border-color: var(--line);
  box-shadow: 0 3px 12px rgba(31, 35, 41, .035);
}

.character-chat-thread .chat-message.user,
.story-chat-history .chat-message.user {
  background: #25282d;
  color: #fff;
}

.assistant-pending-message p::after {
  background: linear-gradient(90deg, var(--ai-cyan) 30%, transparent 30% 45%, var(--ai-cyan) 45% 70%, transparent 70% 85%, var(--ai-cyan) 85%);
}

.writing-reference-links button.active,
.writing-reference-document > header button,
.writing-reference-document > header .writing-reference-header-actions button {
  color: var(--blue-ink);
}

/* Dialogs and feedback stay neutral and predictable. */
.modal-backdrop {
  background: rgba(22, 25, 30, .3);
  backdrop-filter: blur(2px);
}

.modal {
  border-color: rgba(216, 220, 225, .95);
  box-shadow: var(--shadow-float);
}

.modal-choice:hover,
.modal-choice.active {
  border-color: #b5c6e8;
  background: #f0f4fb;
}

.popover {
  border-color: rgba(216, 220, 225, .95);
  box-shadow: 0 14px 34px rgba(24, 29, 35, .12);
}

.popover button:hover,
.popover button:focus-visible {
  background: #f3f4f6;
  color: var(--text);
}

.toast {
  background: rgba(24, 27, 32, .96);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .12);
}

.ui-state-loading .ui-state-indicator {
  background: var(--ai-cyan);
}

.toast[data-tone="success"] { background: rgba(29, 83, 61, .96); }
.toast[data-tone="error"] { background: rgba(137, 43, 43, .97); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}