/* File reader replacement based on the reference: quiet white reading surface,
   mirrored top controls, contextual bottom actions, and sheet-based tools. */
.file-workspace{
  --reader-bg:#f5f7fb;
  --reader-surface:rgba(255,255,255,.94);
  --reader-surface-solid:#fff;
  --reader-surface-2:#f3f5f8;
  --reader-text:#111827;
  --reader-muted:#667085;
  --reader-line:rgba(15,23,42,.09);
  --reader-blue:#2f72e8;
  --reader-blue-soft:#eaf2ff;
  --reader-shadow:0 18px 52px rgba(31,42,68,.14);
  --reader-safe-bottom:max(14px,env(safe-area-inset-bottom));
  color-scheme:light;
  background:rgba(228,234,244,.74);
}
.file-workspace[data-reader-theme="dark"]{
  --reader-bg:#11151d;
  --reader-surface:rgba(25,30,40,.94);
  --reader-surface-solid:#191e28;
  --reader-surface-2:#232a36;
  --reader-text:#f7f9fc;
  --reader-muted:#a5adba;
  --reader-line:rgba(255,255,255,.10);
  --reader-blue:#76a7ff;
  --reader-blue-soft:#1d3152;
  color-scheme:dark;
}
.file-workspace .immersive-viewer-shell{
  position:relative;
  width:min(980px,100%);
  height:min(96dvh,980px);
  overflow:hidden;
  border:1px solid var(--reader-line);
  border-radius:34px;
  background:var(--reader-bg);
  color:var(--reader-text);
  box-shadow:0 34px 110px rgba(24,35,58,.24);
}
.file-workspace .immersive-title{display:none}
.file-workspace .immersive-close,
.file-workspace .reader-settings-button{
  position:absolute;
  top:18px;
  z-index:65;
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid var(--reader-line);
  border-radius:50%;
  background:var(--reader-surface);
  color:var(--reader-text);
  box-shadow:0 8px 26px rgba(31,42,68,.10);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  transition:opacity .18s ease,transform .18s ease,background .18s ease;
}
.file-workspace .immersive-close{inset-inline-start:18px;left:auto;font:400 28px/1 system-ui}
.file-workspace .reader-settings-button{inset-inline-end:18px}
.file-workspace .reader-settings-button svg{width:22px;height:22px}
.file-workspace .immersive-close:hover,
.file-workspace .reader-settings-button:hover{background:var(--reader-surface-solid);transform:translateY(-1px)}

.file-workspace .viewer-file-status{
  position:absolute;
  top:24px;
  left:50%;
  z-index:55;
  translate:-50% 0;
  max-width:min(52%,520px);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  padding:8px 12px;
  border:1px solid var(--reader-line);
  border-radius:999px;
  background:var(--reader-surface);
  color:var(--reader-muted);
  box-shadow:0 6px 22px rgba(31,42,68,.08);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  font-size:.74rem;
  font-weight:650;
}

.file-workspace .immersive-file-stage,
.file-workspace .office-workspace-stage,
.file-workspace .native-office-stage{
  inset:0;
  padding:0;
  background:var(--reader-bg);
  overscroll-behavior:contain;
}
.file-workspace .native-office-host{width:100%;height:100%;background:var(--reader-surface-solid)}
.file-workspace .immersive-page-track,
.file-workspace .office-page-track{width:100%;min-width:100%;min-height:100%;gap:0}
.file-workspace .immersive-page-label{display:none}

.file-workspace .immersive-file-stage[data-axis="vertical"] .immersive-page-track,
.file-workspace .office-workspace-stage[data-axis="vertical"] .office-page-track{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:0;
}
.file-workspace .immersive-file-stage[data-axis="vertical"] .immersive-page,
.file-workspace .office-workspace-stage[data-axis="vertical"] .office-page-track>[data-office-page]{
  width:100%;
  flex:0 0 auto;
  margin:0;
  padding:0;
}
.file-workspace .immersive-file-stage[data-axis="vertical"] .immersive-page canvas,
.file-workspace .office-workspace-stage[data-axis="vertical"] .word-reader,
.file-workspace .office-workspace-stage[data-axis="vertical"] .slide-reader{
  display:block;
  width:100%!important;
  max-width:none;
  height:auto!important;
  margin:0;
  border:0;
  border-radius:0;
  box-shadow:none;
}
.file-workspace .immersive-file-stage[data-axis="horizontal"],
.file-workspace .office-workspace-stage[data-axis="horizontal"]{
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scroll-padding:0;
}
.file-workspace .immersive-file-stage[data-axis="horizontal"] .immersive-page-track,
.file-workspace .office-workspace-stage[data-axis="horizontal"] .office-page-track{
  width:100%;
  min-width:100%;
  height:100%;
  display:flex;
  flex-direction:row;
  align-items:stretch;
  gap:0;
}
.file-workspace .immersive-file-stage[data-axis="horizontal"] .immersive-page,
.file-workspace .office-workspace-stage[data-axis="horizontal"] .office-page-track>[data-office-page]{
  flex:0 0 100%;
  width:100%;
  height:100%;
  min-width:100%;
  box-sizing:border-box;
  display:grid;
  place-items:center;
  padding:78px 0 104px;
  scroll-snap-align:start;
  scroll-snap-stop:always;
}
.file-workspace .immersive-file-stage[data-axis="horizontal"] .immersive-page canvas,
.file-workspace .office-workspace-stage[data-axis="horizontal"] .word-reader,
.file-workspace .office-workspace-stage[data-axis="horizontal"] .slide-reader{
  max-width:100%;
  max-height:100%;
  margin:0;
  border:0;
  box-shadow:none;
}
.file-workspace.reader-paged .immersive-file-stage[data-axis="vertical"],
.file-workspace.reader-paged .office-workspace-stage[data-axis="vertical"]{scroll-snap-type:y mandatory}
.file-workspace.reader-paged .immersive-file-stage[data-axis="vertical"] .immersive-page,
.file-workspace.reader-paged .office-workspace-stage[data-axis="vertical"] .office-page-track>[data-office-page]{scroll-snap-align:start;scroll-snap-stop:always}

.file-workspace .viewer-reader-dock{
  position:absolute;
  left:50%;
  bottom:var(--reader-safe-bottom);
  z-index:70;
  translate:-50% 0;
  width:max-content;
  max-width:calc(100% - 24px);
  min-height:0;
  display:grid;
  grid-template-columns:repeat(4,52px);
  gap:6px;
  padding:6px;
  border:1px solid color-mix(in srgb,var(--reader-line) 92%,transparent);
  border-radius:999px;
  background:color-mix(in srgb,var(--reader-surface) 92%,transparent);
  box-shadow:0 14px 36px rgba(31,42,68,.16);
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px);
  transition:opacity .18s ease,transform .18s ease;
}
.file-workspace .viewer-reader-dock button{
  width:52px;
  height:52px;
  min-width:52px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:50%;
  background:transparent;
  color:var(--reader-text);
  cursor:pointer;
  box-shadow:none;
  transition:transform .16s ease,background .16s ease,color .16s ease,opacity .16s ease;
}
.file-workspace .viewer-reader-dock button:hover{
  background:color-mix(in srgb,var(--reader-blue) 9%,transparent);
  transform:translateY(-1px);
}
.file-workspace .viewer-reader-dock button:active{transform:scale(.94)}
.file-workspace .viewer-reader-dock button:focus-visible{outline:2px solid color-mix(in srgb,var(--reader-blue) 72%,transparent);outline-offset:2px}
.file-workspace .viewer-reader-dock button:disabled{opacity:.32;cursor:not-allowed;transform:none}
.file-workspace .viewer-dock-icon{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border:1px solid color-mix(in srgb,var(--reader-line) 90%,transparent);
  border-radius:50%;
  background:var(--reader-surface-solid);
  color:var(--reader-text);
  box-shadow:0 4px 12px rgba(31,42,68,.065);
  transition:background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease;
}
.file-workspace .viewer-dock-icon svg{width:21px;height:21px}
.file-workspace .viewer-reader-dock [data-viewer-dock="status"][data-status="reading"] .viewer-dock-icon{
  background:var(--reader-blue-soft);
  border-color:color-mix(in srgb,var(--reader-blue) 28%,var(--reader-line));
  color:var(--reader-blue);
  box-shadow:0 5px 16px color-mix(in srgb,var(--reader-blue) 14%,transparent);
}
.file-workspace .viewer-reader-dock [data-viewer-dock="status"][data-status="finished"] .viewer-dock-icon{
  background:#e7f8ef;
  color:#23875b;
  border-color:#c7ead7;
}
.file-workspace[data-reader-theme="dark"] .viewer-reader-dock [data-viewer-dock="status"][data-status="finished"] .viewer-dock-icon{
  background:#17372b;color:#70d6a8;border-color:#24523f;
}

/* Reference-style bottom sheets */
.file-workspace .viewer-sheet-backdrop{
  position:absolute;
  inset:0;
  z-index:90;
  display:grid;
  align-items:end;
  padding:12px;
  background:rgba(24,32,48,.18);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.file-workspace .viewer-bottom-sheet{
  width:min(560px,100%);
  max-height:min(78dvh,760px);
  margin:0 auto var(--reader-safe-bottom);
  overflow:auto;
  border:1px solid var(--reader-line);
  border-radius:28px;
  background:var(--reader-surface-solid);
  color:var(--reader-text);
  box-shadow:0 28px 80px rgba(31,42,68,.22);
}
.file-workspace .viewer-sheet-handle{width:42px;height:4px;margin:10px auto 2px;border-radius:99px;background:color-mix(in srgb,var(--reader-muted) 30%,transparent)}
.file-workspace .viewer-sheet-head{
  position:sticky;
  top:0;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:13px 16px;
  border:0;
  background:color-mix(in srgb,var(--reader-surface-solid) 94%,transparent);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.file-workspace .viewer-sheet-head h2{margin:0;font:760 1.05rem/1.2 Manrope,system-ui,sans-serif;letter-spacing:-.025em}
.file-workspace .viewer-sheet-head button{
  width:34px;height:34px;border:1px solid var(--reader-line);border-radius:50%;
  background:var(--reader-surface-2);color:var(--reader-text);font-size:21px;
}
.file-workspace .viewer-sheet-body{padding:4px 14px 18px}

.viewer-lecture-picker,.viewer-status-list,.viewer-examine-list{display:grid;gap:9px}
.viewer-lecture-picker>button,.viewer-status-list>button,.viewer-examine-list>button{
  width:100%;
  min-height:70px;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:12px;
  border:1px solid var(--reader-line);
  border-radius:17px;
  background:var(--reader-surface-2);
  color:var(--reader-text);
  text-align:start;
}
.viewer-lecture-picker>button.active,.viewer-status-list>button.active{
  border-color:color-mix(in srgb,var(--reader-blue) 34%,var(--reader-line));
  background:var(--reader-blue-soft);
}
.viewer-lecture-picker-icon,.viewer-status-icon,.viewer-examine-icon{
  width:42px;height:42px;display:grid;place-items:center;border-radius:13px;
  background:var(--reader-surface-solid);border:1px solid var(--reader-line);color:var(--reader-blue);
}
.viewer-lecture-picker-icon svg,.viewer-status-icon svg,.viewer-examine-icon svg{width:20px;height:20px}
.viewer-lecture-picker strong,.viewer-status-list strong,.viewer-examine-list strong{display:block;font-size:.88rem}
.viewer-lecture-picker small,.viewer-status-list small,.viewer-examine-list small{display:block;margin-top:3px;color:var(--reader-muted);font-size:.72rem}
.viewer-row-arrow{display:grid;place-items:center;color:var(--reader-muted)}.viewer-row-arrow svg{width:17px;height:17px}
[dir="rtl"] .file-workspace .viewer-row-arrow svg{transform:rotate(180deg)}

.viewer-navigation-sheet{display:grid;gap:16px}
.viewer-nav-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.viewer-nav-pair button{
  min-height:54px;display:flex;align-items:center;justify-content:center;gap:8px;
  border:1px solid var(--reader-line);border-radius:15px;background:var(--reader-surface-2);color:var(--reader-text);font-weight:700;
}
.viewer-nav-pair button:disabled{opacity:.4}.viewer-nav-pair svg{width:18px;height:18px}
[dir="rtl"] .file-workspace .viewer-nav-pair svg{transform:rotate(180deg)}
.viewer-lecture-select{display:grid;gap:8px;color:var(--reader-muted);font-size:.76rem;font-weight:650}
.viewer-lecture-select select{
  width:100%;height:48px;padding:0 14px;border:1px solid var(--reader-line);border-radius:14px;
  background:var(--reader-surface-solid);color:var(--reader-text);font:700 .86rem DM Sans,system-ui,sans-serif;outline:none;
}

/* Reader settings */
.reader-settings-stack{display:grid;gap:10px}
.reader-setting-section,.reader-setting-row,.reader-tool-list{
  border:1px solid var(--reader-line);border-radius:17px;background:var(--reader-surface-2);
}
.reader-setting-section{padding:13px}
.reader-setting-heading{display:grid;gap:3px;margin-bottom:11px}.reader-setting-heading strong{font-size:.83rem}.reader-setting-heading small{color:var(--reader-muted);font-size:.7rem}
.reader-segmented{display:grid;grid-template-columns:1fr 1fr;gap:5px;padding:4px;border-radius:13px;background:color-mix(in srgb,var(--reader-line) 35%,transparent)}
.reader-segmented button{height:40px;border:0;border-radius:10px;background:transparent;color:var(--reader-muted);font-weight:690}
.reader-segmented button.active{background:var(--reader-surface-solid);color:var(--reader-blue);box-shadow:0 3px 12px rgba(31,42,68,.08)}
.reader-setting-row{
  min-height:58px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:11px;padding:9px 11px;
}
.reader-setting-row-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:11px;background:var(--reader-surface-solid);border:1px solid var(--reader-line);font-weight:750}
.reader-setting-row>strong{font-size:.82rem}.reader-setting-row>button{display:flex;align-items:center;gap:6px;border:0;background:transparent;color:var(--reader-muted);font-weight:650}.reader-setting-row>button svg{width:16px;height:16px}
[dir="rtl"] .file-workspace .reader-setting-row>button svg{transform:rotate(180deg)}
.reader-size-control,.reader-zoom-control{display:flex;align-items:center;gap:4px}
.reader-size-control button,.reader-zoom-control button{
  width:34px;height:34px;border:1px solid var(--reader-line);border-radius:10px;background:var(--reader-surface-solid);color:var(--reader-text);
}
.reader-size-control button:nth-child(1){font-size:11px}.reader-size-control button:nth-child(2){font-size:14px}.reader-size-control button:nth-child(3){font-size:17px}
.reader-size-control button.active{border-color:var(--reader-blue);background:var(--reader-blue-soft);color:var(--reader-blue)}
.reader-zoom-control span{min-width:48px;text-align:center;color:var(--reader-muted);font-size:.76rem;font-weight:700}
.reader-tool-list{overflow:hidden}.reader-tool-list h3{margin:0;padding:11px 13px 7px;color:var(--reader-muted);font-size:.68rem;text-transform:uppercase;letter-spacing:.08em}
.reader-tool-list button{
  width:100%;min-height:50px;display:grid;grid-template-columns:28px minmax(0,1fr) 18px;align-items:center;gap:8px;
  padding:8px 12px;border:0;border-top:1px solid var(--reader-line);background:transparent;color:var(--reader-text);text-align:start;
}
.reader-tool-list button>span:first-child{display:grid;place-items:center;color:var(--reader-blue)}.reader-tool-list button svg{width:17px;height:17px}
[dir="rtl"] .file-workspace .reader-tool-list button>svg:last-child{transform:rotate(180deg)}

.file-workspace .viewer-note-form textarea,
.file-workspace .viewer-search-form input{
  background:var(--reader-surface-2);color:var(--reader-text);border-color:var(--reader-line);
}
.file-workspace .viewer-note-form button,
.file-workspace .viewer-search-form button{background:var(--reader-blue);color:#fff}
.file-workspace .viewer-lecture-notes,.file-workspace .viewer-note-list article{background:var(--reader-surface-2);border-color:var(--reader-line);color:var(--reader-text)}

/* Chrome follows the reference and gets out of the way while scrolling. */
.file-workspace.reader-chrome-hidden:not(:has(.viewer-sheet-backdrop)) .immersive-close,
.file-workspace.reader-chrome-hidden:not(:has(.viewer-sheet-backdrop)) .reader-settings-button{opacity:0;transform:translateY(-12px);pointer-events:none}
.file-workspace.reader-chrome-hidden:not(:has(.viewer-sheet-backdrop)) .viewer-reader-dock{opacity:0;transform:translateY(16px);pointer-events:none}

@media(max-width:760px){
  .file-workspace{background:var(--reader-bg)}
  .file-workspace .immersive-viewer-shell{
    width:100%;height:100dvh;max-height:none;border:0;border-radius:0;box-shadow:none;
  }
  .file-workspace .immersive-close,.file-workspace .reader-settings-button{
    top:calc(11px + env(safe-area-inset-top));width:48px;height:48px;
  }
  .file-workspace .immersive-close{inset-inline-start:12px}
  .file-workspace .reader-settings-button{inset-inline-end:12px}
  .file-workspace .viewer-file-status{top:calc(16px + env(safe-area-inset-top));max-width:48%;font-size:.68rem}
  .file-workspace .viewer-reader-dock{
    bottom:calc(10px + env(safe-area-inset-bottom));
    width:max-content;
    max-width:calc(100% - 20px);
    grid-template-columns:repeat(4,50px);
    gap:5px;
    padding:5px;
    border-radius:999px;
  }
  .file-workspace .viewer-reader-dock button{width:50px;height:50px;min-width:50px}
  .file-workspace .viewer-dock-icon{width:42px;height:42px}
  .file-workspace .viewer-dock-icon svg{width:20px;height:20px}
  .file-workspace .immersive-file-stage[data-axis="horizontal"] .immersive-page,
  .file-workspace .office-workspace-stage[data-axis="horizontal"] .office-page-track>[data-office-page]{
    padding:calc(68px + env(safe-area-inset-top)) 0 calc(96px + env(safe-area-inset-bottom));
  }
  .file-workspace .viewer-sheet-backdrop{padding:0;align-items:end}
  .file-workspace .viewer-bottom-sheet{
    width:100%;max-height:84dvh;margin:0;border-left:0;border-right:0;border-bottom:0;border-radius:28px 28px 0 0;
    padding-bottom:env(safe-area-inset-bottom);
  }
}
@media(max-width:380px){
  .file-workspace .viewer-reader-dock{grid-template-columns:repeat(4,46px);gap:4px;padding:4px}
  .file-workspace .viewer-reader-dock button{width:46px;height:46px;min-width:46px}
  .file-workspace .viewer-dock-icon{width:39px;height:39px}
  .file-workspace .viewer-dock-icon svg{width:19px;height:19px}
}
@media(prefers-reduced-motion:reduce){
  .file-workspace .immersive-close,.file-workspace .reader-settings-button,.file-workspace .viewer-reader-dock{transition:none}
}