/* Shared studio: forest navigation, warm paper and purposeful colour accents.
   Only presentation changes; study state, canvas coordinates and syntax colours
   remain owned by their respective components. */
.sidebar-toggle, .sidebar-close, .sidebar-edge, .sidebar-backdrop { display: none; }
body.refined-ui { --sidebar-width: 232px; }
@media (min-width: 821px) {
  body.refined-ui .sidebar-toggle { display: inline-flex; }
  body.refined-ui.sidebar-collapsed:not(.tablet-focus-mode):not(.study-fullscreen-mode) .app-shell { grid-template-columns: minmax(0, 1fr); }
  body.refined-ui.sidebar-collapsed:not(.tablet-focus-mode):not(.study-fullscreen-mode) .workspace { grid-column: 1; min-width: 0; width: 100%; }
}
@media (min-width: 821px) and (max-width: 1100px) { body.refined-ui { --sidebar-width: 205px; } }
body.refined-ui .sidebar-toggle { align-items: center; gap: 7px; flex-shrink: 0; min-height: 38px; padding: 7px 10px; margin-right: 14px; border: 1px solid #d9dfd2; border-radius: 9px; background: #fffefb; color: #315b47; font-size: 11px; cursor: pointer; }
body.refined-ui .sidebar-toggle svg, body.refined-ui .sidebar-close svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
body.refined-ui .topbar .deck-label { margin-right: auto; }
body.refined-ui .sidebar-close { position: absolute; top: 6px; right: 6px; z-index: 2; display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border-radius: 6px; border: 0; color: #fff; background: transparent; cursor: pointer; }
body.refined-ui .sidebar-toggle:hover { background: #edf2e7; }
body.refined-ui .sidebar-close:hover { background: transparent; opacity: .75; }
body.refined-ui :is(.sidebar-toggle,.sidebar-close,.sidebar-edge):focus-visible { outline: 3px solid #caa342; outline-offset: 3px; }
body.refined-ui.sidebar-collapsed:not(.tablet-focus-mode):not(.study-fullscreen-mode) .sidebar { position: fixed; top: 0; bottom: 0; left: 0; z-index: 80; width: var(--sidebar-width); height: 100dvh; transform: translateX(calc(-100% - 16px)); visibility: hidden; transition: transform .18s ease, visibility .18s; }
body.refined-ui.sidebar-peek:not(.tablet-focus-mode):not(.study-fullscreen-mode) .sidebar { transform: translateX(0); visibility: visible; box-shadow: 12px 0 35px #152e2424; }
body.refined-ui.sidebar-collapsed:not(.tablet-focus-mode):not(.study-fullscreen-mode) .sidebar-edge { position: fixed; inset: 0 auto 0 0; z-index: 75; display: grid; place-items: center; width: 12px; height: 100dvh; padding: 0; background: transparent; color: #476c54; cursor: pointer; }
body.refined-ui .sidebar-edge span { display: grid; place-items: center; width: 12px; height: 48px; border: 1px solid #c8d6c2; border-left: 0; border-radius: 0 7px 7px 0; background: #e8efdf; font-size: 18px; }
body.refined-ui.tablet-device.sidebar-peek .sidebar-backdrop { display: block; position: fixed; inset: 0; z-index: 70; background: #152e2433; }
body.refined-ui:is(.tablet-focus-mode,.study-fullscreen-mode) :is(.sidebar-toggle,.sidebar-close,.sidebar-edge,.sidebar-backdrop) { display: none; }
@media (min-width: 600px) and (max-width: 820px) {
  body.refined-ui.tablet-device .sidebar-toggle { display: inline-flex; min-width: 44px; min-height: 44px; margin-right: 12px; }
  body.refined-ui.tablet-device.sidebar-collapsed:not(.tablet-focus-mode):not(.study-fullscreen-mode) .sidebar { display: flex; }
  body.refined-ui.tablet-device .sidebar-close { width: 44px; height: 44px; right: 4px; top: 4px; }
  body.refined-ui.tablet-device .sidebar .side-nav { min-height: 0; flex-shrink: 1; overflow-y: auto; }
  body.refined-ui.tablet-device .sidebar .sidebar-foot { flex-shrink: 0; }
  body.refined-ui.tablet-device .sidebar .nav-item { min-height: 36px; margin-bottom: 2px; }
}
@media (max-width: 1199px) { body.refined-ui .sidebar-toggle span { display: none; } }
@media (min-width: 701px) and (max-width: 820px) {
  body.refined-ui.sentence-study-page[data-studio-view] .site-filing { position: fixed; margin: 0; bottom: 76px; }
}
@media (prefers-reduced-motion: reduce) { body.refined-ui.sidebar-collapsed .sidebar { transition: none !important; } }
body.refined-ui[data-studio-view] {
  --paper: #faf9f5;
  --ink: #243d32;
  --ink-2: #476051;
  --muted: #788278;
  --line: #e4e5dc;
  --line-dark: #cdd7ca;
  --green: #205e49;
  --green-soft: #edf3e9;
  --studio-accent: #dbc578;
  --studio-tint: #f6efd9;
  background: #faf9f5;
  color: #243d32;
}
body.refined-ui[data-studio-view="translate"] { --studio-accent: #bdafd9; --studio-tint: #f0ebf7; }
body.refined-ui[data-studio-view="dictation"] { --studio-accent: #91bbc9; --studio-tint: #eaf3f7; }
body.refined-ui[data-studio-view="ai-reading"], body.refined-ui[data-studio-view="sentence-study"] { --studio-accent: #d9a58b; --studio-tint: #f8eee7; }
body.refined-ui[data-studio-view="oral-practice"] { --studio-accent: #baacd5; --studio-tint: #f0ebf7; }
body.refined-ui[data-studio-view="unknown"], body.refined-ui[data-studio-view="translate-unknown"] { --studio-accent: #cdbb88; --studio-tint: #f7f1df; }
body.refined-ui[data-studio-view="leaderboard"] { --studio-accent: #9ab88a; --studio-tint: #edf3e6; }
body.refined-ui[data-studio-view] .sidebar {
  background: #173f35; color: #ecf1e8; border-right: 0;
}
body.refined-ui[data-studio-view] .brand { color: #fff; padding-bottom: 18px; }
body.refined-ui[data-studio-view] .brand small { color: #b4c8ba; }
body.refined-ui[data-studio-view] .brand-mark { background: #fff; border-radius: 12px; }
body.refined-ui[data-studio-view] :is(.nav-item, .sidebar-account) { color: #c0d0c4; }
body.refined-ui[data-studio-view] .nav-item { border-radius: 9px; }
@media (min-width: 821px) {
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .nav-item { min-height: 36px; margin-bottom: 2px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .side-nav { gap: 2px; }
}
body.refined-ui[data-studio-view] .nav-item:hover { background: #255346; color: #fff; }
body.refined-ui[data-studio-view] .nav-item.active { color: #173f35; background: #f0d481; font-weight: 750; }
body.refined-ui[data-studio-view] .nav-item.active::before { background: #f0d481; }
body.refined-ui[data-studio-view] .nav-count { color: #afc5b6; }
body.refined-ui[data-studio-view] .nav-item.active .nav-count { color: #345a44; }
body.refined-ui[data-studio-view] .nav-group-label { color: #9ebaa8; font-size: 11px; letter-spacing: .12em; }
body.refined-ui[data-studio-view] :is(.management-label, .sidebar-foot) { border-color: #ffffff1c; }
body.refined-ui[data-studio-view] .side-nav { scrollbar-color: #527766 transparent; }
body.refined-ui[data-studio-view] .account-avatar { color: #ebf2e8; background: #355c49; border-color: #557560; }
body.refined-ui[data-studio-view] .version { color: #96b39f; }
body.refined-ui[data-studio-view] .topbar { background: #faf9f5; color: #243d32; border-color: #e5e5dc; }
body.refined-ui[data-studio-view] #workspaceTitle { display: flex; align-items: center; gap: 10px; font-weight: 700; }
body.refined-ui[data-studio-view] #workspaceTitle::before { content: ''; width: 8px; height: 8px; border-radius: 3px; background: var(--studio-accent); }
body.refined-ui[data-studio-view] :is(.top-import-button, .top-avatar) { background: #fffefb; border-color: #dbdfd3; }
body.refined-ui[data-studio-view] :is(.page-head h1, .ss-header h1, .oral-heading h1, .wd-heading h1, .nh-heading h1) { color: #253b30; letter-spacing: -.045em; font-weight: 780; }
body.refined-ui[data-studio-view] .page-head > div:first-child { border-left: 4px solid var(--studio-accent); padding-left: 17px; }
body.refined-ui[data-studio-view] .page-head .eyebrow { color: #7a826f; font-size: 10px; letter-spacing: .14em; }
body.refined-ui[data-studio-view] .page-head p { color: #738071; }
body.refined-ui[data-studio-view] .button { border-radius: 10px; font-size: 12px; }
body.refined-ui[data-studio-view] .button.primary { background: #205e49; border-color: #205e49; box-shadow: none; }
body.refined-ui[data-studio-view] .button.primary:hover:not(:disabled) { background: #174c3a; }
body.refined-ui[data-studio-view] .button.ghost { border-color: #d7ddd0; background: #fffefb; }
body.refined-ui[data-studio-view] :is(input:not([type=checkbox]):not([type=radio]), textarea, select) { font-weight: 400; }
body.refined-ui[data-studio-view] :is(.table-card, .settings-card, .side-panel, .account-card, .history-card, .library-card, .empty-state) { border-color: #e1e4d8; border-radius: 17px; box-shadow: 0 3px 10px #283d2603; }
body.refined-ui[data-studio-view] :is(.table-toolbar, .ai-section-head) { border-color: #e6e7df; }
body.refined-ui[data-studio-view] .data-table th { background: #f4f3eb; color: #6c7969; padding-block: 15px; }
body.refined-ui[data-studio-view] .data-table td { border-color: #eaede4; padding-block: 16px; }
body.refined-ui[data-studio-view] .data-table tbody tr:hover { background: #fafaf4; }
body.refined-ui[data-studio-view] .word-cell { color: #264b39; font-size: 18px; }
body.refined-ui[data-studio-view] .stats-strip { border-radius: 14px; border-color: #e3e5d9; background: #fffefb; box-shadow: none; }
body.refined-ui[data-studio-view] .stat-cell strong { font-family: inherit; font-weight: 750; }
body.refined-ui[data-studio-view] .mobile-nav { background: #fffdf7; border-color: #e1e4d8; }

/* Vocabulary workspace: an uncluttered sheet and a distinct instrument rail. */
body.refined-ui:not(.tablet-focus-mode):not(.study-fullscreen-mode) #mainContent.study-view .page-head > div:first-child { border-left: 0; padding-left: 0; }
body.refined-ui:not(.tablet-focus-mode):not(.study-fullscreen-mode) #mainContent.study-view :is(.study-card, .finish-card) { border-radius: 20px; border-color: #dedfd5; background: #fffefb; box-shadow: inset 0 4px var(--studio-accent); }
body.refined-ui:not(.tablet-focus-mode):not(.study-fullscreen-mode) #mainContent.study-view .study-side { border-radius: 17px; background: #f2f3e9; border-color: #e0e4d4; }
body.refined-ui:not(.tablet-focus-mode):not(.study-fullscreen-mode) #mainContent.study-view .learning-plan-strip { border-block-color: #e3e3d8; background: transparent; }
body.refined-ui:not(.tablet-focus-mode) #mainContent.study-view .study-progress-track { height: 4px; border-radius: 10px; background: #eceee5; }
body.refined-ui:not(.tablet-focus-mode) #mainContent.study-view .study-progress-fill { border-radius: 10px; background: #59815e; }
body.refined-ui:not(.tablet-focus-mode) #mainContent.study-view .study-top { padding-bottom: 5px; }
body.refined-ui:not(.tablet-focus-mode) #mainContent.study-view .mode-pill { padding: 5px 10px; border-radius: 30px; background: var(--studio-tint); color: #5a6453; }
body.refined-ui:not(.tablet-focus-mode) #mainContent.study-view .meaning-text.english-prompt { color: #24372c; }
body.refined-ui:not(.tablet-focus-mode) #mainContent.study-view .answer-form { border-radius: 12px; background: #fff; box-shadow: none; }
body.refined-ui:not(.tablet-focus-mode) #mainContent.study-view .answer-mode-row button.active { color: #205e49; border-bottom-color: #205e49; }
body.refined-ui:not(.tablet-focus-mode) #mainContent.study-view .study-rail-tabs { gap: 3px; padding-block: 4px; border-color: #dce2d3; }
body.refined-ui:not(.tablet-focus-mode) #mainContent.study-view .study-rail-tabs button { padding-block: 9px; border: 0; border-radius: 7px; }
body.refined-ui:not(.tablet-focus-mode) #mainContent.study-view .study-rail-tabs button[aria-selected=true] { background: #fffefb; color: #205e49; box-shadow: 0 1px 4px #243b2810; }
body.refined-ui #answerInput, body.refined-ui #dictationAnswerInput { font-weight: 400 !important; }

/* Listening: the playback control is the focal point, the answer stays readable. */
body.refined-ui[data-studio-view="dictation"] .dictation-card { border-radius: 22px; background: #fffefb; border-color: #dce3df; box-shadow: inset 0 5px #91bbc9; }
body.refined-ui[data-studio-view="dictation"] .dictation-card::after { display: none; }
body.refined-ui[data-studio-view="dictation"] .dictation-card h2 { font-family: inherit; font-size: 27px; }
body.refined-ui[data-studio-view="dictation"] .dictation-speaker { background: #e8c96e; color: #1e493b; border-radius: 28px; box-shadow: 0 7px 0 #d5b458; }
body.refined-ui[data-studio-view="dictation"] .dictation-speaker.preview { background: #eaf2f5; box-shadow: none; }
body.refined-ui[data-studio-view="dictation"] .dictation-active.answered .dictation-speaker { border-radius: 16px; box-shadow: none; }
body.refined-ui[data-studio-view="dictation"] .dictation-side > section { background: #f0f4f2; }
body.refined-ui[data-studio-view="dictation"] .dictation-feedback { border-radius: 11px; }

/* Short readings: pick words on the left, create and revisit stories on the right. */
body.refined-ui[data-studio-view="ai-reading"] .ai-picker-card { background: #fffefb; overflow: hidden; }
body.refined-ui[data-studio-view="ai-reading"] .ai-section-head { padding-bottom: 17px; border-bottom: 1px solid #e8e4db; }
body.refined-ui[data-studio-view="ai-reading"] .ai-section-head h2 { font-family: inherit; font-size: 22px; }
body.refined-ui[data-studio-view="ai-reading"] .ai-section-head > strong { padding: 8px 13px; border-radius: 9px; background: #f5ecd8; color: #725b30; font-size: 16px; }
body.refined-ui[data-studio-view="ai-reading"] .ai-settings-card { background: #f7e8dc; }
body.refined-ui[data-studio-view="ai-reading"] .ai-settings-card h3 { font-size: 22px; margin-block: 12px 20px; }
body.refined-ui[data-studio-view="ai-reading"] .ai-word-row { border-radius: 10px; background: #faf9f3; border-color: transparent; }
body.refined-ui[data-studio-view="ai-reading"] .ai-word-row.selected { background: #eaf1e2; border-color: #9cb18e; }
body.refined-ui[data-studio-view="ai-reading"] .ai-random-row { background: #f5f0e0; border-color: #e5dec6; }
body.refined-ui[data-studio-view="ai-reading"] .ai-history-card { background: #fffefb; }
body.refined-ui[data-studio-view="ai-reading"] .ai-article-card { background: #fffefb; border-radius: 20px; }

/* Reading: warm toolbars and two paper panels; semantic annotation colours unchanged. */
body.refined-ui.sentence-study-page .ss-source-bar { border-color: #e3dcd2; background: #f7eee5; border-radius: 14px; }
body.refined-ui.sentence-study-page .ss-work { border-radius: 19px; border-color: #e2e3d9; background: #fffefb; overflow: hidden; }
body.refined-ui.sentence-study-page .ss-card { background: #fffefb; }
body.refined-ui.sentence-study-page .ss-step { padding-bottom: 15px; border-bottom-color: #e9e7dc; }
body.refined-ui.sentence-study-page .ss-step > span { color: #b38d70; font-family: inherit; font-size: 16px; font-weight: 700; }
body.refined-ui.sentence-study-page .ss-step h2 { color: #344d3d; font-size: 15px; }
body.refined-ui.sentence-study-page .ss-layer-tabs { padding: 4px; border-radius: 8px; background: #f0f1e8; }
body.refined-ui.sentence-study-page .ss-layer-tabs button.active { border-radius: 6px; background: #fffefb; }
body.refined-ui.sentence-study-page .ss-notes { border-radius: 12px; background: #f4f1e6; border-color: #e6e1d2; }
body.refined-ui.sentence-study-page .ss-translation-pair { border-radius: 12px; border-color: #e0e5d8; }
body.refined-ui.sentence-study-page .ss-answer-label textarea { background: #fffefb; }

/* Speaking: tactile scene cards become the scene chooser, without extra UI chrome. */
body.refined-ui[data-studio-view="oral-practice"] .oral-page { max-width: 1560px; color: var(--ink); }
body.refined-ui[data-studio-view="oral-practice"] .oral-intro { margin-top: 18px; }
body.refined-ui[data-studio-view="oral-practice"] .oral-scenes { gap: 15px; }
body.refined-ui[data-studio-view="oral-practice"] .oral-scenes > button { position: relative; border-radius: 19px; border: 1px solid transparent; background: #f0e5bf; padding: 22px; min-height: 228px; text-align: left; transition: transform .15s, box-shadow .15s; }
body.refined-ui[data-studio-view="oral-practice"] .oral-scenes > button:nth-child(5n+2) { background: #ead4c4; }
body.refined-ui[data-studio-view="oral-practice"] .oral-scenes > button:nth-child(5n+3) { background: #dce6d1; }
body.refined-ui[data-studio-view="oral-practice"] .oral-scenes > button:nth-child(5n+4) { background: #dcd2ec; }
body.refined-ui[data-studio-view="oral-practice"] .oral-scenes > button:nth-child(5n+5) { background: #cddfe4; }
body.refined-ui[data-studio-view="oral-practice"] .oral-scenes > button:hover { transform: translateY(-3px); box-shadow: 0 9px 20px #243b2810; }
body.refined-ui[data-studio-view="oral-practice"] .oral-scenes > button[aria-pressed=true] { outline: 2px solid #27644d; outline-offset: 3px; }
body.refined-ui[data-studio-view="oral-practice"] .oral-scenes button > span { font: 750 15px/1.2 system-ui; color: #5a694f; }
body.refined-ui[data-studio-view="oral-practice"] .oral-scenes h3 { margin-top: 33px; font-size: 21px; color: #2b4134; }
body.refined-ui[data-studio-view="oral-practice"] .oral-scenes p { color: #536451; font-size: 12px; }
body.refined-ui[data-studio-view="oral-practice"] .oral-scenes b { color: #28563f; }
body.refined-ui[data-studio-view="oral-practice"] .oral-task { background: #e7e4f0; border-color: #d9d6e0; border-radius: 18px; }
body.refined-ui[data-studio-view="oral-practice"] .oral-conversation { border-radius: 18px; background: #fffefb; }
body.refined-ui[data-studio-view="oral-practice"] .oral-message { border-radius: 4px 18px 18px; background: #f0f1e8; }
body.refined-ui[data-studio-view="oral-practice"] .oral-message.user { border-radius: 18px 4px 18px 18px; background: #e8e4f2; }
body.refined-ui[data-studio-view="oral-practice"] .oral-composer { background: #faf9f3; }

/* Rankings and collection pages share the same warm card system. */
body.refined-ui[data-studio-view="leaderboard"] .weekly-layout { max-width: none; gap: 22px; }
body.refined-ui[data-studio-view="leaderboard"] .weekly-ranking { background: #fffefb; border-radius: 20px; }
body.refined-ui[data-studio-view="leaderboard"] .weekly-tabs { background: #efeee3; padding: 6px; border-radius: 12px; }
body.refined-ui[data-studio-view="leaderboard"] .weekly-tabs button { border-radius: 8px; }
body.refined-ui[data-studio-view="leaderboard"] .weekly-tabs button[aria-pressed=true] { background: #e7d193; color: #314d36; box-shadow: none; }
body.refined-ui[data-studio-view="leaderboard"] .weekly-rank-row { padding: 18px 10px; border-radius: 10px; }
body.refined-ui[data-studio-view="leaderboard"] .weekly-position { color: #8f7950; font-weight: 750; }
body.refined-ui[data-studio-view="leaderboard"] .weekly-my-card { border-radius: 19px; background: #234d3e; }
body.refined-ui[data-studio-view="leaderboard"] .weekly-my-card > .button { color: #173f35; background: #ecd082; }
body.refined-ui[data-studio-view="leaderboard"] .weekly-rules { padding-inline: 15px; }
body.refined-ui[data-studio-view="unknown"] .table-card, body.refined-ui[data-studio-view="translate-unknown"] .table-card { background: #fffefb; }
body.refined-ui[data-studio-view="library"] .builtin-library-card { border-radius: 16px; background: #fffefb; }

/* Game frames and controls join the studio; illustrated playfields stay intact. */
body.refined-ui.word-defense-page .wd-arena { border-radius: 21px; border-color: #cfd7c4; box-shadow: none; }
body.refined-ui.word-defense-page .wd-hud { background: #20503e; }
body.refined-ui.word-defense-page :is(.wd-question-panel, .wd-build-panel) { border-radius: 18px; background: #fffdf5; border-color: #dce2d2; }
body.refined-ui.word-defense-page .wd-heading h1 { font-size: 30px; }
body.refined-ui.word-defense-page .wd-stage-track { background: #f4f0df; }
body.refined-ui.noun-hunt-page .nh-table { border-radius: 21px; box-shadow: none; border-color: #d9d2bd; }
body.refined-ui.noun-hunt-page .nh-scene-heading { background: #eee4ca; color: #6f725a; }
body.refined-ui.noun-hunt-page .nh-panel { background: #fffdf5; border-radius: 19px; border-color: #dedfcf; }
body.refined-ui.noun-hunt-page .nh-heading h1 { font-size: 30px; }
body.refined-ui.noun-hunt-page .nh-mode-tabs button { border-radius: 9px; }
body.refined-ui.noun-hunt-page .nh-mode-tabs button[aria-pressed=true] { background: #e4d69f; color: #3f5c3f; border-color: #bca96e; }
body.refined-ui.noun-hunt-page .nh-primary { border-radius: 11px; background: #205e49; border-color: #205e49; color: #fffdf0; }
body.refined-ui.noun-hunt-page .nh-secondary { border-radius: 11px; }

@media (min-width: 821px) {
  /* All desktop routes share one sidebar geometry. Grid rows must not stretch
     into the spare flex height; only the menu scrolls on a short viewport. */
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .sidebar { height: 100dvh; min-height: 0; padding-block: 28px 12px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) :is(.brand, .sidebar-foot) { flex-shrink: 0; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .side-nav { flex: 1 1 auto; min-height: 0; overflow-y: auto; align-content: start; grid-auto-rows: min-content; margin-top: 20px; gap: 2px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .nav-group-label { margin-block: 13px 6px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .management-label { margin-top: 8px; padding-top: 12px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .sidebar-foot { gap: 2px; padding-top: 10px; }
}
@media (min-width: 1101px) and (min-height: 700px) {
  body.refined-ui[data-studio-view="ai-reading"] .ai-builder-grid { height: max(450px, calc(100dvh - 270px)); align-items: stretch; }
  body.refined-ui[data-studio-view="ai-reading"] .ai-picker-card { display: flex; flex-direction: column; min-height: 0; }
  body.refined-ui[data-studio-view="ai-reading"] .ai-word-list { flex: 1; min-height: 0; max-height: none; }
  body.refined-ui[data-studio-view="ai-reading"] .ai-settings-column { max-height: 100%; overflow: auto; align-content: start; }
}
@media (max-width: 820px) {
  body.refined-ui[data-studio-view] .site-filing { position: static; max-width: none; margin: 12px 14px 78px; background: transparent; backdrop-filter: none; }
  body.refined-ui[data-studio-view] .site-links { justify-content: center; }
  body.refined-ui[data-studio-view] .page-head > div:first-child { padding-left: 12px; border-left-width: 3px; }
  body.refined-ui[data-studio-view] .page-head h1 { font-size: 26px; }
  body.refined-ui[data-studio-view] :is(.table-card, .settings-card, .side-panel) { border-radius: 13px; }
  body.refined-ui[data-studio-view="oral-practice"] .oral-scenes > button { min-height: 195px; padding: 18px; }
  body.refined-ui[data-studio-view="oral-practice"] .oral-scenes h3 { font-size: 18px; margin-top: 24px; }
  body.refined-ui[data-studio-view="leaderboard"] .weekly-ranking { padding: 19px; }
}
@media (min-width: 821px) and (max-height: 820px) {
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .sidebar { padding-block: 18px 10px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .brand { padding-bottom: 5px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .side-nav { margin-top: 12px; gap: 0; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .nav-item { min-height: 31px; margin-bottom: 1px; font-size: 12px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .nav-group-label { margin-block: 9px 4px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .management-label { margin-top: 8px; padding-top: 8px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .sidebar-foot { gap: 2px; padding-top: 8px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .sidebar-account { min-height: 40px; }
}
@media (min-width: 821px) and (max-height: 720px) {
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .sidebar { padding-block: 12px 8px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .brand { padding-bottom: 0; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .brand-mark { width: 39px; height: 39px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .brand strong { font-size: 21px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .side-nav { margin-top: 10px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .nav-item { min-height: 26px; margin-bottom: 0; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .nav-group-label { margin-block: 6px 3px; font-size: 10px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .management-label { padding-top: 6px; }
  body.refined-ui[data-studio-view]:not(.tablet-focus-mode) .sidebar-settings { min-height: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  body.refined-ui[data-studio-view="oral-practice"] .oral-scenes > button { transition: none; }
  body.refined-ui[data-studio-view="oral-practice"] .oral-scenes > button:hover { transform: none; }
}

/* Daily recap: a quiet dashboard shared by the three training finish screens. */
body #mainContent .finish-card:has(.study-recap),body #mainContent .dictation-finished:has(.study-recap) { display:flex;flex-direction:column;align-items:center;justify-content:safe center;overflow-y:auto;gap:0;padding:24px; }
body #mainContent .finish-card:has(.study-recap)>*,body #mainContent .dictation-finished:has(.study-recap)>* { flex-shrink:0; }
body #mainContent .finish-card:has(.study-recap) .finish-symbol,body #mainContent .dictation-finished:has(.study-recap) .dictation-finish-symbol { width:38px;height:38px;font-size:19px;margin-bottom:10px;border-radius:12px; }
body #mainContent .finish-card:has(.study-recap)>p,body #mainContent .dictation-finished:has(.study-recap)>p { margin:7px 0 16px;max-width:550px;font-size:12px;line-height:1.65; }
.study-recap { width:min(100%,560px);margin:0 auto 8px;color:#234b40;text-align:left; }
.recap-caption { display:flex;justify-content:space-between;gap:12px;padding-bottom:12px;border-bottom:1px solid #e9e8df;font-size:12px;color:#858775; }
.recap-caption>span:first-child { color:#456553;font-weight:650; }
.recap-overview { display:grid;grid-template-columns:155px minmax(0,1fr);align-items:center;gap:28px;padding:18px 4px; }
.recap-ring { position:relative;width:155px;aspect-ratio:1; }
.recap-ring svg { display:block;width:100%;height:100%;transform:rotate(-90deg);overflow:visible; }
.recap-ring circle { fill:none;stroke-width:8; }
.recap-ring-track { stroke:#eae8da; }
.recap-ring-fill { stroke:#226457;stroke-linecap:round; }
.recap-ring-text { position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px; }
.recap-ring-text>.recap-counter { font-size:35px;font-weight:700; }
.recap-ring-text>span:last-child { font-size:11px;color:#7e8678; }
.recap-learned { display:flex;min-width:0;flex-direction:column;gap:8px; }
.recap-learned>span { color:#818675;font-size:12px;line-height:1.65; }
.recap-learned>strong { display:flex;align-items:baseline;gap:8px;font-size:60px;line-height:1.15;letter-spacing:-2px;font-weight:700; }
.recap-learned>strong>small { font-size:14px;letter-spacing:0;color:#848675;font-weight:400; }
.recap-counter-visual { display:inline-flex;align-items:baseline;vertical-align:bottom;white-space:nowrap;letter-spacing:0;font-variant-numeric:tabular-nums; }
.recap-digit { display:inline-block;width:.64em;height:1.14em;overflow:hidden;vertical-align:bottom; }
.recap-digit-strip { display:flex;flex-direction:column;will-change:transform; }
.recap-digit-strip>span { display:block;height:1.14em;line-height:1.14em;flex:0 0 auto;text-align:center; }
.recap-digit-separator { display:inline-block;line-height:1.14em; }
.recap-unit { margin-left:2px;font-size:.48em; }
.recap-sr-value { position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap; }
.recap-facts { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;border-radius:14px;background:#f5f5ed;padding:14px 8px; }
.recap-facts>div { display:flex;flex-direction:column;align-items:center;gap:6px;border-right:1px solid #e3e6da; }
.recap-facts>div:last-child { border-right:0; }
.recap-facts .recap-counter { font-size:25px;font-weight:650; }
.recap-facts>div:nth-child(2) .recap-counter { color:#a7835e; }
.recap-facts>div>span:last-child { font-size:11px;color:#858875; }
.recap-footnote { font-size:10px;line-height:1.7;color:#939582;margin-top:10px;text-align:center; }
body #mainContent .finish-card:has(.study-recap) .daily-extra-actions { margin-top:15px;width:min(560px,100%); }
body #mainContent .finish-card:has(.study-recap) .daily-extra-custom { width:min(560px,100%); }
@media(max-width:700px) {
 body #mainContent .finish-card:has(.study-recap),body #mainContent .dictation-finished:has(.study-recap) { padding:22px 16px; }
 .recap-overview { grid-template-columns:122px minmax(0,1fr);gap:14px;padding:18px 0; }.recap-ring { width:122px; }.recap-ring-text>.recap-counter { font-size:29px; }.recap-learned>strong { font-size:44px; }.recap-learned>span { font-size:11px; }.recap-facts .recap-counter { font-size:23px; }
 body #mainContent .finish-card:has(.study-recap) .daily-extra-actions { grid-template-columns:repeat(3,minmax(0,1fr));gap:7px; }
 body #mainContent .finish-card:has(.study-recap) .daily-extra-actions .button { padding-inline:5px;min-height:39px;font-size:11px; }
}
@media(max-width:360px) { .recap-overview { grid-template-columns:100px minmax(0,1fr);gap:10px; }.recap-ring { width:100px; }.recap-ring-text>.recap-counter { font-size:24px; }.recap-learned>strong { font-size:36px; }.recap-ring-text>span:last-child { font-size:10px; } }
@media(prefers-reduced-motion:reduce) { .recap-digit-strip { will-change:auto; } }

body:not(.tablet-focus-mode) #mainContent.study-view .finish-card:has(.study-recap) { justify-content:safe center;overflow-y:auto;padding:22px; }

/* Matching rings for accuracy and the daily word target. Time counts active training only. */
.study-recap .recap-dual-rings { grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding:18px 12px 14px; }
.recap-ring-metric { display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0; }
.recap-ring-learned .recap-ring-fill { stroke:#8b9a52; }
.recap-ring-learned .recap-ring-text { color:#687c3c; }
.recap-ring-note { font-size:10px;line-height:1.6;color:#858875;text-align:center; }
.recap-time { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;margin-bottom:10px;border:1px solid #e9e9df;border-radius:12px;background:#fcfcf7; }
.recap-time>span { display:inline-flex;align-items:center;gap:7px;color:#7b826d;font-size:12px; }
.recap-time>span>svg { width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round; }
.recap-time>strong { display:flex;align-items:baseline;gap:9px;font-size:25px;font-weight:650; }
.recap-time .recap-unit { font-size:12px;font-weight:400; }
@media(max-width:700px) { .study-recap .recap-dual-rings { gap:12px;padding-inline:0; }.recap-time { padding:10px; }.recap-time>span { font-size:11px; }.recap-time>strong { font-size:22px;gap:5px; } }
@media(max-width:360px) { .study-recap .recap-dual-rings { gap:8px; }.recap-ring-note { font-size:9px; }.recap-time { gap:6px; }.recap-time>strong { font-size:20px;gap:3px; } }

body:not(.tablet-focus-mode) #mainContent.study-view .finish-card:has(.study-recap)>p { margin:6px 0 14px;line-height:1.6; }

/* One shared content frame prevents horizontal jumps when switching modules. */
body.refined-ui { --studio-content-width:1560px;--studio-page-gutter:32px; }
@media(min-width:821px) and (max-width:1199px) { body.refined-ui { --studio-page-gutter:20px; } }
@media(min-width:821px) {
 body.refined-ui[data-studio-view]:not(.study-fullscreen-mode):not(.tablet-focus-mode):not(.sentence-focus-mode) #mainContent:not(.word-defense-view):not(.noun-hunt-view) { width:calc(100% - 2 * var(--studio-page-gutter));max-width:var(--studio-content-width);margin-inline:auto; }
 body.refined-ui[data-studio-view="oral-practice"]:not(.tablet-focus-mode) .oral-page { max-width:none;padding-inline:0; }
}
@media(min-width:1200px) {
 body.refined-ui:not(.study-fullscreen-mode):not(.tablet-focus-mode) #mainContent :is(.learn-grid,.dictation-grid,.ai-builder-grid) { grid-template-columns:minmax(0,1fr) 256px;gap:20px; }
}
/* Smaller/coarse-pointer game screens own an immersive full-viewport layout. */
@media(min-width:901px) and (pointer:fine), (min-width:1401px) {
 body.refined-ui[data-studio-view]:not(.tablet-focus-mode) #mainContent:is(.word-defense-view,.noun-hunt-view) { width:calc(100% - 2 * var(--studio-page-gutter));max-width:var(--studio-content-width);margin-inline:auto; }
}

.local-save-notice { position:fixed;top:80px;right:24px;z-index:1300;max-width:min(470px,calc(100vw - 32px));padding:12px 16px;border:1px solid #dfbd83;border-radius:12px;background:#fff6df;color:#78542e;box-shadow:0 6px 24px #49351d18;font-size:12px;line-height:1.75; }
.local-save-notice[hidden] { display:none; }.local-save-notice p { margin:0; }.local-save-notice p+p { margin-top:8px; }
@media(max-width:700px) { .local-save-notice { top:70px;right:16px; } }