/* Stage 2 changes navigation geometry; stage 4 owns the full color redesign. */
@media screen {
html[data-upgrade="cocoa"] .container { overflow-x:clip!important;overflow-y:visible!important; }
.work-nav-region { --work-tab-width:140px;position:relative;min-width:0;margin-bottom:24px; }
html[data-upgrade="cocoa"][data-look] .shell-menu { display:flex!important;flex-wrap:nowrap!important;gap:0!important;align-items:stretch!important;overflow-x:auto;scrollbar-width:thin;padding:0 0 12px!important;margin:0!important; }
html[data-upgrade="cocoa"][data-look] .shell-group { display:grid!important;grid-template-columns:repeat(var(--group-size,2),var(--work-tab-width))!important;gap:8px!important;flex:0 0 auto;padding:0 12px!important;border-right:1px solid var(--ui-line)!important; }
html[data-upgrade="cocoa"][data-look] .shell-group:first-child { --group-size:3;padding-left:0!important; }
html[data-upgrade="cocoa"][data-look] .shell-group:nth-child(2) { --group-size:3; }
html[data-upgrade="cocoa"][data-look] .shell-group:last-child { border-right:0!important;padding-right:0!important; }
html[data-upgrade="cocoa"][data-look] .shell-group-name { font-weight:700!important;font-size:11px!important;letter-spacing:.03em;color:var(--ui-section-ink)!important;display:flex;align-items:center;gap:6px; }
html[data-upgrade="cocoa"][data-look] .shell-group-name::before { content:'';width:5px;height:5px;border-radius:50%;background:var(--ui-section-ink); }
html[data-upgrade="cocoa"][data-look] #shell-menu :is(.shell-direct,.shell-item,button.shell-item) { box-sizing:border-box;flex-direction:row;width:var(--work-tab-width)!important;min-width:var(--work-tab-width)!important;max-width:var(--work-tab-width)!important;height:52px!important;min-height:52px!important;padding:6px!important;gap:5px;font-weight:700!important;border-color:color-mix(in srgb,var(--ui-section-ink) 32%,var(--ui-section-panel))!important; }
html[data-upgrade="cocoa"][data-look] :is(.shell-direct,.shell-item) strong { font:700 14px/1.4 var(--ui-display-font)!important;letter-spacing:-.65px; }
html[data-upgrade="cocoa"] .shell-nav-icon { width:18px;height:18px;stroke-width:2; }
.work-nav-arrow { position:absolute;top:22px;z-index:3;width:28px;height:52px;border:1px solid var(--ui-line);background:var(--ui-surface);color:var(--ui-ink);font-size:23px;border-radius:6px;box-shadow:0 2px 8px #0001; }
.work-nav-arrow:first-child { left:0; }.work-nav-arrow:last-child { right:0; }
.work-nav-region:has(.work-nav-arrow:not([hidden])) { padding-inline:32px; }
.work-switch-trigger,.work-menu-close { border:1px solid var(--ui-line);border-radius:7px;background:var(--ui-surface);color:var(--ui-ink);padding:9px 12px;font:500 13px/1.5 var(--ui-font);white-space:nowrap;min-height:40px; }
.work-switch-trigger[hidden],.work-nav-arrow[hidden] { display:none!important; }
/* Strong, readable work controls without changing the main menu theme. */
html[data-upgrade="cocoa"] {
  --work-control-ink:var(--ui-accent);
  --work-control-border:var(--ui-control-line);
  --work-control-bg:var(--ui-header);
  --work-icon-menu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M4 5h16M4 12h16M4 19h16'/%3E%3C/svg%3E");
  --work-icon-expand:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 3H3v5m13-5h5v5M3 16v5h5m13-5v5h-5'/%3E%3C/svg%3E");
  --work-icon-collapse:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8h5V3m8 0v5h5M3 16h5v5m8 0v-5h5'/%3E%3C/svg%3E");
  --work-icon-close:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='m6 6 12 12M18 6 6 18'/%3E%3C/svg%3E");
}
html[data-upgrade="cocoa"] :is(.work-switch-trigger,.work-menu-close,#integration-fullscreen,#manual-fullscreen,.manual-tool[onclick="closeManual()"]) {
  display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;
  padding:8px 12px!important;border:1px solid var(--work-control-border)!important;border-radius:7px;
  color:var(--work-control-ink)!important;background:var(--work-control-bg)!important;font:500 13px/1.5 var(--ui-font)!important;
}
html[data-upgrade="cocoa"] #integration-host .integration-actions button,
html[data-upgrade="cocoa"] #manual-modal .manual-tools .manual-tool { min-height:42px;font-size:13px!important; }
html[data-upgrade="cocoa"] :is(.work-switch-trigger,.work-menu-close,#integration-fullscreen,#manual-fullscreen,.manual-tool[onclick="closeManual()"])::before {
  content:'';display:block;flex:0 0 18px;width:18px;height:18px;background:currentColor;
  -webkit-mask:var(--work-control-icon) center/contain no-repeat;mask:var(--work-control-icon) center/contain no-repeat;
}
.work-switch-trigger { --work-control-icon:var(--work-icon-menu); }
#integration-fullscreen,#manual-fullscreen { --work-control-icon:var(--work-icon-expand); }
.work-menu-close,.manual-tool[onclick="closeManual()"] { --work-control-icon:var(--work-icon-close); }
html[data-upgrade="cocoa"] :is(#integration-fullscreen,#manual-fullscreen)[aria-pressed="true"] {
  --work-control-icon:var(--work-icon-collapse);color:#fff!important;background:var(--work-control-ink)!important;border-color:var(--work-control-ink)!important;
}
html[data-upgrade="cocoa"] :is(.work-switch-trigger,.work-menu-close,#integration-fullscreen,#manual-fullscreen,.manual-tool[onclick="closeManual()"]):hover { background:var(--ui-accent-soft)!important;border-color:var(--work-control-ink)!important; }
html[data-upgrade="cocoa"] :is(#integration-fullscreen,#manual-fullscreen)[aria-pressed="true"]:hover { background:var(--ui-accent-hover)!important; }
html[data-upgrade="cocoa"] :is(.work-switch-trigger,.work-menu-close,#integration-fullscreen,#manual-fullscreen,.manual-tool[onclick="closeManual()"]):focus-visible { outline:3px solid var(--ui-accent)!important;outline-offset:3px; }
.work-menu-dialog { width:min(360px,calc(100vw - 24px));max-height:calc(100dvh - 32px);margin:16px 16px auto auto;padding:20px;border:1px solid var(--ui-line);border-radius:12px;background:var(--ui-surface);color:var(--ui-ink);overflow-y:auto;box-shadow:0 12px 40px #0003;font:14px/1.6 var(--ui-font); }
.work-menu-dialog::backdrop { background:#231b194d; }
.integration-leave-dialog { width:min(420px,calc(100vw - 32px));padding:24px;border:1px solid var(--ui-line);border-radius:12px;color:var(--ui-ink);background:var(--ui-surface);font:14px/1.7 var(--ui-font); }
.integration-leave-dialog::backdrop { background:#231b1966; }
.integration-leave-dialog h2 { font-size:18px;font-weight:600;margin:0 0 12px; }
.integration-leave-dialog > div { display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:20px; }
.integration-leave-dialog button { padding:9px 12px;min-height:40px;border:1px solid var(--ui-line);border-radius:7px;background:var(--ui-surface);color:var(--ui-ink);font:inherit; }
.integration-leave-dialog [data-stay] { border-color:var(--ui-accent);color:var(--ui-accent); }
.work-menu-head { display:flex;align-items:center;justify-content:space-between;gap:16px; }.work-menu-head h2 { font-size:18px;font-weight:600;margin:0; }
.work-menu-location { margin:12px 0 18px;color:var(--ui-muted);font-size:12px; }
.work-menu-dialog section + section { margin-top:16px; }.work-menu-dialog h3 { font-size:12px;color:var(--ui-muted);font-weight:500;margin:0 0 6px; }
.work-menu-item { display:flex;align-items:center;gap:10px;width:100%;padding:10px;border:1px solid transparent;border-radius:7px;min-height:44px;text-align:left;color:var(--ui-ink);background:transparent;font:500 14px/1.5 var(--ui-font); }
.work-menu-item small { margin-left:auto;font-size:12px; }.work-menu-item:disabled { color:var(--ui-muted);cursor:default; }
.work-menu-item svg { color:var(--ui-section-ink); }
.work-menu-item:disabled svg { color:var(--ui-muted); }
.work-menu-item:hover:not(:disabled),.work-menu-item[aria-current="page"] { background:var(--ui-accent-soft);border-color:var(--ui-accent); }
.work-menu-item[aria-current="page"]::after { content:'현재';margin-left:auto;color:var(--ui-accent);font-size:12px; }
html.work-menu-open { overflow:hidden!important; }
.course-workbar,.form-workbar { position:sticky;top:0;z-index:35;background:var(--ui-bg);padding:10px 0;border-bottom:1px solid var(--ui-line); }
html[data-upgrade="cocoa"][data-look] #course-detail { overflow:visible!important; }
.course-workbar-actions { display:flex;flex-wrap:wrap;align-items:center;gap:8px; }
.course-workbar { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px; }
.course-workbar .course-detail-top { grid-column:1;grid-row:1; }
.course-workbar-actions { grid-column:2;grid-row:1; }
.course-workbar #shell-sections { grid-column:1/-1;grid-row:2; }
.course-workbar .course-detail-top > div > div { display:none!important; }
.course-workbar .course-detail-top > div > .course-detail-title { display:block!important; }
html[data-upgrade="cocoa"][data-look] #course-detail .course-workbar .course-detail-top { position:static!important;padding:8px 0!important;border-bottom:0!important;min-height:0; }
.course-workbar .course-detail-top .progress-bar-container,.course-workbar #course-progress-text,.course-workbar #course-status-tag { display:none; }
html[data-upgrade="cocoa"][data-look] #course-detail .course-detail-title { font-size:18px!important; }
.course-workbar .course-nav-strip { display:none; }
html[data-upgrade="cocoa"] #shell-sections { position:static!important;margin:6px 0 0!important;padding:0!important;display:flex;flex-wrap:nowrap;overflow-x:auto; }
#shell-sections button { flex:none;white-space:nowrap;font-weight:500!important; }
#course-detail .detail-section { scroll-margin-top:calc(var(--workbar-height,140px) + 16px); }
.work-save-state { font:400 12px/1.5 var(--ui-font);color:var(--ui-muted); }
.form-workbar { display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px; }
.form-workbar .form-actions { display:flex;align-items:center;flex-wrap:wrap;margin:0;gap:6px; }.form-workbar .form-mode { margin:0; }
.form-workbar-title { margin:0;flex:1 1 180px;font-size:13px;font-weight:500; }
html[data-upgrade="cocoa"] #integration-host .integration-bar { padding:8px 0!important;margin:0!important;gap:8px!important; }
html[data-upgrade="cocoa"] #integration-host .integration-bar h2 { font-size:18px!important;font-weight:600!important; }
#integration-note { display:none; }#integration-host .integration-state { margin:8px 0; }
@media(max-width:760px) {
  .work-nav-region { display:none; }
  html[data-upgrade="cocoa"][data-look] .shell-menu { display:none!important; }
  .work-menu-dialog { margin:12px auto;max-height:calc(100dvh - 24px); }
  .course-workbar-actions .workspace-back { min-height:40px; }.course-workbar { padding:6px 0; }
  .course-workbar { grid-template-columns:1fr; }
  .course-workbar .course-detail-top { grid-row:1; }
  .course-workbar-actions { grid-column:1;grid-row:2;gap:6px; }
  .course-workbar #shell-sections { grid-row:3; }
  .course-workbar .work-save-state { flex-basis:100%; }
  .form-workbar { display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px; }
  .form-workbar-title { grid-row:1;grid-column:1/-1; }
  .form-workbar .form-actions { grid-column:1/-1;grid-row:2;flex-wrap:nowrap; }
  .form-workbar .form-mode { grid-column:1/-1;grid-row:3; }
  .form-workbar button,.form-workbar summary { min-height:40px; }
  #integration-host .integration-bar { flex-wrap:wrap; }
  #integration-host .integration-actions { gap:6px; }
  #integration-host .integration-actions { display:flex;flex-wrap:wrap;width:100%; }
}
}
@media print { .work-nav-region,.work-switch-trigger,.work-menu-dialog,.course-workbar,.form-workbar { display:none!important; } }

/* One stable global bar. Page tools stay below it; no button is reparented on scroll. */
@media screen {
html.has-global-tools { --shell-global-height:72px;scrollbar-gutter:stable;scroll-padding-top:calc(var(--shell-global-height) + 16px); }
html.has-global-tools body { padding-top:var(--shell-global-height)!important; }
.shell-globalbar { position:fixed;inset:0 0 auto;z-index:11000;background:var(--ui-header);border-bottom:1px solid var(--ui-line); }
html[data-upgrade="cocoa"] .shell-globalbar .header { display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:20px;width:100%;max-width:var(--ui-shell-width);min-height:88px!important;margin:0 auto!important;padding:14px var(--ui-shell-gutter)!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important; }
html[data-upgrade="cocoa"] .shell-globalbar .header-layout { display:flex;align-items:center;gap:14px;flex:1 1 auto;min-width:0; }
html[data-upgrade="cocoa"] .shell-globalbar .header-center { min-width:0; }
html[data-upgrade="cocoa"] .shell-globalbar .header-center h1 { margin:0!important;font-family:var(--ui-display-font)!important;font-size:30px!important;font-weight:700!important;line-height:1.35!important;color:var(--ui-ink)!important;letter-spacing:-1.2px!important; }
html[data-upgrade="cocoa"] .shell-globalbar h1::before { display:none!important; }
.shell-brand-mark { display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:13px;background:var(--ui-accent-soft);color:var(--ui-accent);border:1px solid #d9c8b8; }
.shell-brand-mark svg { width:36px;height:36px; }
.shell-current-location { margin:3px 0 0!important;color:var(--ui-muted);font:400 12px/1.5 var(--ui-font); }
.shell-global-actions { display:flex;align-items:center;gap:8px;flex:none; }
html[data-upgrade="cocoa"] .shell-global-actions :is(.shell-manual,.work-switch-trigger) { display:inline-flex!important;position:static!important;align-items:center;justify-content:center;gap:8px;width:116px;min-width:116px;height:42px;min-height:42px;box-sizing:border-box;padding:8px 10px!important;border:1px solid var(--ui-control-line)!important;border-radius:8px!important;background:var(--ui-header)!important;color:var(--ui-accent)!important;box-shadow:none!important;transform:none!important;font:500 13px/1.5 var(--ui-font)!important; }
html[data-upgrade="cocoa"] .shell-global-actions .shell-manual svg { display:block!important;width:18px;height:18px;stroke-width:2.2; }
html[data-upgrade="cocoa"] .shell-global-actions button:hover,
html[data-upgrade="cocoa"] .shell-global-actions button[aria-expanded="true"] { background:var(--ui-accent-soft)!important;border-color:var(--ui-accent)!important; }
html[data-upgrade="cocoa"] .shell-global-actions button:focus-visible { outline:3px solid var(--ui-accent)!important;outline-offset:3px; }
.has-global-tools .work-nav-region { margin-top:16px; }
.has-global-tools .work-menu-dialog { width:min(384px,calc(100vw - 24px));margin:calc(var(--shell-global-height) + 8px) max(16px,calc((100vw - 1600px)/2 + 28px)) 16px auto;max-height:calc(100dvh - var(--shell-global-height) - 24px);border-color:var(--ui-line);background:var(--ui-header);color:var(--ui-ink);box-shadow:0 12px 32px #46362d24; }
.has-global-tools .work-menu-dialog::backdrop { background:#352a252b; }
.work-menu-search-label { display:block;font-size:12px;font-weight:500;color:var(--ui-muted);margin-bottom:4px; }
.work-menu-search { display:block;width:100%;box-sizing:border-box;padding:10px 12px;min-height:42px;margin-bottom:16px;border:1px solid var(--ui-control-line);border-radius:8px;background:white;color:var(--ui-ink);font:400 14px/1.5 var(--ui-font); }
.work-menu-search:focus-visible { outline:3px solid var(--ui-accent);outline-offset:2px; }
.work-menu-empty { margin:16px 0;color:var(--ui-muted); }
.work-menu-item[hidden],.work-menu-dialog section[hidden],.work-menu-empty[hidden] { display:none!important; }
.has-global-tools .work-menu-item { color:var(--ui-ink);font:700 14px/1.5 var(--ui-display-font);background:var(--ui-section-panel);margin-top:6px;border-color:color-mix(in srgb,var(--ui-section-ink) 32%,var(--ui-section-panel)); }
.has-global-tools .work-menu-item:disabled { color:var(--ui-muted); }
.has-global-tools .work-menu-item:hover:not(:disabled) { background:var(--ui-section-panel);border-color:var(--ui-section-ink); }
.has-global-tools .work-menu-item[aria-current="page"] { background:var(--ui-section-ink);border-color:var(--ui-section-ink);color:white; }
.has-global-tools .work-menu-item[aria-current="page"]::after,.has-global-tools .work-menu-item[aria-current="page"] svg { color:white; }
.has-global-tools .work-menu-item:disabled { background:var(--ui-section-soft);border-style:dashed; }
.has-global-tools .course-workbar,.has-global-tools .form-workbar,
.has-global-tools #integration-host .integration-bar { top:var(--shell-global-height); }
.has-global-tools #integration-host.is-full { top:var(--shell-global-height);height:calc(100dvh - var(--shell-global-height)); }
.has-global-tools #integration-host.is-full .integration-bar { top:0; }
html.has-global-tools[data-upgrade="cocoa"] .manual-modal { top:var(--shell-global-height);height:calc(100dvh - var(--shell-global-height)); }
html.has-global-tools[data-upgrade="cocoa"] .manual-modal .manual-content { height:100%!important;max-height:100%;min-height:0; }
.has-global-tools #course-detail .detail-section { scroll-margin-top:calc(var(--shell-global-height) + var(--workbar-height,140px) + 16px); }
@media(max-width:760px) {
  html[data-upgrade="cocoa"] .shell-globalbar .header { padding:10px 12px!important;flex-wrap:wrap;gap:8px; }
  html[data-upgrade="cocoa"] .shell-globalbar .header-layout { flex-basis:100%; }
  html[data-upgrade="cocoa"] .shell-globalbar .header-center h1 { font-size:22px!important;letter-spacing:-1px!important; }
  html[data-upgrade="cocoa"] .shell-globalbar .header-layout { gap:10px; }
  .shell-brand-mark { width:34px;height:38px;border-radius:9px; }.shell-brand-mark svg { width:28px;height:28px; }
  .shell-current-location { font-size:10px; }
  .shell-global-actions { margin-left:auto; }
  .has-global-tools .work-menu-dialog { margin:calc(var(--shell-global-height) + 8px) 12px 12px auto; }
}
}
@media print { .shell-globalbar { display:none!important; }html.has-global-tools body { padding-top:0!important; } }

/* Common menu appearance is independent of the current workspace. */
@media screen {
html[data-upgrade="cocoa"] { --work-menu-surface:#efe6db;--work-menu-line:#d5c5b5; }
/* One family of menu surfaces. Small group markers carry the category color. */
html[data-upgrade="cocoa"][data-look] body #shell-menu :is(.shell-direct,.shell-item,button.shell-item) {
  background:var(--work-menu-surface)!important;border-color:#d5c5b5!important;
  color:var(--ui-ink)!important;border-radius:8px!important;
}
html[data-upgrade="cocoa"][data-look] body #shell-menu :is(.shell-direct,.shell-item) strong {
  font:700 14px/1.45 var(--ui-display-font)!important;letter-spacing:-.3px;font-synthesis:none;
}
html[data-upgrade="cocoa"][data-look] body #shell-menu .shell-nav-icon { color:var(--ui-accent); }
html[data-upgrade="cocoa"][data-look] body #shell-menu :is(.shell-direct,.shell-item,button.shell-item).is-pending {
  background:#f5f1ec!important;color:var(--ui-muted)!important;border-style:dashed!important;
}
html[data-upgrade="cocoa"][data-look] body #shell-menu :is(.shell-direct,.shell-item):hover:not([aria-current="page"]):not(.is-pending) {
  background:#e7d9ca!important;border-color:var(--ui-accent)!important;box-shadow:none!important;
}
html[data-upgrade="cocoa"][data-look] body #shell-menu :is(.shell-direct,.shell-item,button.shell-item)[aria-current="page"] {
  background:var(--ui-accent)!important;border-color:var(--ui-accent)!important;color:white!important;box-shadow:0 2px 4px #51392a18!important;
}
html[data-upgrade="cocoa"][data-look] body #shell-menu [aria-current="page"] .shell-nav-icon { color:white; }
html[data-upgrade="cocoa"][data-look] body .work-menu-item {
  background:var(--work-menu-surface);border-color:var(--work-menu-line);font:700 14px/1.5 var(--ui-display-font);font-synthesis:none;
}
html[data-upgrade="cocoa"][data-look] body .work-menu-item:hover:not(:disabled) { background:#e7d9ca; }
html[data-upgrade="cocoa"][data-look] body .work-menu-item:disabled { background:#f5f1ec; }
html[data-upgrade="cocoa"][data-look] body .work-menu-item[aria-current="page"] { background:var(--ui-accent);color:white;border-color:var(--ui-accent); }

html[data-upgrade="cocoa"][data-look] #shell-menu { border-bottom-color:var(--work-menu-line)!important; }
html[data-upgrade="cocoa"][data-look] #shell-menu .shell-group { border-right-color:var(--work-menu-line)!important; }
}