/* Inter Tight 的 Latin 子集；中文沿用明确的系统字体回落。授权见 fonts/Inter-Tight-OFL.txt。 */
@font-face {
    font-family: 'Sylph Inter Tight';
    src: url('fonts/inter-tight-latin-variable.woff2') format('woff2');
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root[data-theme-style="prism"] {
    color-scheme: dark;
    --bg: #1b232b;
    --bg-card: #27323b;
    --bg-hover: rgba(255,255,255,.07);
    --text: #f3f4f6;
    --text-secondary: #c2cbd3;
    --text-muted: #a3afbb;
    --border: rgba(255,255,255,.08);
    --divider-rgb: 235,236,240;
    --accent: #ededf0;
    --accent-hover: #fff;
    --focus: #bfc3ce;
    --radius: 28px;
    --glass: rgba(19,29,38,.38);
    --glass-strong: rgba(25,36,47,.84);
    --card-bottom: #222d36;
    --control-top: rgba(255,255,255,.08);
    --control-bottom: rgba(255,255,255,.025);
    --control-hover-top: rgba(255,255,255,.13);
    --control-hover-bottom: rgba(255,255,255,.05);
    --control-pressed-top: #1c2730;
    --control-pressed-bottom: #24313b;
    --shadow: 0 2px 6px -2px #0003,0 12px 32px -14px #0006;
    --shadow-lg: 0 16px 40px -18px #0009;
    --press-shadow: inset 0 2px 5px #0006,inset 0 -1px #ffffff0c;
    --bookmark-face: transparent;
    --bookmark-hover-face: rgba(255,255,255,.055);
    --bookmark-pressed-face: rgba(255,255,255,.035);
    --bookmark-border: transparent;
    --bookmark-hover-border: rgba(255,255,255,.08);
    --bookmark-pressed-border: rgba(255,255,255,.12);
    --bookmark-idle-shadow: none;
    --bookmark-hover-shadow: inset 0 1px #ffffff09;
    --bookmark-press-shadow: var(--press-shadow);
    --bookmark-lift: 0px;
    --bookmark-press-depth: 1px;
    --bookmark-press-scale: .985;
    --bookmark-glow-opacity: 0;
    --glint: transparent;
    --search-glint: transparent;
    --glint-white: transparent;
    --mode-hue: 220,221,226;
    --engine-hue: 220,221,226;
    --submit-hue: 235,236,240;
    --admin-panel: var(--glass-strong);
    --admin-row: rgba(255,255,255,.025);
    --admin-row-hover: rgba(255,255,255,.045);
    --admin-input-top: rgba(0,0,0,.22);
    --admin-input-bottom: rgba(0,0,0,.12);
    --admin-active: rgba(255,255,255,.07);
    --admin-success: #a6d8bd;
    --admin-error: #ffb3ad;
    --admin-primary-text: #f3f4f6;
    --admin-inner-light: rgba(255,255,255,.075);
    --admin-inner-dark: rgba(0,0,0,.2);
    --admin-field-canvas: #27323b;
    --panel: var(--glass-strong);
    --input-top: #1c2730;
    --input-bottom: #24313b;
    --inner-light: rgba(255,255,255,.09);
    --inner-dark: rgba(0,0,0,.22);
    --code-string: #a6d8bd;
    --code-number: #e5be92;
    --code-title: #aac8f0;
    --code-attr: #d5afd6;
    --code-type: #d9cd9b;
    --code-deletion: #ffb3ad;
    --prism-reflection: linear-gradient(150deg,#ffffff20 0%,#ffffff0a 30%,#ffffff02 65%,#ffffff0c 100%);
    --prism-slab: radial-gradient(ellipse 80% 160% at 0% -70%,#e1f4ff14,transparent 72%),linear-gradient(130deg,#eef8ff08 0%,#ffffff00 42%,#a5dcf608 100%),rgba(255,255,255,.01);
    --prism-slab-shadow: inset 0 1px 1px #ffffff40,inset 1px 0 #ffffff14,inset 0 -1px 1px #0000002e,0 4px 8px -6px #0005,0 20px 44px -24px #0009;
    --prism-pill: linear-gradient(175deg,#ffffff26 0%,#ffffff0b 38%,#ffffff02 65%,#ffffff08 100%),rgba(18,29,39,.24);
    --prism-pill-shadow: inset 0 1px 1px #ffffff52,inset 1px 0 #ffffff1a,inset 0 -1px 1px #0004,0 4px 8px -5px #0005,0 14px 32px -20px #0008;
    --prism-edge: linear-gradient(115deg,#f5d477,#d89e77 27%,#c5a8df 62%,#74b6c6);
    --prism-ease: cubic-bezier(.22,1,.36,1);
}

:root[data-theme-style="prism"] body {
    font-family: 'Sylph Inter Tight','SF Pro Display','PingFang SC','Microsoft YaHei',sans-serif;
    /* 静态大范围环境光随文档延伸，长页面下半部仍保留青灰层次。
       这里刻意**不用** background-attachment: fixed：Windows 上固定背景
       会在每次滚动时重绘，实测棱镜滚动一次的 PictureLayer::Update 由
       164 升到 205（每帧多一次整屏背景），是经典主题没有的开销。
       背景随文档滚动后，顶部暖光留在首屏、底部冷光落在文档尾部，层次不变。 */
    background: radial-gradient(ellipse 72vw 70vh at 4% -10%,#c4a77d26,transparent 72%),radial-gradient(ellipse 75vw 85vh at 100% 12%,#76aebd29,transparent 74%),radial-gradient(ellipse 80vw 65vh at 44% 110%,#7d94bc1a,transparent 76%),linear-gradient(165deg,#252e36,var(--bg) 55%,#202b35);
    background-color: var(--bg);
    background-repeat: no-repeat;
}
:root[data-theme-style="prism"] :is(button,input,textarea,select) { font-family: inherit; }
:root[data-theme-style="prism"] ::selection { background: #ffffff30; color: #fff; }
:root[data-theme-style="prism"] :is(input,textarea) { caret-color: var(--text); }
:root[data-theme-style="prism"] * { scrollbar-color: #647584 #1b232b; scrollbar-width: thin; }

/* 将原背板让给内容卡片，保留布局计算与拖动的宿主。 */
:root[data-theme-style="prism"] .backboard { background: none; border: 0; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
:root[data-theme-style="prism"] :is(.backboard,.bookmark)::before,
:root[data-theme-style="prism"] :is(.backboard,.bookmark,.search)::after { display: none; }
:root[data-theme-style="prism"] .grid { gap: 20px; }
:root[data-theme-style="prism"] :is(.category,.module-widget) {
    border: 1px solid #ffffff0b;
    border-radius: 32px;
    background: var(--prism-slab);
    box-shadow: inset 0 1px 0 #ffffff12,inset 0 -1px 0 #bce6ff08,0 10px 28px -20px #0006;
    /* 分类板与模块板**不加 backdrop-filter**：页面底子是一层平滑的冷暖渐变，
       20px 模糊在上面几乎看不出来，但每张卡片在滚动时都要重新采样背景。
       实测棱镜滚动一次的 PictureLayer::Update：带卡片模糊 328、去掉后 205，
       再去掉固定背景才是与经典主题一致的 164。玻璃感由薄膜渐变、内侧受光与
       光学薄边承担，与「无背景模糊」「少透明」两条降级路径的结论相同。 */
    transition: border-color 200ms var(--prism-ease),box-shadow 200ms var(--prism-ease),margin-top 180ms var(--prism-ease);
}
:root[data-theme-style="prism"] .category { position: relative; padding: 20px 24px; }
:root[data-theme-style="prism"] :is(.category,.module-widget):hover { border-color: #ffffff14; box-shadow: inset 0 1px 0 #ffffff1a,inset 0 -1px 0 #bce6ff10,0 14px 32px -22px #0007; }
/* 掩膜只保留薄边，亮点沿曲面分布，不在文字上方叠加反光层。
   分类板与模块板用同一层材质——用户指认的「导航主体部分的各个模块尤其是各类的
   背景板」是同一个诉求，模块板若只拿到底色不拿薄边，页面上仍是两套卡片语言。
   模块板的包含块：两侧停靠时 .module-widget 本身是 absolute，窄屏 below 停靠
   时由 styles.css 那条规则给成 relative，两种停靠都有位置可依。 */
@supports (mask-composite: exclude) or (-webkit-mask-composite: xor) {
    :root[data-theme-style="prism"] :is(.category,.module-widget)::after {
        content: '';
        position: absolute;
        inset: -1px;
        padding: 1.5px;
        border-radius: inherit;
        pointer-events: none;
        background: radial-gradient(ellipse 65% 140% at 0% 0%,#ffffff90,transparent 68%),radial-gradient(ellipse 55% 130% at 100% 100%,#b8eaff68,transparent 70%),linear-gradient(125deg,#ffffff20,#ffffff03 40%,#d4f1ff14);
        -webkit-mask: linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
        mask: linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
        mask-composite: exclude;
        opacity: .5;
        transition: opacity 200ms var(--prism-ease);
    }
    :root[data-theme-style="prism"] :is(.category,.module-widget):hover::after { opacity: .8; }
}
:root[data-theme-style="prism"] .category-header { margin-bottom: 12px; padding-bottom: 0; background: none; border: 0; }
:root[data-theme-style="prism"] .category-title { font-size: 16px; font-weight: 600; letter-spacing: -.01em; color: var(--text); text-transform: none; line-height: 1.25; }
:root[data-theme-style="prism"] :is(.bookmark,.bookmark-text-only) {
    border-radius: 12px;
    --bookmark-face: linear-gradient(175deg,#ffffff24 0%,#ffffff0b 45%,#00000009 100%),rgba(20,31,41,.16);
    --bookmark-hover-face: linear-gradient(175deg,#ffffff32 0%,#ffffff13 45%,#ffffff04 100%),rgba(20,31,41,.22);
    --bookmark-pressed-face: linear-gradient(180deg,#00000020,#ffffff04),rgba(31,41,49,.45);
    --bookmark-border: rgba(255,255,255,.10);
    --bookmark-hover-border: rgba(255,255,255,.22);
    --bookmark-idle-shadow: inset 0 1px 1px #ffffff30,inset 0 -1px #0004,0 4px 8px -5px #0008;
    --bookmark-hover-shadow: inset 0 1px 1px #ffffff45,inset 0 -1px #0004,0 7px 14px -7px #0009;
    --bookmark-lift: -1px;
}

:root[data-theme-style="prism"] :is(.search,.search:hover,.search:focus-within) {
    min-height: 62px;
    padding: 8px;
    border: 1px solid #ffffff14;
    border-radius: 999px;
    background: var(--prism-pill);
    box-shadow: var(--prism-pill-shadow);
    backdrop-filter: blur(16px) saturate(150%);
    -webkit-backdrop-filter: blur(16px) saturate(150%);
}
:root[data-theme-style="prism"] .search::before { display: none; }
:root[data-theme-style="prism"] .home-theme-switcher { background: var(--prism-pill); box-shadow: var(--prism-pill-shadow); }
:root[data-theme-style="prism"] .home-theme-switcher button[aria-pressed="true"] { background: linear-gradient(175deg,#ffffff24,#ffffff08); box-shadow: inset 0 1px #ffffff30,0 3px 6px -4px #0006; }
:root[data-theme-style="prism"] .local-select-button { border-radius: 12px; background: var(--prism-pill); box-shadow: var(--prism-pill-shadow); }
:root[data-theme-style="prism"] .local-select-button:hover:not(:disabled) { background: linear-gradient(175deg,#ffffff30,#ffffff0b),rgba(18,29,39,.24); }
:root[data-theme-style="prism"] .local-select-button:active:not(:disabled) { box-shadow: var(--press-shadow); }


:root[data-theme-style="prism"] .search:focus-within { border-color: #ffffff50; }
:root[data-theme-style="prism"] .search.paste-mode { min-height: 128px; padding: 14px; border-radius: 24px; }
:root[data-theme-style="prism"] .search-caption { margin: 14px 0 32px; font-size: 12px; }
:root[data-theme-style="prism"] :is(.search-mode,.search-engine,.btn:not(.btn-danger),.special-line-iconbtn,.special-line-btn,.memo-card-manage) {
    border-color: #ffffff12;
    border-radius: 999px;
    background: var(--prism-pill);
    color: var(--text-secondary);
    box-shadow: var(--prism-pill-shadow);
    transition: background 180ms var(--prism-ease),border-color 180ms var(--prism-ease),transform 150ms var(--prism-ease),box-shadow 180ms var(--prism-ease);
}
:root[data-theme-style="prism"] :is(.search-mode,.search-engine,.search-btn)::before { display: none; }
:root[data-theme-style="prism"] :is(.search-mode,.search-engine,.btn:not(.btn-danger),.special-line-iconbtn,.special-line-btn,.memo-card-manage):hover:not(:disabled) { color: var(--text); border-color: #ffffff30; background: linear-gradient(180deg,#ffffff24,#ffffff09); transform: none; box-shadow: var(--prism-pill-shadow); }
:root[data-theme-style="prism"] :is(.search-btn,.search-btn:hover,.btn-primary,.btn-primary:hover:not(:disabled),.special-line-save,.special-line-save:hover,.special-line-btn--primary,.special-line-btn--primary:hover) {
    color: var(--text);
    border: 1px solid transparent;
    border-radius: 999px;
    background: linear-gradient(165deg,#34434d,#242f38) padding-box,var(--prism-edge) border-box;
    box-shadow: inset 0 1px #ffffff26,0 3px 8px -3px #0009;
}
:root[data-theme-style="prism"] :is(.search-btn:hover,.btn-primary:hover:not(:disabled),.special-line-save:hover,.special-line-btn--primary:hover) { background: linear-gradient(165deg,#42535f,#2d3b46) padding-box,var(--prism-edge) border-box; }
:root[data-theme-style="prism"] :is(.search-mode,.search-engine,.search-btn,.btn,.special-line-iconbtn,.special-line-btn):active:not(:disabled) { transform: translateY(1px) scale(.985); box-shadow: var(--press-shadow); }
:root[data-theme-style="prism"] :is(.engine-option:hover,.fav-item:hover,.fav-item.selected) { background: var(--bg-hover); }

:root[data-theme-style="prism"] :is(.engine-dropdown,.fav-dropdown,.help-content,.toast,.paste-result,.special-line-channel-menu) { background: var(--glass-strong); border-color: var(--border); box-shadow: inset 0 1px #ffffff12,var(--shadow-lg); backdrop-filter: blur(24px) saturate(150%); -webkit-backdrop-filter: blur(24px) saturate(150%); }
:root[data-theme-style="prism"] :is(.modal-content,.fav-dialog,.ui-dialog,.module-panel,.container) { background: var(--prism-reflection),var(--glass-strong); border-color: #ffffff18; border-radius: 28px; box-shadow: var(--prism-slab-shadow); backdrop-filter: blur(24px) saturate(160%); -webkit-backdrop-filter: blur(24px) saturate(160%); }
:root[data-theme-style="prism"] :is(.modal-backdrop,.help-overlay,.ui-dialog-overlay,.fav-dialog-overlay,.module-overlay) { background: #02030580; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
:root[data-theme-style="prism"] .modal-header { background: none; border-bottom: 1px solid var(--border); padding: 20px 26px; }
:root[data-theme-style="prism"] .modal-header h2 { font-size: 23px; font-weight: 600; letter-spacing: -.025em; }
:root[data-theme-style="prism"] .modal-body { padding: 24px 26px 30px; }
:root[data-theme-style="prism"] .admin-tabs { padding: 4px; gap: 6px; border: 0; background: transparent; }
:root[data-theme-style="prism"] .admin-tab { border-radius: 999px; font-size: 14px; color: var(--text-secondary); }
:root[data-theme-style="prism"] .admin-tab[aria-selected="true"] { background: var(--prism-pill); color: var(--text); box-shadow: var(--prism-pill-shadow); }
:root[data-theme-style="prism"] .setting-row { padding-top: 14px; padding-bottom: 14px; }
:root[data-theme-style="prism"] .setting-row label { font-size: 14px; }
/* 开关的「开」态：棱镜的 --accent 是**近白色**，而旋钮本身也是一层近白的薄膜，
   两者叠在一起旋钮就整个消失，开关只剩一块白板，状态无从分辨（经典浅色与深色
   主题的 accent 都比旋钮深或更深，没有这个问题）。
   棱镜下把「开」态翻过来：轨道是白色薄膜，旋钮是深色的挖空，且移到右侧——
   轨道亮度、旋钮位置与旋钮颜色三样都在说「开着」。 */
:root[data-theme-style="prism"] .modal .toggle-switch input:checked + .toggle-slider { border-color: #ffffffb3; background: linear-gradient(175deg,#ffffff33,#ffffff1a); }
:root[data-theme-style="prism"] .modal .toggle-switch input:checked + .toggle-slider::before { background: linear-gradient(165deg,#33404a,#1f2932); box-shadow: inset 0 1px #ffffff24,0 1px 2px #00000059; }
/* 备忘待办的勾选框是同一类问题：勾是 #fff，底色在棱镜下也是 --accent 的白，
   白勾压在白底上等于没打勾。棱镜里「选中」的控件一律是**白面 + 深色标记**
   （原生 checkbox 就是这么画的：accent 填白、勾自动取对比色），照它来。 */
:root[data-theme-style="prism"] .memo-todo-check:checked { border-color: #ffffff; background: linear-gradient(180deg, #ffffff, var(--accent)); }
:root[data-theme-style="prism"] .memo-todo-check-wrap::after { background: #1b232b; }
:root[data-theme-style="prism"] :is(.modal,.fav-dialog,.ui-dialog) :is(input,textarea,select):focus { border-color: var(--focus); box-shadow: none; outline: 2px solid var(--focus); outline-offset: 2px; }
:root[data-theme-style="prism"] :is(.modal,.fav-dialog,.ui-dialog) :is(input,textarea,select) { border-radius: 12px; }
:root[data-theme-style="prism"] :is(.memo-card,.memo-tabs)::before { display: none; }
:root[data-theme-style="prism"] .module-widget { padding: 18px; }
:root[data-theme-style="prism"] :is(.module-widget-title,.module-card-title,.special-line-title-text) { font-size: 14px; font-weight: 600; letter-spacing: -.015em; }
:root[data-theme-style="prism"] :is(.memo-tab[aria-selected="true"],.memo-panel-close) { background: var(--prism-pill); box-shadow: var(--prism-pill-shadow); }
:root[data-theme-style="prism"] :is(.memo-tabs,.memo-tab) { border-radius: 999px; }
:root[data-theme-style="prism"] .memo-row:hover { box-shadow: none; }
:root[data-theme-style="prism"] .memo-card .module-widget-head { background: none; border-bottom: 1px solid var(--border); }
:root[data-theme-style="prism"] :is(.local-settings-error,.local-navigation-feedback [data-state="error"]) { color: var(--admin-error); }
:root[data-theme-style="prism"] .site-footer { padding-top: 22px; margin-top: 30px; }
:root[data-theme-style="prism"] .site-footer-link { font-size: 13px; }
:root[data-theme-style="prism"] .site-footer-link:hover { color: var(--text); text-decoration: none; }
:root[data-theme-style="prism"] .module-metric-value { font-variant-numeric: tabular-nums; }
:root[data-theme-style="prism"] .container > .title { color: var(--text); font-size: 20px; font-weight: 600; letter-spacing: -.02em; }

@media (max-width: 600px) {
    :root[data-theme-style="prism"] .admin-tabs { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; overflow: visible; }
    :root[data-theme-style="prism"] .admin-tab { min-width: 0; padding: 0 8px; font-size: 13px; }
    :root[data-theme-style="prism"] .category { padding: 20px 18px 16px; border-radius: 28px; }
    :root[data-theme-style="prism"] .category-title { font-size: 15px; }
    :root[data-theme-style="prism"] .modal-body { padding: 18px 16px; }
    :root[data-theme-style="prism"] .modal-header { padding: 14px 16px; }
    :root[data-theme-style="prism"] .modal-header h2 { font-size: 20px; }
}
/* 「少透明」时（Windows 的「透明度效果」关闭、macOS 的「降低透明度」打开，Chrome
   118 起都会报这个偏好）：换成同一套设计的**哑光版**——底色不透明，上方的冷调色偏、
   150 度反射、光学薄边、圆角与投影全部照旧，只有「透过去」这一件事去掉。
   ⚠️ 此前这里是把面板直接换成一整块平涂的 --bg-card（#27323b）并去掉薄边，那正是
   v2.2.5 那种「死板生硬」的底板：Windows 上只要「透明度效果」是关的（不少机器
   默认如此，虚拟机与部分驱动也落在这类），整页就退成另一个主题，与 macOS 差得很远。
   做法是**改 token 而不是逐个改元素**——所有用到薄膜与胶囊的部件自动拿到哑光版。 */
@media (prefers-reduced-transparency: reduce) {
    :root[data-theme-style="prism"] {
        --prism-slab: radial-gradient(ellipse 80% 160% at 0% -70%,#e1f4ff14,transparent 72%),linear-gradient(130deg,#eef8ff08 0%,#ffffff00 42%,#a5dcf608 100%),#27323b;
        --prism-pill: linear-gradient(175deg,#ffffff26 0%,#ffffff0b 38%,#ffffff02 65%,#ffffff08 100%),#202b34;
        --glass-strong: #253039;
    }
    /* :is() 取参数里最高的特异性，:search:hover 是 0-2-0，与搜索框基础那条
       （:root[...]:is(.search,.search:hover,.search:focus-within)）同为 0-4-0，
       靠源码顺序取胜——少写这两个伪类变体的话，搜索框的模糊会留下来。 */
    :root[data-theme-style="prism"] :is(.category,.module-widget,.search,.search:hover,.search:focus-within,.modal-content,.fav-dialog,.ui-dialog,.module-panel,.container,.engine-dropdown,.fav-dropdown,.help-content,.toast) { backdrop-filter: none; -webkit-backdrop-filter: none; }
}
/* 浏览器没有背景模糊时**不要**退回不透明卡片：那正是 v2.2.5 那种死板厚重的底板，
   用户点名的就是它。分类板与模块板保留透明薄膜与光学薄边——页面底子是一层平滑的
   冷暖渐变，少一层模糊几乎看不出来；真正需要不透明底的是盖在任意内容上的浮层
   （弹窗、下拉、提示、分享页容器），它们失去模糊后必须换实底才读得清。
   ⚠️ 这一条在 Windows 上不是理论问题：Firefox 123 之前在「GPU 厂商识别不出来」
   的机器上不提供 backdrop-filter（bug 1868737），Windows 的虚拟机与部分驱动
   正落在这类机器上，于是整页退回旧样式。 */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    :root[data-theme-style="prism"] :is(.modal-content,.fav-dialog,.ui-dialog,.module-panel,.container,.engine-dropdown,.fav-dropdown,.help-content,.toast) { background: var(--bg-card); }
}

@media (prefers-reduced-motion: reduce) { :root[data-theme-style="prism"] :is(.category,.module-widget)::after { transition: none; } }