/* Kafedrum 2.5 — subjects, protected lecture photos and a distraction-free reader. */
:root { --primary: var(--accent); --primary-dark: var(--accent-2); --primary-soft: rgba(183,193,168,.1); --ink: var(--text); --line-strong: var(--line-2); --danger: var(--bad); --aqua: var(--good); --ease: ease; }
html, body { min-height: 100%; }
body { min-height: 100vh; overflow-x: hidden; }
.hidden { display: none !important; }
button { color: inherit; }
.auth-shortcuts { display: none; }
.webcheck-auth { box-shadow: 16px 16px 0 rgba(183,193,168,.04); }
.webcheck-auth .brand.big { margin-bottom: 4px; }
.webcheck-auth .stamp { margin: 10px 0 0; }
.webcheck-auth .form-error:empty { display: none; }
.seg .segment-control.is-active { background: var(--panel-2); color: var(--text); box-shadow: inset 0 -2px 0 var(--accent); }

.topbar { min-height: 50px; height: auto; padding-block: 7px; }
.sidebar-toggle-top { flex: none; font-size: 17px; }
.release-stamp { margin-left: 2px; }
.product-tabs { align-self: stretch; display: flex; margin-left: 18px; }
.nav-btn { padding: 0 14px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--muted); cursor: pointer; font: 10px var(--mono); letter-spacing: .14em; text-transform: uppercase; }
.nav-btn.active { border-color: var(--accent); color: var(--text); }
.nav-btn:disabled { opacity: .38; cursor: not-allowed; }
.service-state { min-height: 28px; padding: 4px 8px; border: 1px solid var(--line-2); border-radius: var(--radius); background: var(--bg); color: var(--muted); font: 9px var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.service-state i { width: 6px; height: 6px; }
.service-state.online i { background: var(--good); box-shadow: 0 0 7px var(--good); }
.service-state.offline i { background: var(--warn); }

.unified-layout { flex: 1; min-height: 0; display: grid; grid-template-columns: 320px minmax(0,1fr); }
.library-panel { min-width: 0; border-right: 1px solid var(--line); }
.library-panel .panel-head { min-height: 49px; }
.knowledge-head > div { display: flex; gap: 4px; }
.knowledge-head .icon-btn { min-width: 30px; }
.knowledge-base-list { flex: none; max-height: 210px; overflow: auto; padding: 7px 8px; border-bottom: 1px solid var(--line); }
.knowledge-base-item { width: 100%; min-height: 34px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 8px; border: 1px solid transparent; background: transparent; color: var(--muted); cursor: pointer; font: 10px var(--mono); letter-spacing: .04em; text-align: left; text-transform: uppercase; }
.knowledge-base-item span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.knowledge-base-item b { color: var(--text); font-weight: 500; }
.knowledge-base-item:hover { border-color: var(--line); color: var(--text); }
.knowledge-base-item.is-active { border-left: 2px solid var(--accent); background: var(--panel-2); color: var(--accent-2); }
.lectures-head { border-top: 0; }
.refresh-btn { font-size: 18px; }
.refresh-btn span { display: block; }
.refresh-btn.is-refreshing span { animation: refresh-spin .7s linear infinite; }
@keyframes refresh-spin { to { transform: rotate(360deg); } }
.queue-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; padding: 0; border-bottom: 1px solid var(--line); background: var(--line); }
.queue-summary span { display: flex; justify-content: space-between; padding: 8px 12px; border-radius: 0; background: var(--bg); color: var(--muted); font: 9px var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.queue-summary b { color: var(--text); }
.library-panel .lecture-list { flex: 1; margin: 0; padding: 6px 8px; }
.lecture-item { grid-template-columns: minmax(0,1fr) auto; margin: 2px 0; padding: 10px 8px 10px 42px; border: 1px solid transparent; border-left: 2px solid transparent; background: transparent; }
.lecture-item:hover { border-color: var(--line); border-left-color: var(--accent); background: var(--panel-2); }
.lecture-item::before { content: "AUDIO"; left: 7px; top: 10px; width: 28px; height: 31px; border: 1px solid var(--line-2); border-radius: 0; background: var(--bg); color: var(--muted); font: 6px var(--mono); letter-spacing: .02em; clip-path: polygon(0 0,100% 0,100% 76%,76% 100%,0 100%); }
.lecture-main strong { color: var(--text); font: 700 12px var(--display); }
.lecture-main small, .job-detail { color: var(--muted); font: 9px var(--mono); letter-spacing: .03em; }
.lecture-main:not(:disabled):hover strong { color: var(--accent-2); text-decoration: underline; }
.lecture-base-name { display: block; margin-top: 4px; color: var(--accent); font: 8px var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.job-status, .job-action { border-radius: 0 !important; font-family: var(--mono); text-transform: uppercase; letter-spacing: .06em; }
.job-action { min-height: 28px; border-color: var(--line-2) !important; background: var(--bg) !important; color: var(--muted) !important; }
.job-action:hover { color: var(--text) !important; border-color: var(--accent) !important; }
.lecture-base-picker { display: flex; align-items: center; gap: 7px; margin-top: 8px; color: var(--muted); font: 8px var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.lecture-base-picker select { min-width: 0; max-width: 175px; padding: 5px 22px 5px 6px; border: 1px solid var(--line); background: var(--bg); color: var(--muted); font: 9px var(--mono); }
.library-footer { flex: none; padding: 8px 10px 10px; border-top: 1px solid var(--line); }
.knowledge-info-button { width: 100%; padding: 5px; border: 0; background: transparent; color: var(--muted); cursor: pointer; font: 9px var(--mono); letter-spacing: .06em; text-align: left; text-transform: uppercase; }
.knowledge-info-button:hover { color: var(--accent-2); }
.rail-record { flex: none; margin: 7px 0 0; width: 100%; }
.sidebar-collapsed .unified-layout { grid-template-columns: minmax(0,1fr); }
.sidebar-collapsed .library-panel { display: none; }
.empty-state { color: var(--muted); }
.empty-state strong { color: var(--text); }
.empty-state p { color: var(--muted); }
.empty-orbit { border-radius: 0; background: var(--line); color: var(--accent); }

.study-workbench { min-width: 0; overflow: auto; padding: clamp(24px,4vw,58px); background: radial-gradient(850px 460px at 80% -15%, rgba(183,193,168,.08), transparent 68%), var(--bg); }
.workspace-header { max-width: 1080px; display: flex; align-items: end; justify-content: space-between; gap: 34px; padding-bottom: 34px; border-bottom: 1px solid var(--line); }
.workspace-header h1 { max-width: 720px; margin: 12px 0 10px; color: var(--text); font: 800 clamp(34px,5vw,64px)/.98 var(--display); letter-spacing: -.055em; text-transform: uppercase; text-shadow: 4px 0 0 rgba(183,193,168,.12); }
.workspace-header p:not(.stamp) { max-width: 720px; margin: 0; color: var(--muted); line-height: 1.65; }
.record-cta { min-height: 46px; flex: none; }
.record-dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.system-grid { max-width: 1080px; display: grid; grid-template-columns: repeat(3,1fr); margin-top: 34px; border: 1px solid var(--line-2); }
.system-grid article { min-height: 190px; display: flex; flex-direction: column; padding: 24px; background: var(--panel); }
.system-grid article + article { border-left: 1px solid var(--line-2); }
.system-grid strong { margin-top: auto; color: var(--text); font-size: 18px; text-transform: uppercase; }
.system-grid p { margin: 9px 0 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.tile-label { color: var(--muted); font: 9px var(--mono); letter-spacing: .16em; text-transform: uppercase; }
.workspace-note { max-width: 1080px; margin-top: 28px; padding: 28px; border: 1px solid var(--line); border-left: 3px solid var(--accent); background: repeating-linear-gradient(135deg,transparent 0 20px,rgba(183,193,168,.015) 20px 21px),var(--panel); }
.workspace-note h2 { margin: 10px 0 6px; color: var(--text); font: 800 clamp(20px,3vw,30px) var(--display); text-transform: uppercase; }
.workspace-note p { max-width: 750px; margin: 0; color: var(--muted); }
.notice { margin: 0 0 22px; padding: 12px; border: 1px solid rgba(200,161,47,.45); border-radius: 0; background: rgba(200,161,47,.08); color: #dac778; }
.notice > i { border-radius: 0; background: rgba(200,161,47,.16); }
.notice span { color: var(--muted); }

.button { min-height: 38px; padding: 7px 14px; border: 1px solid var(--line-2); border-radius: var(--radius); background: var(--bg); color: var(--text); box-shadow: none; font: 500 11px var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.button.primary { border-color: var(--accent); background: var(--accent); color: var(--bg); box-shadow: none; }
.button.quiet { border-color: var(--line-2); background: var(--bg); color: var(--muted); }
.button.danger { border-color: var(--bad); background: var(--bad); color: #fff; }
.button:hover:not(:disabled) { border-color: var(--accent); color: var(--accent-2); }
.button.primary:hover:not(:disabled) { background: var(--accent-2); color: var(--bg); }

.record-dialog { width: min(960px,calc(100% - 28px)); max-width: none; max-height: min(94vh,1000px); padding: 0; overflow: hidden; border: 1px solid var(--line-2); border-radius: var(--radius); background: var(--panel); color: var(--text); box-shadow: 18px 18px 0 rgba(0,0,0,.55); }
.record-dialog::backdrop, .result-dialog::backdrop, .confirm-dialog::backdrop { background: rgba(0,0,0,.78); backdrop-filter: blur(4px); }
.record-dialog[open] { display: block; }
.record-dialog-shell { max-height: min(94vh,1000px); overflow: auto; }
.record-dialog-head { position: sticky; top: 0; z-index: 9; display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; border-bottom: 1px solid var(--line); background: var(--bg); }
.record-dialog-head h2 { margin: 4px 0 0; color: var(--text); font: 800 24px var(--display); text-transform: uppercase; }
.dialog-close { font-size: 22px; }
.record-dialog .capture-card { overflow: visible; border: 0; border-radius: 0; background: var(--panel); box-shadow: none; color: var(--text); }
.capture-head { border-bottom-color: var(--line); }
.capture-head h3 { margin: 5px 0 0; color: var(--text); font: 800 18px var(--display); text-transform: uppercase; }
.state-pill { border-radius: 0; background: var(--bg); color: var(--muted); font-family: var(--mono); }
.segmented { border-color: var(--line); border-radius: 0; background: var(--bg); }
.segment-control { color: var(--muted); }
.segment-control.is-active { background: var(--panel-2); color: var(--text); box-shadow: inset 0 -2px 0 var(--accent); }
.consent-row { border-color: var(--line); border-radius: 0; background: var(--bg); }
.consent-row b { color: var(--text); }
.consent-row small { color: var(--muted); }
.consent-row input { accent-color: var(--accent); }
.recorder-stage { border-radius: 0; background: radial-gradient(circle at 50% 25%,rgba(183,193,168,.12),transparent 42%),#050605; }
.record-button { background: var(--bad); border-color: var(--text); box-shadow: 0 0 0 6px rgba(201,207,193,.08); }
.record-button.is-paused { background: var(--accent); }
.timer { color: var(--text); font-family: var(--mono); }
.timer-kicker, .record-status-line, .record-core p, .energy-note { color: var(--muted); }
.signal-line i { background: var(--accent); }
.marker-panel, .selected-file, .context-details { border-color: var(--line); border-radius: 0; background: var(--bg); }
.marker-buttons button { border-color: var(--line-2); border-radius: 0; background: var(--panel); color: var(--text); }
.marker-buttons button:hover { border-color: var(--accent); }
.selected-file strong, .context-details summary b { color: var(--text); }
.selected-file div span, .context-details summary small { color: var(--muted); }
.lecture-form label { color: var(--muted); font: 10px var(--mono); letter-spacing: .1em; text-transform: uppercase; }
.lecture-form input, .lecture-form select, .lecture-form textarea { border-color: var(--line); border-radius: 0; background: var(--bg); color: var(--text); }
.context-body { border-top-color: var(--line); }
.photo-picker { border-color: var(--line-2); border-radius: 0; background: var(--panel); color: var(--accent); }
.photo-picker small { color: var(--muted); }
.photo-previews img { border-color: var(--line); border-radius: 0; }
.audio-dropzone { min-height: 150px; border-color: var(--line-2); border-radius: 0; background: var(--bg); }
.audio-dropzone strong { color: var(--text); }
.audio-dropzone span, .audio-dropzone small { color: var(--muted); }
.form-error { border-radius: 0; }
.form-error:empty { display: none; }

.result-dialog { border-color: var(--line-2); border-radius: var(--radius); background: var(--bg); color: var(--text); }
.result-dialog .dialog-head, .result-tabs, .dialog-actions { border-color: var(--line); background: var(--bg); }
.result-dialog h2, .result-dialog h3, .result-dialog h4, .result-dialog h5, .result-dialog strong { color: var(--text); }
.result-dialog p, .result-dialog li, .result-dialog small { color: var(--muted); }
.result-dialog .dialog-head { gap: 12px; }
.reader-controls { display: flex; align-items: center; gap: 5px; margin-left: auto; }
.reader-controls .icon-btn { width: auto; min-width: 34px; padding-inline: 7px; font: 10px var(--mono); }
.reader-controls span { min-width: 42px; color: var(--muted); font: 9px var(--mono); text-align: center; }
.result-tab { color: var(--muted); }
.result-tab.is-active { border-color: var(--accent); color: var(--text); }
.result-scroll { background: var(--bg); }
.result-pane { zoom: var(--reader-zoom,1); }
.study-chapter, .learning-map, .lecture-intro, .review-section, .supplementary-section, .usage-card, .source-details, .reference-details, .lecture-photos { border-color: var(--line) !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
.lecture-intro, .study-chapter, .learning-map, .review-section, .supplementary-section, .lecture-photos { border-left-color: var(--line-2) !important; }
.formula, .chapter-takeaway { border-radius: 0 !important; background: var(--panel-2) !important; color: var(--text) !important; }
.timecode { border-radius: 0 !important; background: var(--line) !important; color: var(--accent-2) !important; }
.export-picker select { border-color: var(--line); border-radius: 0; background: var(--panel); color: var(--text); }
.confirm-dialog { border-color: var(--line-2); border-radius: 0; background: var(--panel); color: var(--text); }
.confirm-dialog p { color: var(--muted); }
.dialog-mini-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 16px; }
.dialog-mini-head h2 { margin: 4px 0 0; }
.knowledge-dialog { width: min(520px,calc(100% - 28px)); }
.knowledge-dialog form { display: grid; gap: 14px; }
.knowledge-dialog label { display: grid; gap: 7px; color: var(--muted); font: 10px var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.knowledge-dialog input, .knowledge-dialog textarea { width: 100%; padding: 11px 12px; border: 1px solid var(--line); background: var(--bg); color: var(--text); font: 14px var(--display); }
.knowledge-dialog textarea { min-height: 82px; resize: vertical; }
.knowledge-info-dialog { width: min(600px,calc(100% - 28px)); }
.knowledge-info-dialog ol { display: grid; gap: 8px; padding-left: 22px; color: var(--muted); }
.lecture-photos { margin-top: 24px; padding: 22px; border: 1px solid var(--line); }
.lecture-photos-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; }
.lecture-photos-head h3 { margin: 5px 0 0; }
.lecture-photos-head > span { color: var(--muted); font: 9px var(--mono); }
.lecture-photo-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin-top: 16px; }
.lecture-photo-card { min-height: 180px; padding: 0; overflow: hidden; border: 1px solid var(--line-2); background: var(--panel); cursor: zoom-in; }
.lecture-photo-card img { width: 100%; height: 100%; min-height: 180px; max-height: 420px; display: block; object-fit: contain; background: var(--bg); }
.photo-loader { min-height: 180px; display: grid; place-content: center; gap: 5px; color: var(--muted); font: 10px var(--mono); text-transform: uppercase; }
.photo-loader small { font-size: 8px; }
.source-note { margin: 12px 0; padding: 10px; border-left: 2px solid var(--warn); }
.photo-dialog { width: min(96vw,1400px); height: min(94dvh,1000px); padding: 42px 12px 12px; overflow: auto; border: 1px solid var(--line-2); background: var(--bg); }
.photo-dialog::backdrop { background: rgba(0,0,0,.92); }
.photo-dialog[open] { display: grid; place-items: center; }
.photo-dialog .icon-btn { position: fixed; top: max(12px,env(safe-area-inset-top)); right: max(12px,env(safe-area-inset-right)); z-index: 2; background: var(--bg); }
.photo-dialog img { max-width: 100%; height: auto; display: block; }

@media (max-width: 850px) {
  .topbar { gap: 8px; padding: 7px 10px; }
  .release-stamp, .product-tabs, .service-state > span, .user > span:last-child { display: none; }
  .service-state { width: 24px; padding: 0; justify-content: center; border: 0; background: transparent; }
  .unified-layout { display: flex; flex-direction: column-reverse; overflow: auto; }
  .library-panel { min-height: 46vh; overflow: visible; border-top: 1px solid var(--line); border-right: 0; }
  .library-panel .lecture-list { overflow: visible; }
  .study-workbench { overflow: visible; padding: 28px 16px; }
  .workspace-header { align-items: stretch; flex-direction: column; }
  .record-cta { width: 100%; justify-content: center; }
  .system-grid { grid-template-columns: 1fr; }
  .system-grid article { min-height: 135px; }
  .system-grid article + article { border-top: 1px solid var(--line-2); border-left: 0; }
  .record-dialog { width: 100%; height: 100dvh; max-height: none; margin: 0; border: 0; }
  .record-dialog-shell { max-height: 100dvh; padding-bottom: env(safe-area-inset-bottom); }
  .record-dialog-head { padding-top: calc(14px + env(safe-area-inset-top)); }
  .field-grid { grid-template-columns: 1fr; }
  .marker-buttons { grid-template-columns: repeat(2,1fr); }
  .photo-previews { grid-template-columns: repeat(3,1fr); }
  .result-dialog { width: 100%; height: 100dvh; max-height: none; border: 0; border-radius: 0; }
  .reader-controls { order: 3; width: 100%; justify-content: flex-end; }
  .result-dialog .dialog-head { flex-wrap: wrap; }
  .dialog-actions { align-items: stretch; }
}

@media (max-width: 520px) {
  .workspace-header h1 { font-size: 36px; }
  .system-grid article { padding: 18px; }
  .record-dialog .capture-head, .record-dialog .source-switch, .record-dialog .consent-before-record, .record-dialog .selected-file, .record-dialog .lecture-form { margin-left: 14px; margin-right: 14px; }
  .record-dialog .source-area { padding-left: 14px; padding-right: 14px; }
  .result-tabs { overflow-x: auto; }
  .result-tab { min-width: max-content; }
  .dialog-actions { display: grid; grid-template-columns: 1fr; }
  .dialog-actions .button, .dialog-actions .export-picker { width: 100%; }
  .lecture-photo-grid { grid-template-columns: 1fr; }
}

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

/* ── Kafedrum 2.6 / Quiet Cinema ─────────────────────────────────────────── */
:root {
  --bg: #080a09;
  --panel: #0d100f;
  --panel-2: #131715;
  --line: rgba(209,218,198,.10);
  --line-2: rgba(209,218,198,.19);
  --text: #e1e6da;
  --muted: #899187;
  --accent: #c4ceb5;
  --accent-2: #e0e7d5;
  --good: #91ad79;
  --warn: #c0a56e;
  --bad: #c35745;
  --radius: 7px;
  --ease: cubic-bezier(.22,1,.36,1);
  --display: "Avenir Next", "Segoe UI Variable Display", "Helvetica Neue", Arial, sans-serif;
}
body { background: #080a09; font-size: 14px; }

.topbar {
  position: relative; z-index: 40; height: 66px; display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr);
  align-items: center; gap: 22px; padding: 0 clamp(16px,2vw,32px); border-bottom: 1px solid var(--line);
  background: rgba(8,10,9,.92); backdrop-filter: blur(18px) saturate(125%);
}
.topbar-cluster { min-width: 0; display: flex; align-items: center; gap: 12px; }
.topbar-start { justify-content: flex-start; }
.topbar-end { justify-content: flex-end; }
.topbar .brand { gap: 9px; font-size: 15px; letter-spacing: -.015em; text-transform: uppercase; }
.topbar .logo { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.45); background: linear-gradient(145deg,#e2e8d9,#aeb9a2); color: #0a0d0b; box-shadow: 0 5px 20px rgba(0,0,0,.28); }
.release-stamp { color: #70786f; font-size: 8px; white-space: nowrap; }
.product-tabs { height: 66px; align-self: center; margin: 0; justify-self: center; }
.nav-btn { position: relative; min-width: 104px; padding: 0 18px; border: 0; color: #667066; font-size: 9px; transition: color .25s var(--ease); }
.nav-btn::after { content: ""; position: absolute; right: 18px; bottom: 0; left: 18px; height: 1px; background: var(--accent); transform: scaleX(0); transition: transform .35s var(--ease); }
.nav-btn.active { border: 0; color: var(--accent-2); }
.nav-btn.active::after { transform: scaleX(1); }
.sidebar-toggle-top { width: 34px; height: 34px; border-color: transparent; color: #9aa296; transition: background .25s, color .25s, transform .35s var(--ease); }
.sidebar-toggle-top:hover { background: var(--panel-2); color: var(--text); transform: rotate(2deg); }
.service-state { min-height: 30px; padding: 0 10px; border-color: var(--line); border-radius: 5px; background: rgba(255,255,255,.018); }
.user { gap: 8px; }
.avatar { border-radius: 4px; background: linear-gradient(145deg,#e3e8db,#aab5a0); color: #0a0d0b; }

.unified-layout { grid-template-columns: 292px minmax(0,1fr); transition: grid-template-columns .55s var(--ease); }
.library-panel { position: relative; z-index: 20; min-height: 0; overflow: hidden; border-right-color: var(--line); background: linear-gradient(180deg,rgba(18,22,19,.98),rgba(10,12,11,.98)); transition: opacity .35s var(--ease); }
.knowledge-head { min-height: 64px !important; padding: 0 16px; border-bottom-color: var(--line); }
.knowledge-head > div { align-items: center; }
.panel-index { color: var(--accent); font: 8px var(--mono); }
.sidebar-caption { margin: 0; padding: 18px 18px 10px; color: #747c73; font-size: 11px; line-height: 1.55; }
.knowledge-base-list { max-height: none; flex: 1; padding: 8px 10px 14px; border-bottom: 0; }
.knowledge-base-item { min-height: 46px; grid-template-columns: 26px minmax(0,1fr) auto; display: grid; gap: 8px; padding: 8px 10px; border-radius: 5px; transition: color .25s, background .25s, transform .25s var(--ease); }
.knowledge-base-item i { color: #626b62; font: normal 8px var(--mono); }
.knowledge-base-item b { min-width: 22px; height: 22px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: #899287; font-size: 8px; }
.knowledge-base-item:hover { border-color: transparent; background: rgba(255,255,255,.035); transform: translateX(2px); }
.knowledge-base-item.is-active { border: 0; background: linear-gradient(90deg,rgba(196,206,181,.12),rgba(196,206,181,.025)); color: var(--text); box-shadow: inset 2px 0 var(--accent); }
.knowledge-base-item.is-active i, .knowledge-base-item.is-active b { color: var(--accent-2); }
.sidebar-queue { padding: 15px 12px; border-top: 1px solid var(--line); }
.sidebar-queue > .tile-label { display: block; margin: 0 4px 10px; font-size: 7px; }
.queue-summary { border: 1px solid var(--line); border-radius: 5px; overflow: hidden; }
.queue-summary span { padding: 9px; background: rgba(255,255,255,.018); font-size: 7px; }
.library-footer { padding: 12px; background: rgba(0,0,0,.16); }
.knowledge-info-button { padding: 8px 4px; font-size: 8px; transition: color .2s; }
.rail-record { min-height: 42px; border-radius: 5px; transition: transform .25s var(--ease), box-shadow .25s var(--ease), background .25s; }
.rail-record:hover { transform: translateY(-2px); box-shadow: 0 12px 35px rgba(0,0,0,.32); }

.sidebar-collapsed .unified-layout { grid-template-columns: 72px minmax(0,1fr); }
.sidebar-collapsed .library-panel { display: flex; width: 72px; }
.sidebar-collapsed .study-workbench { padding-left: 292px; }
.sidebar-collapsed .knowledge-head { justify-content: center; padding: 0; }
.sidebar-collapsed .knowledge-head > div:first-child h2,
.sidebar-collapsed .knowledge-head > div:last-child #add-knowledge-base,
.sidebar-collapsed .sidebar-caption,
.sidebar-collapsed .knowledge-base-list,
.sidebar-collapsed .sidebar-queue,
.sidebar-collapsed .knowledge-info-button { display: none; }
.sidebar-collapsed .knowledge-head > div:last-child { position: absolute; top: 74px; }
.sidebar-collapsed #toggle-sidebar { transform: rotate(180deg); }
.sidebar-collapsed .library-footer { margin-top: auto; width: 100%; padding: 10px; }
.sidebar-collapsed .rail-record { width: 48px; min-width: 48px; height: 48px; margin: 0 auto; padding: 0; font-size: 0; border-radius: 50%; }
.sidebar-collapsed .rail-record span { font-size: 11px; }

.study-workbench { position: relative; padding: clamp(36px,5vw,76px); background: #080a09; transition: padding-left .55s var(--ease); }
.workspace-shell { position: relative; z-index: 2; width: min(1180px,100%); margin: 0 auto; }
.ambient { position: fixed; z-index: 0; pointer-events: none; border-radius: 50%; filter: blur(1px); opacity: .7; }
.ambient-a { top: 4%; right: -10%; width: min(680px,50vw); height: min(680px,50vw); background: radial-gradient(circle,rgba(159,176,142,.08),transparent 67%); }
.ambient-b { bottom: -28%; left: 22%; width: 620px; height: 620px; background: radial-gradient(circle,rgba(137,112,78,.045),transparent 68%); }
.workspace-view { width: 100%; }
.view-enter { animation: view-enter .65s var(--ease) both; }
@keyframes view-enter { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
[data-reveal] { opacity: 0; transform: translateY(18px); transition: opacity .65s var(--ease) var(--reveal-delay,0ms), transform .65s var(--ease) var(--reveal-delay,0ms); }
[data-reveal].is-revealed { opacity: 1; transform: none; }

.hero-composition { max-width: none; min-height: 390px; display: grid; grid-template-columns: minmax(0,1fr) 230px; align-items: center; gap: clamp(40px,7vw,100px); padding: 32px 0 62px; }
.workspace-header h1 { max-width: 860px; margin: 17px 0 22px; font-size: clamp(48px,6.2vw,88px); line-height: .91; letter-spacing: -.068em; text-transform: none; text-shadow: none; }
.workspace-header h1 em { color: #98a48f; font-family: Georgia,"Times New Roman",serif; font-weight: 400; letter-spacing: -.055em; }
.workspace-header p:not(.stamp) { max-width: 660px; color: #929a90; font-size: clamp(14px,1.3vw,17px); line-height: 1.7; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.record-cta, .hero-secondary { min-height: 46px; padding-inline: 20px; border-radius: 5px; }
.hero-secondary { background: rgba(255,255,255,.02); }
.hero-orbit { aspect-ratio: 1; display: grid; place-content: center; justify-items: center; border: 1px solid var(--line); border-radius: 50%; background: radial-gradient(circle,rgba(196,206,181,.07),transparent 62%); box-shadow: inset 0 0 60px rgba(196,206,181,.025),0 35px 80px rgba(0,0,0,.24); }
.hero-orbit::before, .hero-orbit::after { content: ""; position: absolute; width: 7px; height: 7px; border: 1px solid #788273; border-radius: 50%; background: var(--bg); }
.hero-orbit::before { transform: translate(-86px,-72px); }
.hero-orbit::after { transform: translate(91px,63px); }
.hero-orbit span, .hero-orbit small { color: #717970; font: 7px var(--mono); letter-spacing: .22em; }
.hero-orbit strong { margin: 7px 0 3px; color: var(--text); font: 300 54px/1 var(--display); letter-spacing: -.08em; }

.subjects-section { padding: 48px 0 64px; border-top: 1px solid var(--line); }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.section-heading h2 { margin: 7px 0 0; color: var(--text); font: 650 clamp(27px,3vw,40px)/1 var(--display); letter-spacing: -.045em; }
.section-heading > p { max-width: 330px; margin: 0; color: #737c73; font-size: 12px; text-align: right; }
.subject-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.subject-card { position: relative; min-width: 0; height: 220px; display: grid; grid-template-columns: 32px minmax(0,1fr) auto; align-items: end; gap: 14px; padding: 22px; overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: linear-gradient(145deg,rgba(255,255,255,.036),rgba(255,255,255,.012)); color: var(--text); text-align: left; isolation: isolate; transition: transform .42s var(--ease), border-color .35s, box-shadow .42s var(--ease); }
.subject-card::before { content: ""; position: absolute; z-index: -1; inset: -50% -20% 45% 35%; border-radius: 50%; background: radial-gradient(circle,var(--subject-glow,rgba(171,185,157,.13)),transparent 66%); transition: transform .55s var(--ease),opacity .35s; }
.subject-card.tone-1 { --subject-glow: rgba(155,145,117,.13); }
.subject-card.tone-2 { --subject-glow: rgba(116,143,133,.13); }
.subject-card.tone-3 { --subject-glow: rgba(145,125,134,.11); }
.subject-card:hover { z-index: 2; transform: translateY(-6px); border-color: rgba(207,218,195,.28); box-shadow: 0 28px 65px rgba(0,0,0,.28); }
.subject-card:hover::before { transform: translate(-3%,8%) scale(1.08); }
.subject-card-index { align-self: start; color: #697269; font: 8px var(--mono); }
.subject-card-copy { min-width: 0; display: grid; gap: 8px; }
.subject-card-copy small { color: #7d867c; font: 8px var(--mono); letter-spacing: .10em; text-transform: uppercase; }
.subject-card-copy strong { overflow: hidden; display: -webkit-box; color: var(--text); font: 600 22px/1.08 var(--display); letter-spacing: -.035em; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.subject-card-copy em { overflow: hidden; color: #838b82; font: normal 11px/1.4 var(--display); text-overflow: ellipsis; white-space: nowrap; }
.subject-card-arrow { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: #7c857a; transition: transform .35s var(--ease),background .35s,color .35s; }
.subject-card:hover .subject-card-arrow { transform: rotate(45deg); background: var(--accent); color: var(--bg); }
.subjects-empty { grid-column: 1/-1; min-height: 190px; display: grid; place-content: center; justify-items: center; gap: 18px; border: 1px dashed var(--line-2); color: var(--muted); }

.system-grid { max-width: none; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; margin-top: 0; border-color: var(--line); background: var(--line); }
.system-grid article { min-height: 190px; padding: 26px; border: 0 !important; background: linear-gradient(180deg,#101311,#0d100e); transition: background .35s; }
.system-grid article:hover { background: #141815; }
.system-grid strong { font-size: 17px; letter-spacing: -.015em; text-transform: none; }
.workspace-note { max-width: none; margin-top: 18px; padding: 34px; border: 1px solid var(--line); border-left: 1px solid var(--line); border-radius: 7px; background: linear-gradient(120deg,rgba(196,206,181,.055),rgba(255,255,255,.012)); }
.workspace-note h2 { max-width: 780px; font-size: clamp(25px,3vw,40px); letter-spacing: -.045em; text-transform: none; }

.breadcrumb-button { display: inline-flex; align-items: center; gap: 9px; padding: 8px 0; border: 0; background: transparent; color: #7f887e; font: 9px var(--mono); letter-spacing: .13em; text-transform: uppercase; transition: color .2s,transform .25s var(--ease); }
.breadcrumb-button:hover { color: var(--accent-2); transform: translateX(-3px); }
.subject-hero { min-height: 290px; display: flex; align-items: end; justify-content: space-between; gap: 32px; padding: 50px 0 38px; border-bottom: 1px solid var(--line); }
.subject-hero h1 { max-width: 14ch; margin: 12px 0; color: var(--text); font: 600 clamp(44px,6vw,76px)/.94 var(--display); letter-spacing: -.065em; }
.subject-hero p { max-width: 570px; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.65; }
.subject-stats { display: grid; grid-template-columns: repeat(3,minmax(0,220px)); gap: 1px; margin: 18px 0 58px; background: var(--line); }
.subject-stats article { min-height: 92px; display: flex; flex-direction: column; justify-content: space-between; padding: 16px 18px; background: var(--panel); }
.subject-stats span { color: #737b72; font: 7px var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.subject-stats strong { color: var(--text); font: 350 28px/1 var(--display); }
.materials-section { padding-bottom: 70px; }
.materials-tools { display: flex; align-items: center; gap: 10px; }
.materials-tools .count { color: #747d73; font: 10px var(--mono); }
.material-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(280px,340px)); justify-content: start; align-items: start; gap: 16px; margin: 0; padding: 0; overflow: visible; }
.material-card { position: relative; width: 100%; height: 300px; display: flex; flex-direction: column; gap: 0; margin: 0; padding: 0; overflow: visible; border: 1px solid var(--line); border-radius: 7px; background: linear-gradient(160deg,rgba(255,255,255,.036),rgba(255,255,255,.012)); transition: transform .38s var(--ease),border-color .3s,box-shadow .38s var(--ease); }
.material-card::before { display: none; }
.material-card:hover { transform: translateY(-5px); border-color: rgba(207,218,195,.25); background: linear-gradient(160deg,rgba(255,255,255,.048),rgba(255,255,255,.014)); box-shadow: 0 24px 55px rgba(0,0,0,.24); }
.material-card-head { min-height: 54px; display: flex; align-items: center; justify-content: space-between; padding: 0 18px; border-bottom: 1px solid var(--line); }
.material-kind { color: #687168; font: 7px var(--mono); letter-spacing: .15em; }
.material-card .lecture-main { min-height: 112px; padding: 20px 18px 14px; text-align: left; }
.material-card .lecture-main strong { display: -webkit-box; overflow: hidden; color: var(--text); font: 600 21px/1.12 var(--display); letter-spacing: -.035em; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.material-card .lecture-main small { display: block; margin-top: 10px; color: #788077; font: 8px var(--mono); }
.material-card .job-detail { min-height: 70px; align-content: start; padding: 0 18px; color: #7f887e; font-size: 9px; }
.material-card-footer { position: relative; min-height: 62px; display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding: 11px 14px 11px 18px; border-top: 1px solid var(--line); }
.material-open { display: inline-flex; align-items: center; gap: 8px; padding: 8px 10px; border: 0; background: transparent; color: var(--accent-2); font: 8px var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.material-open span { transition: transform .3s var(--ease); }
.material-open:hover span { transform: translate(3px,-3px); }
.material-wait { color: var(--muted); font: 9px var(--mono); }
.material-menu { position: relative; }
.material-menu summary { width: 32px; height: 32px; display: grid; place-items: center; list-style: none; border: 1px solid transparent; border-radius: 50%; color: #747c73; cursor: pointer; font: 10px var(--mono); }
.material-menu summary::-webkit-details-marker { display: none; }
.material-menu summary:hover { border-color: var(--line); color: var(--text); }
.material-menu > div { position: absolute; z-index: 30; bottom: 40px; left: 0; width: 230px; padding: 12px; border: 1px solid var(--line-2); border-radius: 6px; background: #111411; box-shadow: 0 18px 48px rgba(0,0,0,.5); }
.material-menu:not([open]) > div { display: none; }
.material-menu .lecture-base-picker { display: grid; gap: 7px; margin: 0; }
.material-menu .lecture-base-picker select { width: 100%; max-width: none; }
.material-menu .job-actions { display: flex; gap: 7px; margin-top: 10px; }
.load-more { display: flex; margin: 28px auto 0; }
.material-empty { grid-column: 1/-1; width: min(520px,100%); min-height: 260px; margin: 0; padding: 34px; border: 1px dashed var(--line-2); border-radius: 7px; }
.material-empty .button { margin-top: 12px; }

.button, .btn { transition: transform .25s var(--ease),border-color .25s,background .25s,color .25s,box-shadow .25s; }
.button.primary, .btn.primary { background: linear-gradient(135deg,#d8dfcd,#b5c1aa); border-color: #c7d0bc; color: #090b09; box-shadow: 0 10px 28px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.42); }
.button.primary:hover:not(:disabled), .btn.primary:hover:not(:disabled) { background: linear-gradient(135deg,#e8eddf,#c7d2bb); color: #090b09; transform: translateY(-2px); box-shadow: 0 15px 36px rgba(0,0,0,.32); }
.icon-btn { border-radius: 5px; }
.record-dialog { border-radius: 10px; background: #0e110f; box-shadow: 0 40px 120px rgba(0,0,0,.7); }
.record-dialog-head { padding: 20px 22px; background: rgba(9,11,10,.94); backdrop-filter: blur(16px); }
.record-dialog .capture-card { background: #0e110f; }
.recorder-stage { border-radius: 7px; background: radial-gradient(circle at 50% 20%,rgba(192,205,177,.10),transparent 42%),#090b0a; }
.lecture-form input, .lecture-form select, .lecture-form textarea { border-radius: 5px; transition: border-color .2s,box-shadow .2s; }
.lecture-form input:focus, .lecture-form select:focus, .lecture-form textarea:focus { border-color: rgba(202,214,188,.42); box-shadow: 0 0 0 3px rgba(190,204,174,.055); }
.context-details, .selected-file, .marker-panel, .consent-row, .audio-dropzone { border-radius: 6px; }
.result-dialog { border-radius: 10px; box-shadow: 0 40px 130px rgba(0,0,0,.72); }
.result-pane { max-width: 74ch; }
.study-chapter, .learning-map, .lecture-intro, .review-section, .supplementary-section, .lecture-photos { border-radius: 6px !important; }
.webcheck-auth { border-radius: 10px; background: linear-gradient(160deg,rgba(21,25,22,.98),rgba(12,14,13,.98)); box-shadow: 0 45px 120px rgba(0,0,0,.48); }

@media (max-width: 1180px) {
  .topbar .release-stamp, .service-state > span { display: none; }
  .subject-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .hero-composition { grid-template-columns: minmax(0,1fr) 190px; }
}

@media (max-width: 850px) {
  .topbar { position: sticky; top: 0; height: 60px; grid-template-columns: 1fr auto; padding: 0 12px; }
  .topbar-start { gap: 7px; }
  .topbar-end { gap: 7px; }
  .product-tabs, .topbar .service-state, .topbar .user > span:last-child { display: none; }
  .unified-layout, .sidebar-collapsed .unified-layout { display: block; }
  .library-panel, .sidebar-collapsed .library-panel { position: fixed; z-index: 35; top: 60px; bottom: 0; left: 0; width: min(86vw,320px); min-height: 0; display: flex; border-top: 0; box-shadow: 25px 0 70px rgba(0,0,0,.55); transform: translateX(0); transition: transform .48s var(--ease),visibility .48s; }
  .sidebar-collapsed .library-panel { visibility: hidden; transform: translateX(-105%); }
  .sidebar-collapsed .knowledge-head > div:first-child h2,
  .sidebar-collapsed .knowledge-head > div:last-child #add-knowledge-base,
  .sidebar-collapsed .sidebar-caption,
  .sidebar-collapsed .knowledge-base-list,
  .sidebar-collapsed .sidebar-queue,
  .sidebar-collapsed .knowledge-info-button { display: initial; }
  .sidebar-collapsed .knowledge-head { justify-content: space-between; padding: 0 16px; }
  .sidebar-collapsed .knowledge-head > div:first-child { display: flex; }
  .sidebar-collapsed .knowledge-head > div:last-child { position: static; display: flex; }
  .sidebar-collapsed #toggle-sidebar { transform: none; }
  .sidebar-collapsed .library-footer { width: auto; margin-top: 0; padding: 12px; }
  .sidebar-collapsed .rail-record { width: 100%; height: auto; margin-top: 7px; padding: 11px; border-radius: 5px; font-size: 12px; }
  .sidebar-collapsed .rail-record span { font-size: inherit; }
  .study-workbench, .sidebar-collapsed .study-workbench { padding: 32px 16px 64px; }
  .record-dialog, .result-dialog { position: fixed; inset: 0; width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; border: 0; border-radius: 0; }
  .hero-composition { min-height: auto; grid-template-columns: 1fr; padding: 26px 0 44px; }
  .hero-orbit { display: none; }
  .workspace-header h1 { font-size: clamp(43px,13vw,64px); }
  .subject-grid { grid-template-columns: 1fr; }
  .subject-card { height: 190px; }
  .system-grid { grid-template-columns: 1fr; }
  .subject-hero { min-height: 250px; align-items: flex-start; flex-direction: column; padding: 40px 0 30px; }
  .subject-hero .record-cta { width: auto; }
  .subject-stats { grid-template-columns: repeat(3,1fr); margin-bottom: 42px; }
  .subject-stats article { min-height: 82px; padding: 12px; }
  .material-grid { grid-template-columns: repeat(auto-fill,minmax(260px,340px)); }
  .section-heading { align-items: flex-start; flex-direction: column; }
  .section-heading > p { text-align: left; }
}

@media (max-width: 520px) {
  .topbar .brand span:last-child { font-size: 13px; }
  .topbar .btn.small { padding-inline: 8px; font-size: 9px; }
  .workspace-header h1 { font-size: clamp(40px,13vw,54px); }
  .hero-actions { align-items: stretch; flex-direction: column; }
  .hero-actions .btn { justify-content: center; }
  .subject-stats { gap: 0; }
  .subject-stats span { font-size: 6px; }
  .subject-stats strong { font-size: 23px; }
  .material-grid { grid-template-columns: minmax(0,1fr); }
  .material-card { max-width: 360px; height: 285px; }
  .workspace-note { padding: 24px; }
  .material-menu > div { left: -4px; }
}
