/* Base styles shared by all pages. Tailwind (CDN) provides utilities. */
@font-face { font-family: Inter; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/inter-latin-wght-normal.woff2) format('woff2-variations'); 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; }
@font-face { font-family: Inter; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/inter-latin-ext-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
html { -webkit-text-size-adjust: 100%; }
body { font-family: Inter, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
.fm-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 1rem; box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.04); }
.dark .fm-card { background: #111827; border-color: #1f2937; box-shadow: 0 1px 2px rgba(0,0,0,.4); }
.fm-input { width: 100%; border-radius: .75rem; border: 1px solid #d1d5db; background: #fff; padding: .65rem .85rem; font-size: .95rem; color: #111827; outline: none; transition: box-shadow .15s, border-color .15s; }
.fm-input:focus { border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99,102,241,.25); }
.dark .fm-input { background: #0b1220; border-color: #374151; color: #f3f4f6; }
.fm-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; border-radius: .75rem; padding: .65rem 1rem; font-weight: 600; font-size: .95rem; transition: background .15s, transform .05s; }
.fm-btn:active { transform: translateY(1px); }
.fm-btn-primary { background: #4f46e5; color: #fff; }
.fm-btn-primary:hover { background: #4338ca; }
.fm-btn-primary:disabled { opacity: .6; cursor: not-allowed; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* ---- File manager ---- */
.tb-btn { display: inline-flex; align-items: center; gap: .4rem; flex-shrink: 0; border-radius: .75rem; padding: .5rem .65rem; font-size: .85rem; font-weight: 500; color: #374151; transition: background .12s, opacity .12s; min-height: 2.5rem; }
.tb-btn:hover:not(:disabled) { background: #f3f4f6; }
.tb-btn:disabled { opacity: .35; cursor: not-allowed; }
.tb-btn.active { background: #eef2ff; color: #4338ca; }
.dark .tb-btn { color: #d1d5db; }
.dark .tb-btn:hover:not(:disabled) { background: #1f2937; }
.dark .tb-btn.active { background: #1e1b4b; color: #a5b4fc; }
.tb-sep { width: 1px; height: 1.4rem; margin: 0 .25rem; background: #e5e7eb; flex-shrink: 0; }
.dark .tb-sep { background: #374151; }
.tb-label { display: none; }
@media (min-width: 1700px) { .tb-label { display: inline; } }

.fm-item { position: relative; border-radius: .9rem; border: 1px solid transparent; cursor: default; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; transition: background .1s, border-color .1s; }
.fm-item:hover { background: #f3f4f6; }
.dark .fm-item:hover { background: #111827; }
.fm-item.selected { background: #eef2ff; border-color: #a5b4fc; }
.dark .fm-item.selected { background: #1e1b4b; border-color: #4338ca; }
.fm-item.cut { opacity: .45; }
.fm-check { position: absolute; top: .5rem; left: .5rem; width: 1.15rem; height: 1.15rem; accent-color: #4f46e5; opacity: 0; transition: opacity .1s; cursor: pointer; z-index: 2; }
.fm-item:hover .fm-check, .fm-item.selected .fm-check, .has-selection .fm-check { opacity: 1; }
@media (pointer: coarse) { .fm-check { opacity: 1; width: 1.4rem; height: 1.4rem; } }
.fm-table th { text-align: left; font-weight: 600; font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; color: #6b7280; padding: .5rem .75rem; border-bottom: 1px solid #e5e7eb; white-space: nowrap; cursor: pointer; user-select: none; position: sticky; top: -1rem; background: inherit; }
.dark .fm-table th { border-color: #1f2937; color: #9ca3af; }
.fm-table td { padding: .5rem .75rem; border-bottom: 1px solid #f3f4f6; white-space: nowrap; }
.dark .fm-table td { border-color: #111827; }
.fm-table tr.fm-item { display: table-row; border-radius: 0; }
.fm-table tr.fm-item.selected td { background: #eef2ff; }
.dark .fm-table tr.fm-item.selected td { background: #1e1b4b; }
.fm-table tr.fm-item:hover td { background: #f3f4f6; }
.dark .fm-table tr.fm-item:hover td { background: #111827; }
.fm-table tr.fm-item.selected:hover td { background: #e0e7ff; }
.ctx-item { display: flex; width: 100%; align-items: center; gap: .65rem; padding: .55rem .9rem; text-align: left; }
.ctx-item:hover:not(:disabled) { background: #f3f4f6; }
.dark .ctx-item:hover:not(:disabled) { background: #1f2937; }
.ctx-item:disabled { opacity: .4; cursor: not-allowed; }
.ctx-item.danger { color: #dc2626; }
.ctx-sep { margin: .35rem 0; border-top: 1px solid #e5e7eb; }
.dark .ctx-sep { border-color: #374151; }
.tree-row { display: flex; align-items: center; gap: .25rem; border-radius: .6rem; padding: .35rem .4rem; cursor: pointer; }
.tree-row:hover { background: #f3f4f6; }
.dark .tree-row:hover { background: #1f2937; }
.tree-row.active { background: #eef2ff; color: #4338ca; font-weight: 600; }
.dark .tree-row.active { background: #1e1b4b; color: #a5b4fc; }
.tree-toggle { display: inline-flex; width: 1.25rem; height: 1.25rem; align-items: center; justify-content: center; flex-shrink: 0; border-radius: .4rem; color: #9ca3af; }
.tree-toggle:hover { background: rgba(107,114,128,.2); }
.fm-thumb { object-fit: cover; width: 100%; height: 100%; border-radius: .6rem; background: #f3f4f6; }
.dark .fm-thumb { background: #1f2937; }

/* ---- Editor ---- */
.CodeMirror { height: 100%; font-family: ui-monospace, "Cascadia Code", "JetBrains Mono", Menlo, Consolas, "Liberation Mono", monospace; line-height: 1.55; }
.cm-s-eclipse.CodeMirror { background: #fff; }
.cm-s-eclipse .CodeMirror-gutters { background: #f9fafb; border-right: 1px solid #e5e7eb; }
.cm-searching { background: rgba(250, 204, 21, .45); border-radius: 2px; }
.CodeMirror-foldgutter-open, .CodeMirror-foldgutter-folded { cursor: pointer; }
.cm-s-material-darker .CodeMirror-activeline-background { background: rgba(255, 255, 255, .05); }
.cm-s-eclipse .CodeMirror-activeline-background { background: #f3f4f6; }
.editor-fs { padding: 0 !important; }