/* JIYOU 타이포그래피·모션 시스템 (2026-09-15).
   역할별 크기·굵기·자간과 네 단계 모션을 한 곳에서 정의한다. 마지막에 로드되어 화면별 예외를 덮는다.
   인쇄물과 발표 문서 본문은 대상이 아니다. */
@media screen{

/* ---------- 1. 렌더링 ---------- */
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
:is(.workspace,.entry) :is(h1,h2,h3,h4){text-wrap:balance;font-feature-settings:"kern"}
:is(.workspace,.entry) :is(p,li,dd,.hub-caption,.hub-empty){text-wrap:pretty}
:is(.workspace,.entry) :is(time,kbd,.hub-stats strong,.date-stamp,.cal-range,.cal-mini-grid,.hub-hour,.month-count,td,.news-list-item time,.news-article time,[data-library-page],.news-pagination,.hub-task-row time,.hub-comment small,.hub-row small,.office-notification small,.cal-status,.cal-event-meta,.hub-meta dd){font-variant-numeric:tabular-nums}

/* ---------- 2. 제목 위계 ---------- */
:is(.workspace,.entry) h1{font-weight:var(--w-bold);letter-spacing:var(--ls-display);line-height:var(--lh-largetitle)}
.workspace main .page-heading h1,.workspace main .hub-heading h1,.workspace main [data-privacy] h1,.workspace h1{font-size:var(--page-title,32px);font-weight:var(--w-bold);line-height:var(--lh-largetitle);letter-spacing:var(--ls-display);margin:0 0 8px}
.workspace main :is(.page-heading,.hub-heading) .eyebrow{font-size:var(--t-footnote);font-weight:var(--w-medium);line-height:1.5;letter-spacing:0}
.workspace main :is(.page-heading>p,.hub-heading>div>p):not(.eyebrow){font-size:var(--t-ui);font-weight:var(--w-regular);line-height:var(--lh-body);letter-spacing:var(--ls-body)}
.workspace .office-home-title .eyebrow{font-size:var(--t-subhead);font-weight:var(--w-medium);color:var(--ink-2);font-variant-numeric:tabular-nums}

.workspace :is(.hub-panel,.card,.hub-section-title,.office-jump-heading,.guide-head,.cal-panel-title,.office-discard-dialog) h2,.workspace .office-dashboard .hub-section-title h2,.workspace .hub-panel h2,.workspace main>.card h2{font-size:var(--t-title2);font-weight:var(--w-semibold);line-height:var(--lh-title);letter-spacing:var(--ls-heading)}
.workspace :is(.hub-panel,.card) h3,.workspace .office-form-section,.workspace .hub-form .office-form-section,.workspace .hub-google-row h3,.workspace .workspace-connection-item :is(h2,h3),.guide-steps strong{font-size:var(--t-title3);font-weight:var(--w-semibold);line-height:1.4;letter-spacing:var(--ls-title3)}
.workspace .office-presentation h2,.workspace .feature-card h2,.workspace .office-dashboard .office-presentation h2{font-size:var(--t-title1);font-weight:var(--w-bold);line-height:1.3;letter-spacing:var(--ls-title1)}
.workspace .library-group h2,.workspace .quick-card h2{font-size:var(--t-title3);font-weight:var(--w-semibold);line-height:1.4;letter-spacing:var(--ls-title3)}
.workspace .library-group h2 small{font-size:var(--t-footnote);font-weight:var(--w-regular);letter-spacing:0}
.workspace .cal-toolbar .cal-range{font-weight:var(--w-semibold);letter-spacing:var(--ls-heading);line-height:1.3}
.workspace .cal-rail>h2{font-size:var(--t-title2);font-weight:var(--w-semibold)}
.workspace .news-article h1{font-size:28px;font-weight:var(--w-bold);line-height:1.35;letter-spacing:var(--ls-title)}
.workspace .news-list .news-list-item h2{font-size:var(--t-title3);font-weight:var(--w-semibold);line-height:1.45;letter-spacing:var(--ls-title3)}
.workspace .news-sources h2{font-size:var(--t-title3);font-weight:var(--w-semibold)}
.workspace .staff-directory .member h2{font-size:var(--t-title3);font-weight:var(--w-semibold);line-height:1.4;letter-spacing:var(--ls-title3)}
.workspace .office-audit summary{font-size:var(--t-title3);font-weight:var(--w-semibold)}
.workspace .cal-detail form>h2{font-size:var(--t-headline);font-weight:var(--w-semibold)}
.workspace .briefing-body h3{font-weight:var(--w-semibold)}
.workspace .briefing-body h4{font-weight:var(--w-semibold)}
.workspace .briefing-title{font-weight:var(--w-bold)}

/* ---------- 3. 목록 행: 제목 semibold, 보조 정보는 색으로 ---------- */
.workspace .hub-row strong,.workspace .task-row-content strong,.workspace .office-launchers strong,.workspace .library-item strong,.workspace .workspace-product>summary strong,.workspace .office-order-row strong,.workspace .news-list-item h2 a,.workspace .office-account-panel .account-name strong,.workspace .flow-card-body strong{font-weight:var(--w-semibold);letter-spacing:var(--ls-body)}
.workspace .hub-row strong,.workspace .task-row-content strong{font-size:var(--t-headline);line-height:var(--lh-ui)}
.workspace .hub-row small,.workspace .task-row-content small,.workspace .hub-task-row time,.workspace .office-launchers small,.workspace .library-item small,.workspace .office-product-state,.workspace .workspace-product>summary small,.workspace .hub-comment small,.workspace .news-list-item time,.workspace .news-article time,.workspace .hub-history,.workspace .cal-status,.workspace .cal-muted,.workspace .cal-help,.workspace .cal-identity{font-weight:var(--w-regular);letter-spacing:0}
.workspace .hub-task-row time,.workspace .task-row-content time{font-size:var(--t-footnote);color:var(--ink-2)}
.workspace .office-notification .hub-link{font-size:var(--t-headline);font-weight:var(--w-medium);line-height:var(--lh-ui);letter-spacing:var(--ls-body)}
.workspace .office-dashboard .office-home-primary .task-row-content strong{font-size:var(--t-headline)}
.workspace .hub-meta{font-size:var(--t-subhead)}
.workspace .hub-meta dt{font-weight:var(--w-medium);color:var(--ink-3)}
.workspace .hub-meta dd{font-weight:var(--w-regular)}
.workspace .hub-prose,.workspace .prose,.workspace .news-article .prose,.workspace .news-article .briefing-body{font-weight:var(--w-regular);letter-spacing:var(--ls-body)}
.workspace .guide-steps p,.workspace .guide-lead,.workspace .guide-note,.workspace .guide-more{font-weight:var(--w-regular)}
.workspace .hub-empty{font-weight:var(--w-regular)}

/* 통계 숫자 */
.workspace .hub-stats>a>span{font-size:var(--t-subhead);font-weight:var(--w-medium);letter-spacing:0}
.workspace .hub-stats strong{font-size:32px;font-weight:var(--w-bold);line-height:1.1;letter-spacing:var(--ls-title1);font-variant-numeric:tabular-nums}
.workspace .date-stamp strong{font-weight:var(--w-semibold)}

/* 배지·칩 */
.workspace .hub-badge,.workspace .badge,.workspace .urgency-badge,.workspace .login-label,.workspace .guide-where span,.workspace .month-count,.workspace .field-required{font-size:var(--t-caption);font-weight:var(--w-medium);line-height:1.35;letter-spacing:var(--ls-badge)}
.workspace .field-required{font-weight:var(--w-regular)}
.workspace .hub-filters a,.workspace .hub-filters>span,.workspace .hub-filters button,.workspace [data-review-filter],.workspace .library-tools button,.workspace .library-display-tools button,.workspace .cal-views a{font-size:var(--t-subhead);font-weight:var(--w-medium);letter-spacing:0}
.workspace .hub-filters a[aria-current=page],.workspace .hub-filters button[aria-pressed=true],.workspace [data-review-filter][aria-pressed=true],.workspace .library-tools button[aria-pressed=true],.workspace .library-display-tools button[aria-pressed=true],.workspace .cal-views a[aria-current=page]{font-weight:var(--w-semibold)}

/* ---------- 4. 탐색 ---------- */
.workspace .sidebar nav a,.workspace .office-menu-links>a,.workspace .work-area-nav a,.workspace .office-jump nav a,.workspace .mobile-management nav a{font-size:var(--t-ui);font-weight:var(--w-medium);letter-spacing:0;line-height:var(--lh-ui)}
.workspace .sidebar nav a[aria-current=page],.workspace .office-menu-links>a[aria-current=page],.workspace .work-area-nav a[aria-current=page]{font-weight:var(--w-semibold)}
.workspace .nav-label,.office-menu-links h3,.workspace .cal-target-label{font-size:var(--t-caption);font-weight:var(--w-medium);letter-spacing:var(--ls-label);line-height:1.3;color:var(--ink-2)}
.workspace .sidebar .brand span,.entry .brand span{font-size:var(--t-footnote);font-weight:var(--w-medium);letter-spacing:0}
.workspace .sidebar-bottom p{font-size:var(--t-caption);font-weight:var(--w-regular);letter-spacing:var(--ls-label);line-height:1.7}
.workspace .sidebar-bottom small{font-size:var(--t-footnote);letter-spacing:0}
.workspace .header-caption{font-size:var(--t-subhead);font-weight:var(--w-regular);letter-spacing:0}
.workspace .office-jump-trigger kbd,.workspace .cal-new kbd{font-family:inherit;font-size:11px;font-weight:var(--w-medium);letter-spacing:.02em}
.workspace .mobile-tabbar :is(a,button){font-weight:var(--w-medium)}
.workspace .mobile-tabbar .nav-text{font-size:var(--t-caption);font-weight:var(--w-medium);letter-spacing:var(--ls-badge);line-height:1.2}
.workspace .mobile-tabbar a[aria-current=page],.workspace .mobile-tabbar a[aria-current=page] .nav-text{font-weight:var(--w-semibold)}
.workspace .office-account-panel .account-name small{font-size:var(--t-footnote);font-weight:var(--w-regular)}
.workspace .office-account-link,.workspace .office-account-panel .quiet{font-weight:var(--w-medium)}

/* ---------- 5. 컨트롤 ---------- */
.workspace :is(button,.button,.hub-button):where(:not(.library-item):not(.hub-link):not(.quiet)),.entry :is(button,.button),.workspace .library-slide-link,.workspace .library-print-link,.workspace .hub-button.secondary{font-size:var(--t-headline);font-weight:var(--w-semibold);letter-spacing:var(--ls-body);line-height:var(--lh-ui)}
.workspace button.quiet,.workspace .office-inline-action,.workspace :is(.hub-heading>a:not(.hub-button),.hub-section-title>a,.office-back,.calendar-choice>a,.library-group-actions>a,.news-read,.news-back,.cal-text-link,.cal-rail-links a){font-weight:var(--w-medium);letter-spacing:0}
.workspace .hub-section-title>a,.workspace .library-group-actions>a,.workspace .news-read{font-size:var(--t-subhead)}
.workspace .cal-toolbar :is(button,a),.workspace .cal-date-nav a,.workspace .cal-jump button,.workspace .cal-staff button{font-weight:var(--w-medium)}
.workspace .cal-new{font-weight:var(--w-semibold)}
.workspace .library-bulk-selection button,.workspace .library-card-select{font-size:var(--t-footnote);font-weight:var(--w-medium)}
.workspace :is(label,.hub-field label,.hub-form p>label,.hub-stack label,.office-search label,.office-task-form label,.cal-form-area .hub-form label,.cal-quick-form .hub-field label){font-size:var(--t-subhead);font-weight:var(--w-medium);letter-spacing:0;line-height:1.5;color:var(--ink-2)}
.workspace .hub-field small,.workspace .hint,.workspace .hub-caption,.workspace .news-result,.workspace .presentation-library>[data-library-status],.workspace .office-delivery-note,.workspace .office-order-preview>p,.workspace .guide-eyebrow,.workspace .office-jump .hub-caption,.workspace .errorlist{font-size:var(--t-footnote);font-weight:var(--w-regular);letter-spacing:0;line-height:1.55}
.workspace .errorlist{font-weight:var(--w-medium)}
.workspace :is(input:not([type=checkbox]):not([type=radio]),select,textarea){font-weight:var(--w-regular);letter-spacing:var(--ls-body)}
.workspace summary,.workspace .office-extra-fields>summary,.workspace .office-member-controls summary,.workspace .office-import>summary,.workspace .workspace-more>summary,.workspace .office-manual-resource>summary,.workspace .cal-date-picker summary,.workspace .cal-help summary{font-size:var(--t-headline);font-weight:var(--w-semibold);letter-spacing:var(--ls-body)}
.workspace .workspace-connections>summary{font-size:var(--t-subhead)}
.workspace .workspace-connections>summary strong{font-weight:var(--w-semibold)}
.workspace .workspace-more>summary small{font-weight:var(--w-regular)}
.workspace table{font-size:var(--t-subhead)}
.workspace th{font-size:var(--t-footnote);font-weight:var(--w-medium);letter-spacing:var(--ls-badge)}
.workspace .notice{font-size:var(--t-subhead);font-weight:var(--w-regular);line-height:1.55}
.workspace .notice strong{font-weight:var(--w-semibold)}
.workspace footer,.entry footer{font-size:var(--t-caption);font-weight:var(--w-regular);letter-spacing:0;color:var(--ink-3)}
.workspace .office-navigation-status,.workspace .cal-feedback{font-size:var(--t-subhead);font-weight:var(--w-medium)}
.workspace .office-product-mark{font-size:var(--t-caption);font-weight:var(--w-semibold);letter-spacing:var(--ls-badge)}
.workspace .office-cover strong{font-weight:var(--w-semibold);letter-spacing:var(--ls-title3)}
.workspace .invite-steps{font-size:var(--t-subhead)}

/* 헤더 알약 버튼·보조 동작·타일 제목 */
.workspace .page-shell>header :is(.office-sidebar-toggle,.office-jump-trigger,.office-account>summary,.mobile-management summary){font-size:var(--t-subhead);font-weight:var(--w-medium);letter-spacing:0;line-height:var(--lh-ui)}
.workspace .office-form-actions>a,.workspace .hub-form .office-form-actions>a{font-size:var(--t-ui);font-weight:var(--w-medium)}
.workspace .directory-label{font-size:var(--t-footnote);font-weight:var(--w-medium);letter-spacing:var(--ls-label);color:var(--ink-2)}
.workspace .office-launchers>a strong{font-size:var(--t-headline);line-height:var(--lh-ui)}

/* 캘린더 격자 */
.workspace .cal-main .hub-day>h2{font-size:var(--t-footnote);font-weight:var(--w-medium);letter-spacing:0}
.workspace .cal-main .hub-day.today>h2{font-weight:var(--w-semibold)}
.workspace .cal-main .hub-event strong{font-size:var(--t-subhead);font-weight:var(--w-semibold);letter-spacing:var(--ls-body)}
.workspace .cal-main .hub-event time,.workspace .cal-main .hub-event span{font-size:var(--t-caption);font-weight:var(--w-medium);letter-spacing:0}
.workspace .hub-hour{font-weight:var(--w-medium)}
.workspace .cal-selection-preview{font-weight:var(--w-semibold)}
.workspace .cal-overlap-summary{font-weight:var(--w-medium)}
.workspace .cal-mini>strong{font-weight:var(--w-semibold)}
.workspace .cal-mini-grid>span{font-weight:var(--w-medium)}

/* ---------- 6. 로그인·진입 ---------- */
.entry .welcome h1{font-size:var(--t-display);font-weight:var(--w-bold);line-height:var(--lh-display);letter-spacing:var(--ls-display)}
.entry .welcome .eyebrow{font-size:var(--t-footnote);font-weight:var(--w-medium);letter-spacing:0}
.entry .lead{font-size:var(--t-title3);font-weight:var(--w-regular);line-height:1.65;letter-spacing:var(--ls-body)}
.entry .login-services span{font-size:var(--t-caption);font-weight:var(--w-medium);letter-spacing:var(--ls-label);font-variant-numeric:tabular-nums}
.entry .login-services strong{font-size:var(--t-headline);font-weight:var(--w-semibold);letter-spacing:var(--ls-body)}
.entry .login-services p,.entry .login-help p{font-size:var(--t-subhead);font-weight:var(--w-regular)}
.entry .login-label{font-size:var(--t-caption);font-weight:var(--w-medium);letter-spacing:var(--ls-badge)}
.entry .login-card h2{font-size:22px;font-weight:var(--w-semibold);line-height:var(--lh-title);letter-spacing:var(--ls-heading)}
.entry .login-card p{font-size:var(--t-ui);font-weight:var(--w-regular)}
.entry .login-help strong{font-size:var(--t-headline);font-weight:var(--w-semibold)}
.entry .google-button{font-size:var(--t-body);font-weight:var(--w-semibold)}
.entry .hint{font-size:var(--t-footnote);font-weight:var(--w-regular)}
.entry .hint .symbol{margin-top:.15em}
.entry .card.narrow h1{font-size:26px;font-weight:var(--w-bold);line-height:1.3;letter-spacing:var(--ls-title)}
.entry .card.narrow label{font-size:var(--t-subhead);font-weight:var(--w-medium)}
.entry .notice{font-size:var(--t-subhead);font-weight:var(--w-regular)}

/* ---------- 7. 포커스 ---------- */
.workspace :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible,.entry :is(a,button,input,select,textarea,summary):focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
/* Route changes focus the page title for reading order, not as an interactive control. */
.workspace #content h1[tabindex="-1"]:focus{outline:none}
.workspace :is(input:not([type=checkbox]):not([type=radio]),select,textarea):focus-visible,.entry :is(input:not([type=checkbox]),select,textarea):focus-visible{outline-offset:0;border-color:var(--focus-ring)}
.workspace :is(button,.hub-button,.button),.workspace .sidebar nav a,.workspace .mobile-tabbar :is(a,button),.workspace .work-area-nav a,.workspace .hub-filters a,.workspace .hub-row,.workspace .library-item,.workspace .office-launchers>a,.workspace .hub-stats>a,.workspace summary{-webkit-tap-highlight-color:transparent}
.workspace :is(button,.hub-button,.button),.workspace .sidebar nav a,.workspace .mobile-tabbar :is(a,button),.workspace .work-area-nav a,.workspace summary{user-select:none;-webkit-user-select:none}

/* ---------- 8. 모션 0단계: 눌림 ---------- */
.workspace :is(button,.button,.hub-button):not(.hub-link):not(.library-item):not(:disabled),.entry :is(button,.button):not(:disabled),.workspace .library-slide-link,.workspace .library-print-link,.workspace .hub-filters a,.workspace .cal-views a,.workspace .cal-date-nav a,.workspace .office-home-settings,.workspace .news-read{transition:transform var(--dur-press) var(--ease-out),background-color var(--dur-state) var(--ease-standard),border-color var(--dur-state) var(--ease-standard),color var(--dur-state) var(--ease-standard),box-shadow var(--dur-state) var(--ease-standard),opacity var(--dur-state) var(--ease-standard),filter var(--dur-press) var(--ease-out)}
.workspace :is(button,.button,.hub-button):not(.hub-link):not(.library-item):not(:disabled):active,.entry :is(button,.button):not(:disabled):active,.workspace .library-slide-link:active,.workspace .library-print-link:not(:disabled):active,.workspace .hub-filters a:active,.workspace .cal-views a:active,.workspace .cal-date-nav a:active,.workspace .office-home-settings:active{transform:scale(var(--press-scale));transition-duration:var(--dur-press)}
.workspace :is(button,.hub-button):active{filter:brightness(.96)}
.workspace .hub-link:active{opacity:.6}
.workspace :is(.hub-row,.library-item,.office-launchers>a,.hub-stats>a,.news-list-item,.workspace-product>summary,.office-menu-links>a,.office-jump nav a,.mobile-management nav a,.cal-mini-grid>a){transition:background-color var(--dur-state) var(--ease-standard),border-color var(--dur-state) var(--ease-standard),box-shadow var(--dur-state) var(--ease-standard),transform var(--dur-press) var(--ease-out),color var(--dur-state) var(--ease-standard)}
.workspace :is(.library-item,.office-launchers>a,.hub-stats>a,.office-menu-links>a):active{transform:scale(var(--press-scale-card))}
.workspace :is(.hub-row,.news-list-item,.workspace-product>summary):active{background-color:var(--fill-tint)}
.workspace .hub-row:active{border-radius:10px}
.workspace .hub-link{transition:opacity var(--dur-press) var(--ease-out)}
.workspace .office-inline-action,.workspace :is(.hub-heading>a,.hub-section-title>a,.office-back,.calendar-choice>a,.library-group-actions>a,.news-back,.cal-text-link,.cal-rail-links a),.workspace footer a,.entry footer a,.workspace .news-list-item h2 a{transition:opacity var(--dur-press) var(--ease-out),color var(--dur-state) var(--ease-standard)}
.workspace .office-inline-action:active,.workspace :is(.hub-heading>a,.hub-section-title>a,.office-back,.calendar-choice>a,.library-group-actions>a,.news-back,.cal-text-link,.cal-rail-links a):active,.workspace footer a:active,.workspace .news-list-item h2 a:active{opacity:.55}
.workspace .hub-form input[type=checkbox],.workspace input[type=checkbox],.workspace input[type=radio]{transition:transform var(--dur-press) var(--ease-out)}
.workspace input[type=checkbox]:active,.workspace input[type=radio]:active{transform:scale(.9)}

/* ---------- 9. 모션 1단계: 상태·선택 ---------- */
.workspace .sidebar nav a,.workspace .mobile-tabbar :is(a,button),.workspace .work-area-nav a,.workspace .office-account>summary,.workspace .mobile-management summary,.workspace .office-jump-trigger,.workspace .office-sidebar-toggle{transition:background-color var(--dur-state) var(--ease-standard),color var(--dur-state) var(--ease-standard),border-color var(--dur-state) var(--ease-standard),box-shadow var(--dur-state) var(--ease-standard),transform var(--dur-press) var(--ease-out),font-weight var(--dur-state) var(--ease-standard)}
.workspace .sidebar nav a:active,.workspace .mobile-tabbar :is(a,button):active,.workspace .work-area-nav a:active{transform:scale(.96)}
.workspace .mobile-tabbar .nav-icon,.workspace .sidebar nav a .nav-icon{transition:transform var(--dur-state) var(--ease-spring),stroke-width var(--dur-state) var(--ease-standard)}
.workspace .mobile-tabbar a[aria-current=page] .nav-icon{transform:translateY(-1px)}
.workspace :is(input:not([type=checkbox]):not([type=radio]),select,textarea),.entry :is(input:not([type=checkbox]),select,textarea){transition:border-color var(--dur-state) var(--ease-standard),box-shadow var(--dur-state) var(--ease-standard),background-color var(--dur-state) var(--ease-standard)}
.workspace :is(.hub-badge,.badge){transition:background-color var(--dur-state) var(--ease-standard),color var(--dur-state) var(--ease-standard)}
.workspace .workspace-product>summary::after,.workspace .mobile-management summary::after,.workspace .workspace-connections>summary:before,.workspace .workspace-product>summary:before{transition:transform var(--dur-state) var(--ease-spring)}
.workspace .library-select-card .library-item{transition:outline-color var(--dur-state) var(--ease-standard),border-color var(--dur-state) var(--ease-standard),transform var(--dur-press) var(--ease-out)}
.workspace .hub-calendar.month .hub-day-add{transition:opacity var(--dur-state) var(--ease-standard)}
.workspace .cal-main .hub-event{transition:box-shadow var(--dur-state) var(--ease-standard),transform var(--dur-press) var(--ease-out)}
.workspace .cal-saving{transition:opacity var(--dur-state) var(--ease-standard)}
@supports (interpolate-size:allow-keywords){
 :root{interpolate-size:allow-keywords}
 .workspace :is(.workspace-product,.workspace-connections,.workspace-more,.office-member-controls,.office-import,.office-audit,.office-extra-fields,.office-manual-resource,.office-delivery-note,.cal-date-picker,.cal-help,.office-news-body,.hub-history)::details-content{height:0;overflow:clip;transition:height var(--dur-state) var(--ease-standard),content-visibility var(--dur-state) allow-discrete}
 .workspace :is(.workspace-product,.workspace-connections,.workspace-more,.office-member-controls,.office-import,.office-audit,.office-extra-fields,.office-manual-resource,.office-delivery-note,.cal-date-picker,.cal-help,.office-news-body,.hub-history)[open]::details-content{height:auto}
}

/* ---------- 10. 모션 2단계: 계층(대화상자·시트·팝오버) ---------- */
dialog::backdrop{opacity:0;transition:opacity var(--dur-backdrop) var(--ease-standard),overlay var(--dur-backdrop) allow-discrete,display var(--dur-backdrop) allow-discrete}
dialog[open]::backdrop{opacity:1}
@starting-style{dialog[open]::backdrop{opacity:0}}
.workspace .office-account-panel,.workspace .mobile-management nav{transform-origin:top right;animation:office-popover var(--dur-layer) var(--ease-spring) both}
.workspace .mobile-management nav{transform-origin:top left}
@keyframes office-popover{from{opacity:0;transform:translateY(-6px) scale(.96)}to{opacity:1;transform:none}}
.workspace .office-navigation-status:not([hidden]),.workspace .cal-feedback{animation:office-toast var(--dur-layer) var(--ease-spring) both}
@keyframes office-toast{from{opacity:0;transform:translate(-50%,10px) scale(.96)}to{opacity:1;transform:translate(-50%,0)}}
.workspace .notice{animation:office-notice var(--dur-page) var(--ease-out) both}
@keyframes office-notice{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* ---------- 11. 모션 3단계: 화면 전환 ---------- */
@supports (view-transition-name:none){
 .workspace #content{view-transition-name:office-content}
 .workspace .sidebar nav a[aria-current=page]{view-transition-name:office-nav-current}
 .workspace .mobile-tabbar a[aria-current=page]{view-transition-name:office-tab-current}
 .workspace .work-area-nav a[aria-current=page]{view-transition-name:office-segment-current}
 .workspace .page-shell>header{view-transition-name:office-header}
 .workspace .sidebar{view-transition-name:office-sidebar}
 .workspace .mobile-tabbar{view-transition-name:office-tabbar}
 ::view-transition-group(*){animation-duration:var(--dur-page);animation-timing-function:var(--ease-standard)}
 ::view-transition-group(office-nav-current),::view-transition-group(office-tab-current),::view-transition-group(office-segment-current){animation-duration:300ms;animation-timing-function:var(--ease-spring)}
 ::view-transition-old(office-nav-current),::view-transition-new(office-nav-current),::view-transition-old(office-tab-current),::view-transition-new(office-tab-current),::view-transition-old(office-segment-current),::view-transition-new(office-segment-current){animation:none;mix-blend-mode:normal;height:100%}
 ::view-transition-old(office-header),::view-transition-new(office-header),::view-transition-old(office-sidebar),::view-transition-new(office-sidebar),::view-transition-old(office-tabbar),::view-transition-new(office-tabbar){animation:none}
 ::view-transition-old(office-content){animation:office-content-out 140ms var(--ease-in) both}
 ::view-transition-new(office-content){animation:office-content-in var(--dur-page) var(--ease-out) both}
 @keyframes office-content-out{to{opacity:0;transform:translateY(-4px)}}
 @keyframes office-content-in{from{opacity:0;transform:translateY(8px)}}
}

/* ---------- 12. 동작 감소·강제 색상 ---------- */
@media(prefers-reduced-motion:reduce){
 html,.workspace,.entry{--dur-press:0ms;--dur-state:0ms;--dur-layer:0ms;--dur-layer-exit:0ms;--dur-backdrop:0ms;--dur-page:0ms}
 dialog::backdrop,.workspace .office-account-panel,.workspace .mobile-management nav,.workspace .office-navigation-status,.workspace .cal-feedback,.workspace .notice,.workspace *::details-content{animation:none!important;transition:none!important}
 ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
 .workspace :is(button,.button,.hub-button,.library-item,.office-launchers>a,.hub-stats>a,.office-menu-links>a,.sidebar nav a,.mobile-tabbar a,.mobile-tabbar button,.work-area-nav a,.hub-filters a,.cal-views a,.cal-date-nav a):active,.entry :is(button,.button):active{transform:none!important}
}
@media(forced-colors:active){
 .workspace :is(a,button,input,select,textarea,summary):focus-visible,.entry :is(a,button,input,select,textarea,summary):focus-visible{outline:2px solid Highlight}
}

/* ---------- 13. 반응형 크기 ---------- */
@media(max-width:800px){
 .workspace .hub-stats strong{font-size:26px}
 .workspace .office-presentation h2,.workspace .office-dashboard .office-presentation h2{font-size:22px}
 .workspace .news-article h1{font-size:24px}
 .workspace .library-group h2{font-size:var(--t-title3)}
 .entry .login-card h2{font-size:20px}
}

/* ---------- 14. HIG 감사 반영 (2026-09-15) ---------- */
/* 대비: 12–13px 보조 글자는 4.5:1 이상 */
.workspace footer,.entry footer{color:var(--ink-footer)}
.workspace .nav-label,.office-menu-links h3,.workspace .cal-target-label{color:var(--ink-tertiary)}
.workspace .hub-badge{color:var(--ink-3)}
.workspace .hub-field small,.workspace .hub-row small,.workspace .hub-comment small,.workspace .hub-caption,.workspace .news-result,.workspace .cal-muted{color:var(--ink-secondary)}
/* 터치 타깃: 계정 패널·짧은 링크·목록 제목 링크 */
.workspace .office-account-panel :is(a,button){min-height:44px;box-sizing:border-box}
.workspace .office-form-actions>a,.workspace .hub-form .office-form-actions>a{min-width:44px;padding-inline:12px;justify-content:center}
.workspace .news-list-item h2 a{display:flex;align-items:center;min-height:44px;margin-block:-10px}
/* 모서리 체계: 패널 28 · 카드 24 · 타일 20 · 컨트롤 16 · 소형 12 · 배지 8, 캡슐은 999 */
.workspace .card,.workspace .hub-form.card,.workspace .hub-panel,.workspace main>.card,.workspace .office-home-sections>.card,.workspace .office-dashboard .card,.workspace .news-list,.workspace .news-article,.workspace .calendar-workspace,.workspace .calendar-workspace .cal-main,.workspace .workspace-product,.workspace .office-audit{border-radius:var(--radius-card)}
.workspace .hub-stats>a,.workspace .office-dashboard .hub-stats>a,.workspace .office-launchers>a,.workspace .library-item,.workspace .office-settings-panel,.workspace .workspace-connections,.workspace .workspace-more{border-radius:var(--radius-tile)}
.workspace .office-extra-fields,.workspace .office-member-controls,.workspace .office-form-actions,.workspace .office-task-form .office-form-actions,.workspace .guide-note,.workspace .office-multiselect,.workspace .office-order-row,.workspace .workspace-connection-item,.workspace .home-layout-preview span,.workspace .notice,.workspace .office-cover{border-radius:var(--radius-control)}
.workspace .table-wrap,.workspace .library-thumbnail,.workspace .office-product-mark,.workspace .codes li{border-radius:var(--radius-small)}
.workspace .hub-badge,.workspace .badge,.workspace .urgency-badge,.workspace .office-jump-trigger kbd,.workspace .cal-new kbd,.workspace .login-label{border-radius:var(--radius-badge)}
.workspace .directory-label{border-radius:0}
.workspace .office-multiselect input[type=search]{border-radius:10px}
/* 검색 필드·세그먼트·도구줄 묶음은 캡슐, 안쪽도 캡슐(동심) */
.workspace .office-search input:not([type=hidden]),.workspace .library-tools input[type=search],.workspace .cal-search input,.workspace .cal-jump input{border-radius:var(--radius-pill);padding-inline:16px;margin:0}
.workspace .work-area-nav,.workspace .cal-views,.workspace .cal-date-nav,.workspace .library-display-tools{border-radius:var(--radius-pill);padding:4px;gap:2px}
.workspace .work-area-nav a,.workspace .cal-views a,.workspace .cal-date-nav a,.workspace .library-display-tools button{border-radius:var(--radius-pill)}
.workspace .cal-date-nav{display:inline-flex;align-items:center;background:var(--fill-tint);border:1px solid var(--rule);padding:2px}
.workspace .cal-date-nav a{border:0;background:transparent;min-width:44px;min-height:44px;height:auto;padding:0 12px;color:var(--ink-2);font-size:var(--t-subhead)}
.workspace .cal-date-nav a:first-child,.workspace .cal-date-nav a:last-child{font-size:20px;line-height:1}
.workspace .cal-date-nav a:hover,.workspace .cal-date-nav a:focus-visible{background:var(--surface)}
.workspace .cal-jump button,.workspace .cal-staff button,.workspace .cal-filter-toggle,.workspace .cal-mobile-new{background:var(--surface);color:var(--accent);border:1px solid var(--rule-strong);border-radius:var(--radius-pill);padding-inline:14px;font-size:var(--t-subhead);font-weight:var(--w-medium)}
.workspace .cal-jump{gap:8px}
.workspace .cal-toolbar :is(.cal-menu){border-radius:var(--radius-pill)}
/* Liquid Glass: 탐색 계층만 유리. 위쪽 반사광과 얇은 테두리로 두께를 표현하고 콘텐츠 계층은 불투명 유지 */
.workspace .sidebar,.workspace .page-shell>header,.entry header,.workspace .mobile-tabbar{border:1px solid var(--glass-rim);box-shadow:inset 0 1px 0 var(--glass-highlight),inset 0 -1px 0 var(--shadow-ambient),0 1px 2px var(--shadow-ambient),0 10px 30px var(--shadow-key);-webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%)}
.workspace .mobile-tabbar{border-radius:var(--radius-pill);padding:6px}
.workspace .mobile-tabbar :is(a,button){border-radius:var(--radius-pill)}
.workspace .mobile-tabbar a[aria-current=page]{box-shadow:inset 0 1px 0 var(--glass-rim),0 1px 2px var(--shadow-key)}
/* 유리 컨트롤은 눌리면 밝아지며 살짝 커진다 */
.workspace .mobile-tabbar :is(a,button):active{transform:scale(1.06);background:var(--glass-3);box-shadow:0 2px 8px var(--shadow-key)}
.workspace .sidebar nav a:active{transform:none;background:var(--fill-tint)}
/* 선택된 목적지는 채워진 심볼 */
/* 스크롤 가장자리 효과: 떠 있는 탭바 아래에서 콘텐츠가 점진적으로 흐려지며 사라진다 */
@media(max-width:800px){
 body.workspace:not(:has(.calendar-workspace)):not(.calendar-focus)::after{content:"";position:fixed;left:0;right:0;bottom:0;height:calc(92px + env(safe-area-inset-bottom,0px));pointer-events:none;z-index:29;background:linear-gradient(to top,var(--edge-fade) 0,transparent 100%);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);-webkit-mask-image:linear-gradient(to top,#000 35%,transparent);mask-image:linear-gradient(to top,#000 35%,transparent)}
 .workspace .calendar-dialog,.workspace .cal-detail{border-radius:var(--radius-panel) var(--radius-panel) 0 0}
}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){
 body.workspace::after{display:none}
 .workspace .sidebar,.workspace .page-shell>header,.entry header,.workspace .mobile-tabbar{-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}
}
@media(prefers-reduced-motion:reduce){.workspace .mobile-tabbar :is(a,button):active{transform:none!important}}
@media(forced-colors:active){body.workspace::after{display:none}.workspace .cal-date-nav{border:1px solid ButtonText}}

/* ---------- 15. HIG 조사 반영: 유리 두께 계층, 시트, 탐색 행, 휴대폰 본문 크기 ---------- */
/* 유리는 큰 요소일수록 불투명하다: 사이드바 > 헤더 > 탭바 */
.workspace .sidebar{background:var(--glass)}
.workspace .page-shell>header,.entry header{background:var(--glass-2)}
.workspace .mobile-tabbar{background:var(--glass-3)}
/* 목록의 탐색 행은 chevron으로 이동을 알린다 */
.workspace a.hub-row,.workspace .hub-panel a.hub-row,.workspace .task-index a.hub-task-row,.workspace .office-dashboard .office-home-primary a.hub-task-row,.workspace .office-dashboard .office-home-sections a.hub-row{position:relative;padding-right:24px}
.workspace a.hub-row::after{content:"›";position:absolute;right:2px;top:50%;transform:translateY(-50%);font-size:22px;line-height:1;color:var(--ink-3);font-weight:var(--w-regular)}
.workspace a.hub-row:hover::after,.workspace a.hub-row:active::after{color:var(--ink-2)}
@media(max-width:800px){
 /* iOS 본문 기본 크기에 맞춰 휴대폰에서는 행 제목·본문을 한 단계 키운다 */
 .workspace{--t-headline:16px;--t-ui:16px;--t-body:17px}
 /* 하단 시트는 화면 가장자리에서 띄우고 네 모서리를 둥글게 */
 .workspace .calendar-dialog:not(.cal-quick-dialog),.workspace .cal-detail{position:fixed;inset:auto 8px calc(8px + env(safe-area-inset-bottom,0px)) 8px;width:auto;max-width:none;margin:0;border-radius:var(--radius-panel);border:1px solid var(--rule);box-shadow:0 24px 60px -24px var(--shadow-deep);max-height:min(88dvh,calc(100dvh - 16px));height:auto}
 .workspace .cal-detail{height:min(88dvh,calc(100dvh - 16px))}
 .workspace a.hub-row{padding-right:20px}
}

/* ---------- 16. 시각 검수 보정 ---------- */
.workspace .cal-jump input[type=date]{width:176px;padding-inline:12px 8px}
.workspace a.hub-row::after{right:4px}
@media(max-width:800px){
 .workspace a.hub-row,.workspace .hub-panel a.hub-row,.workspace .task-index a.hub-task-row,.workspace .office-dashboard .office-home-primary a.hub-task-row,.workspace .office-dashboard .office-home-sections a.hub-row{padding-right:30px}
 .workspace a.hub-row::after{right:6px}
 /* 휴대폰 캘린더: 컨트롤 한 줄, 기간 제목은 그 아래 한 줄 */
 .workspace .cal-toolbar .cal-range{order:4;flex:1 1 100%;margin:2px 0 0;font-size:20px}
 .workspace .cal-toolbar .cal-mobile-new{margin-left:auto}
 .workspace .cal-date-nav a{padding:0 8px}
}

/* ---------- 17. 접근성 감사 반영: 일정 카드 글자 대비 ---------- */
.workspace .cal-main .hub-event{color:var(--ok-ink)}
.workspace .cal-main .hub-event.kind-visit{color:var(--warn-ink)}
.workspace .cal-main .hub-event.kind-meeting{color:var(--violet-ink)}
.workspace .cal-main .hub-event.kind-google{color:var(--info-ink)}
.workspace .cal-main .hub-event.kind-absence{color:var(--violet-ink)}
.workspace .cal-main .hub-event span,.workspace .cal-main .hub-event time{opacity:1;color:inherit}

/* ---------- 18. 아이콘 체계: 24 그리드·1.75 획·둥근 끝, 채움(ic-body)·안쪽 선(ic-cut)·항상 선(ic-line) ---------- */
.nav-icon,.symbol{display:block;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.nav-icon{width:22px;height:22px}
.symbol{display:inline-block;width:1.05em;height:1.05em;stroke-width:2;vertical-align:-.16em}
.ic-body,.ic-cut,.ic-line{fill:none}
.ic-solid{fill:currentColor;stroke:none}
.ic-checkmark-square .ic-cut{stroke:var(--on-accent)}
.ic-exclamation-circle{color:var(--warn-ink)}
.workspace .sidebar nav a[aria-current=page] .nav-icon,.workspace .work-area-nav a[aria-current=page] .nav-icon,.workspace .office-menu-links>a[aria-current=page] .nav-icon{stroke-width:2.1}
.workspace .sidebar nav a[aria-current=page] .ic-body,.workspace .work-area-nav a[aria-current=page] .ic-body,.workspace .office-menu-links>a[aria-current=page] .ic-body{fill:currentColor;fill-opacity:.16}
.workspace .mobile-tabbar .nav-icon{width:22px;height:22px;flex-basis:22px;stroke-width:1.75}
.workspace .mobile-tabbar a[aria-current=page] .nav-icon{stroke-width:1.9}
.workspace .mobile-tabbar a[aria-current=page] .ic-body{fill:currentColor;fill-opacity:1}
.workspace .mobile-tabbar a[aria-current=page] .ic-cut{stroke:var(--fill-tint)}
.work-area-nav .nav-icon{width:19px;height:19px;flex-basis:19px;stroke-width:2}
.workspace .office-sidebar-toggle .symbol,.workspace .cal-menu .symbol{width:18px;height:18px}
.workspace .cal-date-nav .symbol,.workspace .cal-mini-nav .symbol,.workspace .cal-mobile-new .symbol,.workspace .hub-day-add .symbol{width:18px;height:18px;vertical-align:middle}
.workspace .round-arrow .symbol{width:20px;height:20px}
.workspace .empty-symbol .symbol{width:24px;height:24px;stroke-width:1.75}
.workspace .hub-check button .nav-icon{width:22px;height:22px;color:var(--accent)}
.workspace .hub-check button .ic-square .ic-body{stroke:var(--rule-strong)}
.workspace .hub-button .symbol,.entry .google-button .symbol,.workspace .library-slide-link .symbol{margin-inline-start:.1em}
.entry .login-arrow{display:inline-flex}
.workspace .office-stat-overdue>span>.symbol{width:18px;height:18px;vertical-align:-.25em}
.workspace .office-launchers strong .symbol{color:var(--ink-2)}
.workspace .office-dashboard .office-stat-overdue>span>span[aria-hidden]{display:none}
/* 목록 행·접힘 요약의 disclosure는 마스크 chevron */
.workspace a.hub-row::after{content:"";width:16px;height:16px;background:currentColor;color:var(--ink-3);font-size:0;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E") center/contain no-repeat}
.workspace .workspace-product>summary::after{content:"";width:18px;height:18px;flex:none;background:currentColor;color:var(--ink-2);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform var(--dur-state) var(--spring-gentle)}
.workspace .workspace-product[open]>summary::after{transform:rotate(180deg)}
.workspace .workspace-product>summary:before,.workspace .workspace-connections>summary:before{content:none}
.workspace .mobile-management summary::after{content:"";display:inline-block;width:16px;height:16px;margin-left:6px;vertical-align:-3px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E") center/contain no-repeat}
.workspace .calendar-resize{font-size:0;line-height:0}
.workspace .hub-event:hover .calendar-resize::before{content:"";position:absolute;inset:0;margin:auto;width:16px;height:12px;background:var(--ink-2);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 10h12M6 14h12'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 10h12M6 14h12'/%3E%3C/svg%3E") center/contain no-repeat}
.workspace .cal-panel-title button{width:auto;min-width:44px;min-height:44px;padding-inline:14px;font-size:var(--t-subhead);font-weight:var(--w-medium);border-radius:var(--radius-pill);background:var(--surface);border:1px solid var(--rule-strong);color:var(--accent)}

/* ---------- 19. 모션 정밀화: Apple 스프링(duration·bounce) 곡선, 포인터별 눌림, 진행 표시줄 ---------- */
:root{--spring-gentle:linear(0, 0.006 1.2%, 0.026 2.8%, 0.057 4.2%, 0.096 5.8%, 0.191 8.8%, 0.514 18%, 0.613 21.2%, 0.698 24.5%, 0.765 27.5%, 0.825 30.8%, 0.873 34%, 0.914 37.5%, 0.946 41.2%, 0.971 45.5%, 0.989 50.2%, 1 55.5%, 1.005 60.8%, 1.006 67.2%, 1);--spring-bouncy:linear(0, 0.001 0.5%, 0.008 1.2%, 0.029 2.5%, 0.062 3.8%, 0.113 5.2%, 0.216 7.8%, 0.594 16%, 0.702 18.8%, 0.787 21.2%, 0.858 23.8%, 0.92 26.5%, 0.967 29.2%, 1.001 32%, 1.022 34.5%, 1.036 37%, 1.044 39.8%, 1.046 42.8%, 1.042 47.2%, 1.014 61.3%, 1.003 70.2%, 0.998 81.2%, 1);--spring-smooth:linear(0, 0.004 1%, 0.019 2.2%, 0.043 3.5%, 0.08 5%, 0.163 7.8%, 0.461 16.8%, 0.555 20%, 0.636 23.2%, 0.705 26.5%, 0.767 30%, 0.821 33.8%, 0.863 37.5%, 0.901 42%, 0.931 46.8%, 0.955 52.2%, 0.972 58.5%, 0.984 65.5%, 0.992 74%, 0.997 84.8%, 1);--ease-decel:cubic-bezier(.05,.7,.1,1);--ease-accel:cubic-bezier(.3,0,.8,.15);--ease-sheet:cubic-bezier(.32,.72,0,1)}
/* 눌림: 빠르게 들어가고(100ms) 스프링으로 돌아온다(420ms). 터치는 손가락이 가리므로 더 크게 줄이고 밝기 변화는 생략 */
.workspace :is(button,.button,.hub-button):where(:not(.hub-link):not(.library-item):not(:disabled)),.entry :is(button,.button):not(:disabled),.workspace .library-slide-link,.workspace .library-print-link,.workspace .hub-filters a,.workspace .cal-views a,.workspace .cal-date-nav a,.workspace .office-home-settings{transition:transform 420ms var(--spring-gentle),filter 200ms var(--ease-out),background-color var(--dur-state) var(--ease-standard),border-color var(--dur-state) var(--ease-standard),color var(--dur-state) var(--ease-standard),box-shadow var(--dur-state) var(--ease-standard),opacity var(--dur-state) var(--ease-standard)}
.workspace :is(button,.button,.hub-button):where(:not(.hub-link):not(.library-item):not(:disabled)):active,.entry :is(button,.button):not(:disabled):active,.workspace .library-slide-link:active,.workspace .library-print-link:not(:disabled):active,.workspace .hub-filters a:active,.workspace .cal-views a:active,.workspace .cal-date-nav a:active,.workspace .office-home-settings:active{transform:scale(.98);filter:brightness(.94);transition:transform 100ms var(--ease-out),filter 100ms var(--ease-out),background-color var(--dur-state) var(--ease-standard),border-color var(--dur-state) var(--ease-standard),color var(--dur-state) var(--ease-standard)}
@media(pointer:coarse){
 .workspace :is(button,.button,.hub-button):where(:not(.hub-link):not(.library-item):not(:disabled)):active,.entry :is(button,.button):not(:disabled):active,.workspace .hub-filters a:active,.workspace .cal-views a:active{transform:scale(.96);filter:none;transition-duration:80ms}
}
/* 행: 누르는 즉시 채우고 떼면 180ms에 걷힌다 */
.workspace :is(.hub-row,.news-list-item,.workspace-product>summary,.office-menu-links>a,.office-jump nav a){transition:background-color 180ms var(--ease-out),border-color var(--dur-state) var(--ease-standard),color var(--dur-state) var(--ease-standard)}
.workspace :is(.hub-row,.news-list-item,.workspace-product>summary,.office-menu-links>a,.office-jump nav a):active{transition:none;background-color:var(--fill-tint)}
/* 타일·카드: 정밀 포인터에서만 1px 떠오른다 */
@media(hover:hover) and (pointer:fine){
 .workspace :is(.library-item,.office-launchers>a,.hub-stats>a,.quick-card,.feature-card){transition:transform 150ms var(--ease-out),box-shadow 150ms var(--ease-out),border-color var(--dur-state) var(--ease-standard),background-color var(--dur-state) var(--ease-standard)}
 .workspace :is(.library-item,.office-launchers>a,.hub-stats>a,.quick-card,.feature-card):hover{transform:translateY(-1px);box-shadow:0 2px 6px var(--shadow-ambient),0 10px 24px var(--shadow-key)}
 .workspace :is(.library-item,.office-launchers>a,.hub-stats>a):active{transform:translateY(0) scale(.985);transition-duration:100ms}
}
/* 탭 선택 시 심볼이 한 번 튄다(SF Symbols bounce) */
@keyframes office-symbol-bounce{0%{scale:1}35%{scale:1.18}70%{scale:.96}100%{scale:1}}
.workspace .mobile-tabbar a.is-just-selected .nav-icon{animation:office-symbol-bounce 400ms var(--ease-out)}
/* 접힘: 열릴 때 감속, 닫힐 때 가속 */
@supports (interpolate-size:allow-keywords){
 .workspace :is(.workspace-product,.workspace-connections,.workspace-more,.office-member-controls,.office-import,.office-audit,.office-extra-fields,.office-manual-resource,.office-delivery-note,.cal-date-picker,.cal-help,.office-news-body,.hub-history)::details-content{transition:height 200ms var(--ease-accel),content-visibility 200ms allow-discrete}
 .workspace :is(.workspace-product,.workspace-connections,.workspace-more,.office-member-controls,.office-import,.office-audit,.office-extra-fields,.office-manual-resource,.office-delivery-note,.cal-date-picker,.cal-help,.office-news-body,.hub-history)[open]::details-content{transition:height 300ms var(--ease-decel),content-visibility 300ms allow-discrete}
}
/* 소프트 내비게이션 진행 표시줄 */
.office-progress{position:fixed;top:0;left:0;height:2px;width:0;background:var(--action,var(--accent));z-index:120;border-radius:0 2px 2px 0;box-shadow:0 0 8px color-mix(in srgb,var(--accent) 45%,transparent);transition:width 200ms linear,opacity 220ms var(--ease-out);pointer-events:none}
.office-progress[hidden]{display:none}
@media(prefers-reduced-motion:reduce){
 :root{--spring-gentle:var(--ease-out);--spring-bouncy:var(--ease-out);--spring-smooth:var(--ease-out)}
 .workspace .mobile-tabbar a.is-just-selected .nav-icon{animation:none}
 .workspace :is(.library-item,.office-launchers>a,.hub-stats>a,.quick-card,.feature-card):hover{transform:none}
 .workspace .workspace-product>summary::after{transition:none}
}

/* ---------- 20. 리뷰 반영: 체크리스트 행, 파일 입력, 뒤로 가기, 레일 제목, 확인 대화상자 ---------- */
.workspace .hub-check{display:flex;align-items:center;gap:8px;min-height:44px;margin:0;padding:0}
.workspace .hub-check button.quiet{width:44px;min-width:44px;min-height:44px;padding:0;border:0;background:transparent;box-shadow:none;color:var(--rule-strong)}
.workspace .hub-check button.quiet[aria-pressed=true]{color:var(--accent)}
.workspace .hub-check button.quiet:disabled{opacity:.7}
.workspace .hub-check>span{font-size:var(--t-ui);line-height:var(--lh-ui)}
.workspace input[type=file]{display:block;width:100%;min-height:0;padding:4px 0;border:0;background:transparent;box-shadow:none;font-size:var(--t-subhead);color:var(--ink-secondary)}
.workspace input[type=file]::file-selector-button{font:inherit;font-size:var(--t-subhead);font-weight:var(--w-medium);min-height:40px;padding:8px 14px;margin-right:12px;border:1px solid var(--rule-strong);border-radius:var(--radius-pill);background:var(--surface);color:var(--accent);cursor:pointer;transition:background-color var(--dur-state) var(--ease-standard)}
.workspace input[type=file]::file-selector-button:hover{background:var(--fill-tint)}
.workspace .office-back,.workspace .news-back{display:inline-flex;align-items:center;gap:2px;min-height:44px;margin:0 0 4px;color:var(--office-green,var(--accent));font-size:var(--t-ui);font-weight:var(--w-medium)}
.workspace .office-back .symbol,.workspace .news-back .symbol{width:1.1em;height:1.1em}
.workspace .cal-rail-title{margin:8px 0 12px;font-size:var(--t-title2);font-weight:var(--w-semibold);line-height:var(--lh-title);letter-spacing:var(--ls-heading)}
.workspace .cal-source-title{margin:0;font-size:var(--t-caption);font-weight:var(--w-medium);letter-spacing:var(--ls-label);color:var(--ink-3)}
.office-discard-dialog p{margin:0;color:var(--ink-secondary,var(--ink-2));font-size:var(--t-ui);line-height:var(--lh-body)}
.workspace .hub-caption:empty{display:none}
/* 제품 행 상태 글자: 요약의 small 규칙보다 구체적으로 */
.workspace .workspace-product>summary small.office-product-state{font-size:var(--t-footnote);color:var(--office-secondary);letter-spacing:0}

/* ---------- 21. 로그인: 현장을 향한 아침 ---------- */
.entry .login-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(360px,440px);gap:40px;align-items:center;max-width:1240px;margin:0 auto;padding:32px 4vw 48px;min-height:calc(100vh - 153px)}
.entry .welcome{padding:0;background:transparent;border:0}
.entry .site-stage{position:relative;margin:0 0 24px;border-radius:var(--radius-panel);overflow:hidden;border:1px solid var(--glass-rim);box-shadow:inset 0 1px 0 var(--glass-highlight),0 1px 2px var(--shadow-ambient),0 18px 44px var(--shadow-deep);background:var(--fill-tint);animation:login-rise 500ms var(--spring-gentle) both}
.entry .site-scene{display:block;width:100%;height:auto;aspect-ratio:16/9}
.entry .scene-lines{stroke:var(--accent)}
.entry .scene-clouds{animation:scene-drift 40s linear infinite}
@keyframes scene-drift{from{transform:translateX(0)}to{transform:translateX(24px)}}
.entry .scene-hook{transform-box:fill-box;transform-origin:50% 0;animation:scene-sway 6s ease-in-out infinite}
@keyframes scene-sway{0%,100%{transform:rotate(-2.5deg)}50%{transform:rotate(2.5deg)}}
.entry .scene-crane>path:nth-child(3),.entry .scene-crane>path:nth-child(4){transform-box:fill-box;transform-origin:39% 100%}
.entry .scene-beam{transform-box:fill-box;transform-origin:100% 15%;animation:scene-sweep 8s ease-in-out infinite}
@keyframes scene-sweep{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(10deg)}}
.entry .scene-sensor .ping{transform-box:fill-box;transform-origin:center;animation:scene-ping 3s var(--ease-out) infinite;opacity:0}
.entry .scene-sensor:nth-child(2) .ping{animation-delay:1s}
.entry .scene-sensor:nth-child(3) .ping{animation-delay:2s}
@keyframes scene-ping{0%{transform:scale(1);opacity:.7}70%{transform:scale(4.2);opacity:0}100%{transform:scale(4.2);opacity:0}}
.entry .scene-sun{animation:scene-glow 5s ease-in-out infinite}
@keyframes scene-glow{0%,100%{fill-opacity:.9}50%{fill-opacity:.65}}
.entry .welcome .eyebrow{font-size:var(--t-footnote);font-weight:var(--w-medium);color:var(--action);margin:0 0 10px;animation:login-rise 500ms 60ms var(--spring-gentle) both}
.entry .welcome h1{margin:0 0 14px;color:var(--ink);animation:login-rise 500ms 120ms var(--spring-gentle) both}
.entry .welcome h1::first-line{color:var(--action)}
.entry .lead{margin:0 0 20px;max-width:34em;animation:login-rise 500ms 180ms var(--spring-gentle) both}
.entry .site-strip{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 22px;padding:0;animation:login-rise 500ms 240ms var(--spring-gentle) both}
.entry .site-strip>div{display:flex;align-items:center;gap:8px;min-height:40px;padding:6px 14px;border-radius:var(--radius-pill);background:var(--glass-2);border:1px solid var(--glass-rim);box-shadow:inset 0 1px 0 #fff,0 1px 2px var(--shadow-ambient);font-size:var(--t-subhead)}
.entry .site-strip dt{margin:0;font-size:var(--t-caption);font-weight:var(--w-medium);letter-spacing:var(--ls-label);color:var(--ink-tertiary)}
.entry .site-strip dd{margin:0;font-weight:var(--w-medium);color:var(--ink);font-variant-numeric:tabular-nums}
.entry .login-services{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none;animation:login-rise 500ms 300ms var(--spring-gentle) both}
.entry .login-services li{display:grid;gap:8px;padding:16px 16px 18px;border-radius:var(--radius-tile);background:var(--glass-3);border:1px solid var(--glass-rim);box-shadow:inset 0 1px 0 #fff,0 1px 2px var(--shadow-ambient)}
.entry .login-services .nav-icon{color:var(--action);width:24px;height:24px}
.entry .login-services strong{font-size:var(--t-headline);font-weight:var(--w-semibold);letter-spacing:var(--ls-body);color:var(--ink)}
.entry .login-services p{margin:0;font-size:var(--t-footnote);line-height:1.55;color:var(--ink-secondary)}
.entry .login-side{padding:0;display:block}
.entry .login-card{max-width:none;padding:32px;border-radius:var(--radius-panel);background:var(--glass-rim);border:1px solid var(--glass-highlight);box-shadow:inset 0 1px 0 #fff,0 2px 5px var(--shadow-ambient),0 24px 60px var(--shadow-deep);animation:login-rise 500ms 90ms var(--spring-gentle) both}
.entry .login-mark{display:block;width:96px;height:auto;margin:0 0 18px}
.entry .login-label{display:inline-block;margin:0 0 14px}
.entry .login-card h2{margin:0 0 6px}
.entry .login-card>p{margin:0 0 20px}
.entry .login-card form{margin:0 0 20px}
.entry .google-button{width:100%;min-height:52px;justify-content:flex-start;gap:12px;padding-inline:16px 18px;border:1px solid var(--rule-strong);background:var(--surface);box-shadow:inset 0 1px 0 #fff,0 1px 2px var(--shadow-ambient),0 6px 16px var(--shadow-ambient)}
.entry .google-mark{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--surface);border:1px solid var(--rule);flex:none}
.entry .google-mark svg{display:block}
.entry .login-arrow{margin-left:auto;color:var(--action)}
.entry .login-help{margin:0;padding:18px 0 0;border-top:1px solid var(--rule)}
.entry .login-help strong{display:block;margin:0 0 10px}
.entry .login-steps{margin:0 0 10px;padding:0;list-style:none;display:grid;gap:8px}
.entry .login-steps li{display:flex;gap:10px;align-items:flex-start;font-size:var(--t-subhead);line-height:1.55;color:var(--ink-secondary)}
.entry .login-steps li span{display:inline-grid;place-items:center;flex:none;width:22px;height:22px;border-radius:50%;background:var(--fill-tint);color:var(--action);font-size:var(--t-caption);font-weight:var(--w-semibold);font-variant-numeric:tabular-nums}
.entry .login-help>p{margin:0;font-size:var(--t-footnote);color:var(--ink-tertiary)}
.entry .hint{display:flex;align-items:flex-start;gap:6px;margin:16px 0 0;font-size:var(--t-footnote)!important;color:var(--ink-tertiary)}
.entry .hint .symbol{color:var(--ink-tertiary)}
@keyframes login-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-width:1100px){.entry .login-layout{grid-template-columns:minmax(0,1fr) minmax(320px,400px);gap:28px;padding:24px 24px 40px}}
@media(max-width:800px){
 .entry .login-layout{display:flex;flex-direction:column;gap:24px;padding:16px 16px 40px;min-height:0}
 .entry .login-side{order:-1}
 .entry .login-card{padding:24px}
 .entry .site-stage{margin:0 0 18px}
 .entry .welcome h1{font-size:28px}
 .entry .login-services{grid-template-columns:1fr;gap:8px}
 .entry .login-services li{grid-template-columns:24px minmax(0,1fr);grid-template-rows:auto auto;column-gap:12px;row-gap:2px;padding:14px 16px}
 .entry .login-services .nav-icon{grid-row:1/3;align-self:start;margin-top:2px}
 .entry .site-strip>div{min-height:36px;padding:4px 12px;font-size:var(--t-footnote)}
}
@media(prefers-reduced-motion:reduce){
 .entry .site-stage,.entry .welcome .eyebrow,.entry .welcome h1,.entry .lead,.entry .site-strip,.entry .login-services,.entry .login-card{animation:none}
 .entry .scene-clouds,.entry .scene-hook,.entry .scene-beam,.entry .scene-sensor .ping,.entry .scene-sun{animation:none}
 .entry .scene-sensor .ping{opacity:.35;transform:scale(2.4)}
}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){.entry .login-card,.entry .site-strip>div,.entry .login-services li{background:var(--surface)}}

/* ---------- 22. 상단 흰 띠 제거: 루트 배경이 body 배경의 캔버스 전파를 막고, 헤더 여백이 body까지 붕괴돼 html 색이 20px 드러났다 ---------- */
html{background:none}
.workspace .page-shell,.entry .page-shell{display:flow-root}

/* ---------- 23. 화면 전수 검토 반영: 중복 로고, 큰 제목 축소, 접힘 표시기 통일, 배치 결함 ---------- */
/* PC에서는 사이드바가 브랜드를 보여 주므로 헤더 로고는 사이드바를 접었을 때만 */
@media(min-width:801px){.workspace .office-mobile-brand{display:none}.workspace.office-nav-collapsed .office-mobile-brand{display:inline-flex}}
.workspace .page-shell>header .office-sidebar-toggle{width:44px;min-width:44px;padding:0;justify-content:center;gap:0;border-radius:var(--radius-pill)}
.workspace .office-sidebar-toggle .symbol{width:20px;height:20px}
/* 헤더 캡션 = 축소된 큰 제목: h1이 헤더 아래로 사라질 때만 나타난다 */
.workspace .header-caption{opacity:0;transform:translateY(4px);transition:opacity var(--dur-state) var(--ease-standard),transform var(--dur-state) var(--ease-standard);font-size:var(--t-headline);font-weight:var(--w-semibold);color:var(--ink);letter-spacing:var(--ls-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.workspace.title-collapsed .header-caption{opacity:1;transform:none}
/* 홈 보조 카드는 내용 높이만큼만 */
.workspace .office-dashboard .office-home-sections{align-items:start}
/* 날짜 헤더의 요일 띄어쓰기(flex 안에서 공백이 접힘) */
.workspace .hub-day-weekday{margin-left:.3em}
/* 체크박스 필드: 체크박스가 라벨 앞에 온다 */
.workspace .hub-field:has(>input[type=checkbox])>input[type=checkbox]{order:-1}
.workspace .hub-field:has(>input[type=checkbox])>label{margin:0}
/* 접힘 요약: 기본 ▶ 마커 대신 오른쪽 chevron 하나로 통일 */
.workspace details:not(.office-account):not(.mobile-management):not(.workspace-product)>summary{list-style:none;display:flex;align-items:center;gap:8px;cursor:pointer}
.workspace details:not(.office-account):not(.mobile-management):not(.workspace-product)>summary::-webkit-details-marker{display:none}
.workspace details:not(.office-account):not(.mobile-management):not(.workspace-product)>summary::after{content:"";flex:none;width:16px;height:16px;margin-left:auto;background:currentColor;color:var(--ink-3);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform var(--dur-state) var(--spring-gentle)}
.workspace details:not(.office-account):not(.mobile-management):not(.workspace-product)[open]>summary::after{transform:rotate(180deg)}
.workspace .office-audit td details>summary::after{width:12px;height:12px}
/* 태블릿 캘린더 도구줄: 보기 세그먼트 한 줄, 검색·담당자 한 줄 */
@media(min-width:801px) and (max-width:1100px){.workspace .cal-viewbar{flex-wrap:wrap}.workspace .cal-views{flex:1 1 100%}.workspace .cal-search{margin-left:0;flex:1 1 200px}.workspace .cal-staff{flex:0 0 auto;margin-left:auto}}
/* 발표자료: 보기 전환은 아이콘 세그먼트, 선택 모드는 보조 버튼 */
.workspace .library-display-tools{display:inline-flex;gap:2px;margin:0 8px 8px 0;padding:4px;border-radius:var(--radius-pill);background:var(--fill-tint);border:1px solid var(--rule);vertical-align:middle}
.workspace .library-display-tools button{min-height:36px;padding:6px 12px;border:0;border-radius:var(--radius-pill);background:transparent;color:var(--ink-2);gap:6px;box-shadow:none}
.workspace .library-display-tools button[aria-pressed=true]{background:var(--surface);color:var(--accent);box-shadow:0 1px 2px var(--shadow-deep)}
.workspace .library-selection-toggle{vertical-align:middle;gap:6px;margin-bottom:8px}
.workspace .library-tools nav{gap:4px}
.workspace .library-tools nav a{color:var(--action);font-weight:var(--w-medium)}

/* 헤더는 떠 있는 내비게이션 바로 남는다(스크롤 시 축소된 제목이 여기 나타난다) */
.workspace .page-shell>header{position:sticky;top:12px;z-index:35}
@media(max-width:800px){.workspace .page-shell>header{top:8px}}
@media print{.workspace .page-shell>header{position:static}}

/* ---------- 24. 다크 모드: 토큰이 못 덮는 일러스트·유리·상태면 ---------- */
.entry #sky .sky-1{stop-color:var(--stage-sky-1)}
.entry #sky .sky-2{stop-color:var(--stage-sky-2)}
.entry #beam .beam-1,.entry #beam .beam-2{stop-color:var(--stage-beam)}
.entry .scene-clouds{fill:var(--stage-cloud)}
.entry .scene-sun{fill:var(--stage-sun)}
.entry .scene-hills{fill:var(--stage-hill)}
.entry .scene-lines{stroke:var(--stage-line)}
.entry .scene-plate{fill:var(--stage-fill)}
.entry .scene-dot{fill:var(--stage-line)}
.entry .scene-sensor .ping{stroke:var(--stage-line)}
.entry .scene-flag-cloth{fill:var(--stage-flag);stroke:var(--stage-flag-rule)}
.entry .site-stage{background:var(--stage-sky-2)}
/* 유리는 어두운 판에 얇은 흰 테두리로 두께를 표현한다 */
@media(prefers-color-scheme:dark){
 .workspace .sidebar,.workspace .page-shell>header,.entry header,.workspace .mobile-tabbar{border-color:var(--glass-rim);box-shadow:inset 0 1px 0 var(--glass-highlight),0 1px 2px var(--shadow-ambient),0 10px 30px var(--shadow-key)}
 .workspace .mobile-tabbar a[aria-current=page]{box-shadow:inset 0 1px 0 var(--glass-highlight),0 1px 2px var(--shadow-ambient)}
 .workspace .mobile-tabbar :is(a,button):active{background:var(--glass-2)}
 .workspace .mobile-tabbar a[aria-current=page] .ic-cut{stroke:var(--fill-tint)}
 .workspace .hub-check button.quiet .ic-square .ic-body{stroke:var(--rule-strong)}
 .entry .login-card,.entry .site-strip>div,.entry .login-services li{background:var(--surface);border-color:var(--glass-rim)}
 .entry .google-button{background:var(--surface);border-color:var(--rule-strong)}
 .entry .google-mark{background:#fff;border-color:transparent}
 .workspace .office-cover{background:var(--accent-strong);color:var(--on-accent)}
 .workspace .office-cover img,.workspace .login-mark,.workspace .brand img,.entry .brand img,.entry .login-mark{background:#fff;border-radius:6px;padding:2px}
 .workspace .ic-checkmark-square .ic-cut{stroke:var(--surface)}
 .workspace .library-thumbnail{background:var(--surface-2)}
 .workspace .cal-now{background:#ff7a6e}
 .workspace .cal-now:before{background:#ff7a6e}
 .workspace ::selection{background:var(--accent);color:var(--on-accent)}
}
@media(prefers-color-scheme:dark) and (prefers-contrast:more){
 :root{--ink:#fff;--ink-2:#c8d4cd;--rule:#46534b;--surface:#1f2a25}
}

/* ---------- 25. 캘린더 단축키 설정 ---------- */
.workspace .cal-shortcut-toggle{display:flex;align-items:center;gap:8px;min-height:44px;margin:8px 0 0;font-size:var(--t-footnote);color:var(--ink-2)}
.workspace .cal-shortcut-toggle input{flex:none;width:20px;height:20px;min-width:20px;min-height:20px}
.workspace .cal-help small{display:block;font-size:var(--t-caption);color:var(--ink-3)}

/* ---------- 26. 업무 공간: 세그먼트를 상단 유리 바로, 목록은 두 줄 행으로 ---------- */
/* 화면 이름은 상단 바의 세그먼트가 말한다. 본문 제목은 문서 제목 동기화와 스크린리더를 위해 남긴다 */
.workspace .shell-title{position:absolute;width:1px;height:1px;padding:0;margin:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.workspace .hub-heading-lede{margin-top:0}
.workspace .hub-heading-lede>div>p:not(.eyebrow){margin-top:0}
/* 상단 바 가운데 슬롯: 세그먼트 + 이 화면의 기본 동작 */
.workspace .shell-slot{display:flex;align-items:center;justify-content:center;gap:10px;flex:1 1 auto;min-width:0}
.workspace .page-shell>header:has(.shell-slot .work-area-nav){padding-block:9px;height:auto;min-height:64px}
.workspace .page-shell>header:has(.shell-slot .work-area-nav) .header-caption{display:none}
.workspace .shell-slot .work-area-nav{margin:0;flex:0 1 auto;min-width:0;gap:2px;padding:4px;background:var(--fill-tint);border:1px solid var(--rule)}
.workspace .shell-slot .work-area-nav a{min-height:36px;padding:6px 14px;border:0;color:var(--ink-2);white-space:nowrap;box-shadow:none}
.workspace .shell-slot .work-area-nav a[aria-current=page]{background:var(--surface);color:var(--accent);box-shadow:0 1px 2px var(--shadow-deep)}
.workspace .shell-slot .shell-action{flex:0 0 auto;min-height:38px;padding:6px 16px;gap:6px;white-space:nowrap}
.workspace .shell-slot .shell-action kbd{font-family:inherit;font-size:11px;font-weight:var(--w-medium);letter-spacing:.02em;border-radius:var(--radius-badge);padding:0 5px;line-height:16px;background:transparent;color:inherit;border:1px solid color-mix(in srgb,currentColor 55%,transparent)}
@media(max-width:1100px){.workspace .shell-slot .shell-action kbd{display:none}}
/* 바가 충분히 넓으면 세그먼트는 바의 정확한 가운데, 기본 동작은 뒤쪽 끝(빠른 이동 앞)에 둔다 */
.workspace .page-shell>header:has(.shell-slot .work-area-nav){container:shellbar/inline-size}
@container shellbar (min-width:1060px){
 .workspace .shell-slot{justify-content:flex-end}
 .workspace .shell-slot .work-area-nav{position:absolute;left:50%;top:50%;translate:-50% -50%}
}
/* 좁은 화면: 세그먼트는 상단 바의 둘째 줄에서 가로로 스크롤되는 칩 줄이 된다 */
@media(max-width:900px){
 .workspace .page-shell>header:has(.shell-slot .work-area-nav){flex-wrap:wrap;row-gap:8px;height:auto!important;min-height:58px!important;padding-bottom:10px}
 /* 캘린더 높이는 머리 바 한 줄 기준이었다: 세그먼트 줄만큼 뺀다 */
 .workspace:has(.shell-slot .work-area-nav) .calendar-workspace{height:calc(100dvh - 154px - var(--shell-row,58px))}
 .workspace .shell-slot{order:9;flex:1 0 100%;justify-content:flex-start;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
 .workspace .shell-slot::-webkit-scrollbar{display:none}
 .workspace .shell-slot .work-area-nav{flex:1 0 auto}
 .workspace .shell-slot .work-area-nav a{flex:1 0 auto;min-height:40px}
 .workspace .shell-slot .shell-action{min-height:40px;padding-inline:14px}
}
@media(max-width:800px){.workspace:has(.shell-slot .work-area-nav) .calendar-workspace{height:calc(100dvh - 180px - var(--shell-row,58px) - env(safe-area-inset-bottom,0px))}}
/* 휴대폰: 세그먼트는 글자만, 기본 동작은 원형 아이콘 버튼으로 줄여 한 줄에 모두 보이게 한다 */
@media(max-width:600px){
 .workspace .shell-slot{overflow:visible;gap:8px}
 .workspace .shell-slot .work-area-nav{flex:1 1 auto}
 .workspace .shell-slot .work-area-nav a{flex:1 1 0;min-width:0;padding-inline:6px}
 .workspace .shell-slot .work-area-nav .nav-icon{display:none}
 .workspace .shell-slot .shell-action{width:44px;min-width:44px;height:44px;min-height:44px;padding:0;gap:0;justify-content:center;border-radius:var(--radius-pill)}
 .workspace .shell-slot .shell-action .shell-action-text{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .workspace .shell-slot .shell-action .symbol{width:20px;height:20px}
 .workspace .hub-toolbar{gap:10px}
 .workspace .hub-toolbar .hub-filters[aria-label]{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-16px;padding-inline:16px;scroll-padding-inline:16px}
 .workspace .hub-toolbar .hub-filters::-webkit-scrollbar{display:none}
 .workspace .hub-toolbar .hub-filters a{flex:0 0 auto;white-space:nowrap}
}
/* 목록 도구줄: 상태 필터와 검색을 한 줄에 */
.workspace .hub-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 14px}
.workspace .hub-toolbar .hub-filters{display:flex;flex-wrap:wrap;align-items:center;gap:6px;flex:1 1 auto;min-width:0;margin:0}
.workspace .hub-toolbar-search{flex:0 1 360px;min-width:min(100%,240px);max-width:360px;margin:0}
.workspace .hub-toolbar-search>div{gap:8px}
.workspace .hub-toolbar-search input:not([type=hidden]){height:44px;min-height:44px;padding-block:0;margin:0;line-height:1.3}
.workspace .hub-toolbar-search button{min-height:44px;padding-inline:16px}
@media(max-width:700px){.workspace .hub-toolbar-search{flex:1 1 100%;max-width:none}}
/* 상태 설명은 필요할 때만 펼친다 */
.workspace .hub-legend{display:inline-block;margin:0 0 12px}
.workspace .hub-legend>summary{min-height:36px;gap:6px;color:var(--ink-2);font-size:var(--t-footnote);font-weight:var(--w-medium)}
.workspace .hub-legend>summary::after{width:14px;height:14px;margin-left:4px}
.workspace .hub-legend p{margin:2px 0 0;max-width:62ch}
/* 업무 행: 제목 한 줄, 시간과 담당자는 둘째 줄 */
.workspace .task-index .task-row-content{display:block;min-width:0;line-height:1.5}
.workspace .task-index .task-row-content>strong{display:block;margin:0 0 2px}
.workspace .task-index .task-row-content>:is(time,small){display:inline;margin:0}
.workspace .task-index .task-row-content>time+small::before{content:"·";margin:0 .45em;color:var(--ink-3)}
.workspace .task-index .hub-task-row{align-items:center;gap:12px}
.workspace main>.card.task-index:not(.staff-directory){padding-block:6px}
.workspace .task-index .hub-task-row>.hub-badge{align-self:center}
}

/* ========================================================================== 
   27. Native adaptive interface · 2026-09-16
   Apple-platform-inspired web treatment: controls float above content, while
   content surfaces stay calm and opaque. Custom SVGs are project-owned icons,
   not redistributed SF Symbols.
   ========================================================================== */
.workspace{
 --native-control:44px;
 --native-control-large:50px;
 --native-toolbar:64px;
 --native-sidebar:232px;
 --native-page-max:1440px;
 --native-content-max:1180px;
 --native-gutter:clamp(16px,2.4vw,36px);
 --native-glass:color-mix(in srgb,var(--glass) 92%,transparent);
 --native-control-bg:color-mix(in srgb,var(--surface) 92%,transparent);
 --native-control-hover:color-mix(in srgb,var(--fill-tint) 72%,var(--surface));
 --native-separator:color-mix(in srgb,var(--rule) 82%,transparent);
 --native-shadow:0 1px 2px var(--shadow-ambient),0 10px 34px var(--shadow-key);
}
.visually-hidden,.workspace .visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
.workspace .ui-icon-button,.workspace a.ui-icon-button,.entry .ui-icon-button{
 display:inline-grid;place-items:center;flex:0 0 var(--native-control);width:var(--native-control);min-width:var(--native-control);height:var(--native-control);min-height:var(--native-control);padding:0!important;border-radius:999px!important;box-sizing:border-box;text-decoration:none;line-height:1;background:var(--native-control-bg);color:var(--accent);border:1px solid var(--rule-strong);box-shadow:var(--depth-control);vertical-align:middle
}
.workspace .ui-icon-button .symbol,.workspace .ui-icon-button .nav-icon,.entry .ui-icon-button .symbol{width:20px;height:20px;margin:0;flex:none;stroke-width:1.9}
.workspace .ui-icon-label,.entry .ui-icon-label{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--native-control);box-sizing:border-box}
.workspace .ui-icon-label>.symbol,.workspace .ui-icon-label>.nav-icon,.entry .ui-icon-label>.symbol{width:19px;height:19px;flex:0 0 19px;margin:0}
.workspace :is(button,a).ui-icon-button.danger,.workspace .danger.ui-icon-button{color:var(--danger-ink);border-color:var(--danger-rule);background:var(--danger-bg)}
@media(hover:hover) and (pointer:fine){
 .workspace :is(a,button).ui-icon-button:hover,.workspace :is(a,button).ui-icon-label:hover{background-color:var(--native-control-hover)}
 .workspace .danger.ui-icon-button:hover{background:color-mix(in srgb,var(--danger-bg) 78%,var(--surface))}
}
.workspace :is(a,button).ui-icon-button:active{transform:scale(.94)!important}
.workspace :is(a,button).ui-icon-label:active{transform:scale(.98)!important}

/* Keep the content layer flat; reserve refraction for navigation and controls. */
.workspace main :is(.card,.hub-panel,.workspace-product,.workspace-connections,.workspace-more,.office-member-controls,.office-import,.office-audit){-webkit-backdrop-filter:none;backdrop-filter:none}
.workspace main>.card,.workspace main .hub-panel,.workspace main .workspace-product{background:var(--surface);border-color:var(--native-separator);box-shadow:0 1px 2px var(--shadow-ambient)}
.workspace .sidebar,.workspace .page-shell>header,.workspace .mobile-tabbar{
 background:var(--native-glass);border-color:var(--glass-rim);box-shadow:var(--native-shadow);-webkit-backdrop-filter:blur(24px) saturate(150%);backdrop-filter:blur(24px) saturate(150%)
}
.workspace .page-shell>header{min-height:var(--native-toolbar);align-items:center}
.workspace .page-shell>header .toolbar-label{white-space:nowrap}
.workspace .office-sidebar-toggle,.workspace .office-jump-trigger,.workspace .office-account>summary,.workspace .mobile-management>summary{min-width:44px;min-height:44px;box-sizing:border-box}
.workspace .office-sidebar-toggle{border-color:transparent;background:transparent;box-shadow:none}
.workspace .office-jump-trigger{gap:8px}
.workspace .office-account>summary{display:flex;align-items:center;justify-content:center;gap:7px}
.workspace .office-account>summary .symbol,.workspace .office-jump-trigger>.symbol,.workspace .mobile-management>summary>.symbol{width:19px;height:19px;flex:none}
.workspace .office-account-panel{border-color:var(--glass-rim);background:var(--native-glass);-webkit-backdrop-filter:blur(28px) saturate(145%);backdrop-filter:blur(28px) saturate(145%);box-shadow:0 20px 56px var(--shadow-deep)}
.workspace .office-account-panel :is(.office-account-link,button){width:100%;justify-content:flex-start;padding-inline:12px}
.workspace .office-account-panel .office-account-link{border-radius:var(--radius-control);text-decoration:none;color:var(--ink-2)}

/* Search/control clusters behave like native toolbars. */
.workspace .office-search>div{display:flex;align-items:center;gap:8px;min-width:0}
.workspace .office-search input:not([type=hidden]){min-height:44px;background:var(--surface);border-color:var(--rule-strong)}
.workspace .office-search .search-submit{flex:0 0 44px}
.workspace .hub-toolbar{align-items:flex-end}
.workspace .hub-filters a,.workspace .hub-filters>span,.workspace [data-review-filter],.workspace .library-tools nav :is(a,button){min-height:44px;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box}
.workspace .hub-filters a[aria-current=page],.workspace [data-review-filter][aria-pressed=true],.workspace .library-tools button[aria-pressed=true]{box-shadow:inset 0 1px 0 var(--glass-highlight),0 1px 2px var(--shadow-ambient)}

/* Cleaner rows: content gets priority; status/actions remain trailing. */
.workspace .hub-row{min-height:58px;box-sizing:border-box}
.workspace .hub-row:last-child{border-bottom:0}
.workspace .hub-badge{min-height:28px;display:inline-flex;align-items:center}
.workspace .task-index,.workspace .staff-directory,.workspace .news-list{overflow:hidden}
.workspace .office-detail-columns>section,.workspace .hub-columns>section{min-width:0}

/* Presentation controls become a compact transport bar. */
.workspace .library-viewer-bar,.workspace .library-viewer-controls{align-items:center}
.workspace .library-viewer-bar .ui-icon-button,.workspace .library-viewer-controls .ui-icon-button{flex:0 0 44px;width:44px;height:44px;padding:0;border-radius:999px}
.workspace .library-group-actions{align-items:center}
.workspace .library-print-link,.workspace .library-selection-toggle{display:inline-flex;align-items:center;gap:7px}
.workspace .library-print-link>.symbol,.workspace .library-selection-toggle>.symbol{width:18px;height:18px}

/* Navigation surfaces. Desktop keeps a true persistent sidebar. */
@media(min-width:1181px){
 .workspace .sidebar,body.workspace:has(.calendar-workspace)>.sidebar{display:block!important;width:var(--native-sidebar);inset:14px auto 14px 14px;padding:20px 14px;border-radius:28px}
 .workspace .page-shell{margin-left:calc(var(--native-sidebar) + 42px)!important;max-width:none}
 .workspace.office-nav-collapsed .page-shell{margin-left:0!important}
 .workspace .page-shell>header{margin:14px var(--native-gutter) 0;top:12px;padding:9px 14px;border-radius:28px}
 .workspace main{width:min(100%,var(--native-page-max));margin-inline:auto;padding-inline:var(--native-gutter)}
 .workspace .mobile-tabbar{display:none!important}
 .workspace .sidebar nav a{min-height:44px;padding:8px 10px;border-radius:14px}
 .workspace .sidebar .nav-label{padding-inline:10px}
}

/* iPad / tablet: floating top tabs + a temporary navigation drawer. */
@media(min-width:601px) and (max-width:1180px) and (min-height:501px){
 .workspace .page-shell{margin-left:0!important;padding-bottom:24px}
 .workspace .page-shell>header{position:sticky;top:10px;margin:10px 16px 0;padding:8px 12px;border-radius:26px;z-index:70}
 .workspace .page-shell>header .header-caption{display:none}
 .workspace .sidebar,body.workspace:has(.calendar-workspace)>.sidebar{display:block;position:fixed;z-index:90;inset:12px auto 12px 12px;width:min(310px,calc(100vw - 72px));padding:20px 14px;border-radius:28px;box-shadow:0 24px 90px var(--shadow-deep)}
 .workspace.office-nav-collapsed>.sidebar{display:none!important}
 .workspace .office-sidebar-scrim{display:block;position:fixed;z-index:80;inset:0;width:100%;height:100%;padding:0;border:0;border-radius:0;background:var(--scrim);box-shadow:none}
 .workspace .office-sidebar-scrim[hidden]{display:none}
 .workspace .office-sidebar-toggle{display:inline-grid!important}
 .workspace main{width:min(100%,var(--native-page-max));margin-inline:auto;padding:86px clamp(20px,3vw,32px) 32px}
 .workspace .mobile-tabbar,body.workspace:has(.calendar-workspace) .mobile-tabbar{
  display:flex!important;position:fixed;z-index:60;top:86px;bottom:auto;left:50%;translate:-50% 0;width:max-content;max-width:calc(100vw - 32px);padding:5px 7px;border-radius:999px;gap:2px
 }
 .workspace .mobile-tabbar>*{flex:0 0 auto}
 .workspace .mobile-tabbar :is(a,button){flex-direction:row;gap:7px;min-height:44px;padding:7px 13px;border-radius:999px}
 .workspace .mobile-tabbar .nav-text{font-size:13px}
 .workspace .mobile-tabbar .nav-icon{width:19px;height:19px;flex-basis:19px}
 .workspace .mobile-tabbar a[aria-current=page]{background:var(--surface);color:var(--accent)}
 .workspace .shell-slot .work-area-nav{max-width:100%;overflow-x:auto}
 .workspace .calendar-workspace{height:calc(100dvh - 196px)!important;min-height:520px}
}

/* iPhone / compact: bottom tabs, icon-first top toolbar and safe-area spacing. */
@media(max-width:600px),(max-height:500px) and (max-width:950px){
 .workspace{--native-gutter:clamp(14px,4vw,20px)}
 .workspace .sidebar,body.workspace:has(.calendar-workspace)>.sidebar{display:none!important}
 .workspace .page-shell{margin-left:0!important;padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))!important}
 .workspace .page-shell>header,body.workspace:has(.calendar-workspace) .page-shell>header{position:sticky;top:8px;margin:8px 10px 0;padding:7px 9px;min-height:56px;border-radius:25px;z-index:55;gap:6px}
 .workspace .office-mobile-brand{max-width:82px;overflow:hidden}
 .workspace .office-mobile-brand img{width:74px;height:auto}
 .workspace .office-sidebar-toggle{display:none!important}
 .workspace .page-shell>header .toolbar-label,.workspace .office-jump-trigger kbd,.workspace .mobile-management{display:none!important}
 .workspace .office-jump-trigger,.workspace .office-account>summary{width:44px;min-width:44px;height:44px;padding:0!important;border-radius:999px;display:grid;place-items:center;background:transparent;border-color:transparent;box-shadow:none}
 .workspace .office-jump-trigger>.symbol,.workspace .office-account>summary>.symbol{width:20px;height:20px}
 .workspace .office-account-panel{position:fixed;left:12px;right:12px;top:76px;width:auto;max-width:none;border-radius:24px;padding:16px}
 .workspace main{width:100%;max-width:none;padding-inline:var(--native-gutter)!important;padding-top:20px}
 .workspace .mobile-tabbar,body.workspace:has(.calendar-workspace) .mobile-tabbar{display:flex!important;left:12px;right:12px;width:auto;max-width:540px;margin-inline:auto;bottom:calc(8px + env(safe-area-inset-bottom,0px));padding:5px;border-radius:28px;gap:1px}
 .workspace .mobile-tabbar :is(a,button){min-height:56px;padding:5px 2px;border-radius:21px;flex-direction:column;gap:3px}
 .workspace .mobile-tabbar .nav-text{font-size:11px;line-height:1.15;max-width:100%;overflow:hidden;text-overflow:ellipsis}
 .workspace .mobile-tabbar .nav-icon{width:21px;height:21px;flex-basis:21px}
 .workspace .hub-heading{margin:8px 0 20px;gap:12px}
 .workspace .hub-heading h1,.workspace .page-heading h1{font-size:clamp(26px,8vw,32px)}
 .workspace .hub-panel,.workspace .hub-form{padding:18px;border-radius:20px}
 .workspace .hub-columns{display:flex;flex-direction:column;gap:12px}
 .workspace .office-detail-columns .office-next-action{order:-1}
 .workspace .office-search{max-width:none;width:100%}
 .workspace .office-search>div{gap:6px}
 .workspace .office-search input:not([type=hidden]){min-width:0}
 .workspace .hub-toolbar{display:flex;flex-direction:column;align-items:stretch;gap:10px}
 .workspace .hub-toolbar .hub-filters[aria-label]{order:2;margin-inline:calc(-1 * var(--native-gutter));padding-inline:var(--native-gutter);overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
 .workspace .hub-toolbar .hub-filters[aria-label]::-webkit-scrollbar{display:none}
 .workspace .hub-toolbar .hub-filters a{flex:0 0 auto}
 .workspace .hub-toolbar-search{order:1;width:100%;max-width:none}
 .workspace .hub-filters{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none;max-width:100%}
 .workspace .hub-filters::-webkit-scrollbar{display:none}
 .workspace .hub-filters a,.workspace .hub-filters>span{flex:0 0 auto;white-space:nowrap}
 .workspace .card,.workspace .workspace-product,.workspace .workspace-connections,.workspace .workspace-more{border-radius:20px}
 .workspace .library-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .workspace .library-group-actions{width:100%;display:flex;overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px;scrollbar-width:none}
 .workspace .library-group-actions::-webkit-scrollbar{display:none}
 .workspace .library-group-actions>*{flex:0 0 auto}
 .workspace .library-print-title{display:none}
 .workspace .library-viewer-bar h2{flex:1 1 100%;order:-1}
 .workspace .library-viewer-bar .ui-icon-button,.workspace .library-viewer-controls .ui-icon-button{width:44px;min-width:44px}
 .workspace .library-viewer-controls{justify-content:center}
 .workspace .calendar-workspace{height:calc(100dvh - 190px - env(safe-area-inset-bottom,0px))!important;min-height:430px}
 .workspace .cal-toolbar{padding:8px!important;gap:6px}
 .workspace .cal-toolbar .cal-range{font-size:18px;min-width:0;overflow:hidden;text-overflow:ellipsis}
 .workspace .cal-filter-toggle .toolbar-label{display:none}
 .workspace .cal-filter-toggle{width:44px;min-width:44px;padding:0!important}
 .workspace .cal-date-nav a,.workspace .cal-jump button,.workspace .cal-staff button{min-width:44px;min-height:44px}
 .workspace .cal-status{font-size:11px}
 .workspace .cal-detail{height:min(90dvh,760px);padding:18px;border-radius:24px 24px 0 0}
 .workspace .cal-panel-title button{width:44px;min-width:44px;padding:0;font-size:0}
 .workspace .office-form-actions{bottom:calc(76px + env(safe-area-inset-bottom,0px));padding:10px;border-radius:20px;background:var(--native-glass);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 -8px 24px var(--shadow-ambient)}
 .workspace footer{padding-bottom:20px}
}
@media(max-width:430px){
 .workspace .library-grid{grid-template-columns:1fr}
 .workspace .hub-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
 .workspace .hub-stats a{min-width:0;padding:12px 10px}
 .workspace .hub-stats strong{font-size:26px}
 .workspace .work-area-nav a{font-size:13px}
 .workspace .work-area-nav .nav-icon{display:none}
 .workspace .shell-slot .shell-action{width:44px;min-width:44px;padding:0}
 .workspace .shell-slot .shell-action-text{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
}

/* Pointer hover never replaces pressed/focus feedback. */
@media(hover:hover) and (pointer:fine){
 .workspace .sidebar nav a:not([aria-current=page]):hover,.workspace .mobile-tabbar :is(a,button):not([aria-current=page]):hover,.workspace .work-area-nav a:not([aria-current=page]):hover{background:var(--native-control-hover)}
}

/* Accessibility appearances: glass becomes solid; geometry and meaning remain. */
@media(prefers-reduced-transparency:reduce){
 .workspace .sidebar,.workspace .page-shell>header,.workspace .mobile-tabbar,.workspace .office-account-panel,.workspace .office-form-actions{background:var(--surface)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;box-shadow:none!important;border-color:var(--rule-strong)!important}
}
@media(prefers-contrast:more){
 .workspace{--native-separator:var(--rule-strong)}
 .workspace .ui-icon-button,.workspace :is(button,.button,.hub-button),.workspace .mobile-tabbar,.workspace .sidebar,.workspace .page-shell>header{border-color:var(--rule-strong)}
 .workspace .hub-badge{outline:1px solid currentColor;outline-offset:-1px}
}
@media(prefers-reduced-motion:reduce){
 .workspace :is(.ui-icon-button,.ui-icon-label,.mobile-tabbar a,.mobile-tabbar button,.sidebar nav a,.work-area-nav a){transition:none!important;animation:none!important;transform:none!important}
}
.workspace .ui-icon-button[data-icon]::before{content:"";width:20px;height:20px;background:currentColor;display:block}
.workspace .ui-icon-button[data-icon="xmark"]::before{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E") center/contain no-repeat}

/* Release QA: segmented work navigation is also a primary touch target. */
.workspace .work-area-nav a{min-height:44px!important}
.workspace .shell-slot .shell-action{min-height:44px}

/* Independent multi-browser release QA: prevent overlapping navigation surfaces.
   Retain the already-deployed phone/tablet/desktop model from PR #8. */
:root{--native-control:44px;--native-control-bg:var(--surface)}
.workspace .shell-slot{min-width:0;justify-content:center;gap:10px}
.workspace .shell-slot .work-area-nav{position:static;translate:none;flex:0 1 auto;width:auto;max-width:100%;margin:0}
.workspace .shell-slot .shell-action{flex:0 0 auto}
.workspace .calendar-workspace{height:var(--support-calendar-height,70dvh)!important;min-height:320px}
@media(max-width:900px){.workspace .shell-slot .work-area-nav{flex:1 1 auto}}
@media(min-width:601px) and (max-width:1180px) and (min-height:501px){
 .workspace .mobile-tabbar,body.workspace:has(.calendar-workspace) .mobile-tabbar{top:var(--support-tabs-top,86px)}
 .workspace .page-shell>main{padding-top:calc(var(--support-tabs-height,54px) + 28px)!important}
}

.workspace .office-drawer-close{display:none}
@media(min-width:601px) and (max-width:1180px) and (min-height:501px){.workspace .office-drawer-close{display:inline-grid;position:absolute;right:12px;top:12px}.workspace .sidebar>.brand{padding-right:52px}}

/* 1024px calendar QA: give work segments their own measured row on every tablet. */
@media(min-width:601px) and (max-width:1180px) and (min-height:501px){
 .workspace .page-shell>header:has(.shell-slot .work-area-nav){flex-wrap:wrap;row-gap:8px;height:auto!important}
 .workspace .shell-slot:has(.work-area-nav){order:9;flex:1 0 100%;justify-content:flex-start;min-width:0}
 .workspace .shell-slot .work-area-nav{flex:1 1 auto;width:auto;min-width:0;max-width:none}
 .workspace .shell-slot .work-area-nav a{flex:1 1 0;min-width:0;padding-inline:8px}
 .workspace .shell-slot .shell-action{flex:0 0 auto}
}

/* Visual QA: legacy translateX and the new translate property must not compound. */
@media(min-width:601px) and (max-width:1180px) and (min-height:501px){
 .workspace .mobile-tabbar,body.workspace:has(.calendar-workspace) .mobile-tabbar{left:50%;right:auto;width:max-content;max-width:calc(100vw - 32px);margin-inline:0;translate:none!important;transform:translateX(-50%)!important}
}
@media(max-width:600px),(max-height:500px) and (max-width:950px){
 .workspace .mobile-tabbar,body.workspace:has(.calendar-workspace) .mobile-tabbar{left:12px;right:12px;width:auto;max-width:540px;margin-inline:auto;top:auto;translate:none!important;transform:none!important}
}

/* Header controls: one search symbol and a Google account portrait. */
@media screen{
 :is(.workspace,.entry) .page-shell>header .office-jump-trigger.header-icon-only,
 :is(.workspace,.entry) .page-shell>header .office-account>summary.office-profile-trigger{
  display:inline-grid;place-items:center;box-sizing:border-box;
  flex:0 0 44px;width:44px;min-width:44px;max-width:44px;
  height:44px;min-height:44px;padding:0!important;gap:0;line-height:1;
  border-radius:999px;background:transparent;border:1px solid transparent;box-shadow:none;
  color:var(--accent);vertical-align:middle;cursor:pointer;
 }
 :is(.workspace,.entry) .page-shell>header .office-jump-trigger.header-icon-only{
  margin-left:auto;
 }
 :is(.workspace,.entry) .page-shell>header .office-jump-trigger.header-icon-only>.symbol{
  display:block;width:22px;height:22px;flex:none;margin:0;stroke-width:1.8;
 }
 :is(.workspace,.entry) .page-shell>header .office-profile-trigger::after{content:none!important;display:none!important}
 .office-profile-trigger::-webkit-details-marker{display:none}
 .office-profile-photo{
  position:relative;display:grid;place-items:center;width:32px;height:32px;flex:none;
  border-radius:50%;overflow:hidden;isolation:isolate;
  color:var(--accent);background:var(--fill-tint);box-shadow:0 0 0 1px var(--rule);
 }
 .office-profile-photo .office-profile-fallback{
  grid-area:1/1;display:grid;place-items:center;width:100%;height:100%;
  color:var(--accent);font:600 15px/1 system-ui,sans-serif;
 }
 .office-profile-photo img[data-profile-photo]{
  grid-area:1/1;display:block;width:32px;height:32px;max-width:none;
  aspect-ratio:1;object-fit:cover;border-radius:50%;opacity:0;
 }
 .office-profile-photo.has-photo img[data-profile-photo]{opacity:1}
 .office-profile-photo.has-photo .office-profile-fallback{visibility:hidden}
 .office-profile-photo img[data-profile-photo][hidden]{display:none!important}
 :is(.workspace,.entry) .page-shell>header :is(.header-icon-only,.office-profile-trigger):focus-visible{
  outline:2px solid var(--accent);outline-offset:2px;
 }
 @media(hover:hover) and (pointer:fine){
  :is(.workspace,.entry) .page-shell>header :is(.header-icon-only,.office-profile-trigger):hover{background:var(--fill-tint)}
 }
 @media(forced-colors:active){
  .office-profile-photo{color:CanvasText;background:Canvas;box-shadow:none;border:1px solid CanvasText}
  .office-profile-photo .office-profile-fallback{color:CanvasText}
  :is(.workspace,.entry) .page-shell>header :is(.header-icon-only,.office-profile-trigger):focus-visible{outline-color:Highlight}
 }
}

/* Responsive audit 2026-09-17: tablet tab row, timed-grid labels, month cells. */
@media(min-width:601px) and (max-width:1180px) and (min-height:501px){
 /* The floating tab row sits under the header on every page. Page-specific main paddings
    (calendar, dashboard, collapsed sidebar) used to outrank the reservation, so the row
    covered calendar toolbars; the id keeps the reservation authoritative. */
 body.workspace .page-shell>main#content{padding-top:calc(var(--support-tabs-height,54px) + 24px)!important}
 /* Scroll the row away with the page so a sticky two-row header plus the row never hide form fields. */
 body.workspace>.mobile-tabbar{position:absolute!important}
}
/* One time gutter per timed grid: repeated labels in every day column collided with event blocks. */
.workspace .hub-calendar.hub-timed .hub-day:not(:first-child) .hub-hour{color:transparent}
/* Events start 26px into the first column but a label is ~34px wide: lift the gutter label above event edges and overlap summaries (it only covers the event's border and padding). */
.workspace .hub-calendar.hub-timed .hub-day:first-child .hub-hour{z-index:4;left:1px;padding:0 2px;border-radius:4px;background:var(--surface);line-height:1.35}
@media screen and (min-width:801px){
 /* Month cells: keep the date row to one line so at least two events show before the cell scrolls. */
 .workspace .hub-calendar.month .hub-day{position:relative}
 .workspace .hub-calendar.month .hub-day>h2{height:auto;min-height:32px;padding-block:0;padding-right:34px;align-items:center}
 .workspace .hub-calendar.month .hub-day>h2>a:first-child{min-height:32px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .workspace .hub-calendar.month .hub-day-add{position:absolute;top:2px;right:2px;width:32px;height:32px;min-width:32px;min-height:32px;padding:0}
 /* The first week row names the weekdays; later rows keep room for the date and event count. */
 .workspace .hub-calendar.month>.hub-day:nth-child(n+8) .hub-day-weekday{display:none}
}
/* Form actions: the text-style cancel link sat on the top edge next to the 44px save button. */
.workspace .office-form-actions{align-items:center}
.workspace .office-form-actions>a{display:inline-flex;align-items:center}

/* Tablet calendar audit 2026-09-17 (801-1180px, reproduced with a member account and Google events). */
@media(min-width:601px) and (max-width:1180px) and (min-height:501px){
 /* The sidebar is an overlay here; the 801-1199px calendar rule (with :has) still pushed the page 216px right. */
 html body.workspace .page-shell,html body.workspace:has(.calendar-workspace) .page-shell{margin-left:0!important}
 /* One navigation surface on tablets: the tab row (home, presentations, tasks, requests) and its
    "전체" menu already hold every sidebar destination, so the drawer and its toggle are removed. */
 html body.workspace>.sidebar,html body.workspace:has(.calendar-workspace)>.sidebar,
 html body.workspace .office-sidebar-toggle,html body.workspace .office-sidebar-scrim{display:none!important}
}
@media(min-width:801px) and (max-width:1180px) and (min-height:501px){
 /* Calendar controls in two rows instead of four: filter, view switcher and search share one row. */
 .workspace .cal-viewbar{flex-wrap:nowrap;align-items:center}
 .workspace .cal-viewbar>.cal-views{flex:1 1 auto;min-width:0;order:0}
 .workspace .cal-viewbar>.cal-views>*{flex:1 1 0;min-width:44px}
 .workspace .cal-viewbar>.cal-filter-toggle{flex:none}
 .workspace .cal-viewbar>.cal-search{flex:0 0 clamp(160px,24vw,240px);margin-left:0}
}
/* Timed events size their content to the block (the block is a flex column, so rows are flex rows). */
.workspace .hub-calendar.hub-timed .hub-day-events .hub-event{container-type:size}
@container (max-height:60px){
 /* About an hour or less: time, then a one-line title; the calendar/assignee line is dropped. */
 .workspace .hub-calendar.hub-timed .hub-day-events .hub-event>span{display:none}
 .workspace .hub-calendar.hub-timed .hub-day-events .hub-event>strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
}
@container (max-height:36px){
 /* 15-30 minutes: one line for the title; the block's position in the grid already shows the time
    (a query cannot restyle its own container, so the column cannot become a row). */
 .workspace .hub-calendar.hub-timed .hub-day-events .hub-event>time{display:none}
}
/* The day header stays above the first-column time chips while the grid scrolls. */
.workspace .hub-calendar.hub-timed .hub-day>h2{z-index:5}

/* Calendar toolbar structure 2026-09-17: one date navigation, search and filter together, no hint row. */
/* Date jumping lives in the rail's mini calendar (the menu button); the duplicate date field and go button were removed. */
@media screen and (min-width:801px){
 /* View switcher first; search, filter and the member picker gather at the row's end. */
 .workspace .cal-viewbar>.cal-views{order:0}
 .workspace .cal-viewbar>.cal-search{order:2;margin-left:auto}
 .workspace .cal-viewbar>.cal-filter-toggle{order:3}
 .workspace .cal-viewbar>.cal-staff{order:4}
}
@media(min-width:801px) and (max-width:1180px) and (min-height:501px){
 .workspace .cal-viewbar>.cal-search{margin-left:8px}
}
@media(min-width:1181px){
 /* Without the date field the title would drift to the far edge; keep it beside the period arrows. */
 .workspace .cal-toolbar{justify-content:flex-start}
}
.workspace .cal-search{position:relative}
.workspace .cal-search>.symbol{position:absolute;left:14px;top:50%;width:18px;height:18px;translate:0 -50%;color:var(--ink-2);pointer-events:none}
.workspace .cal-search input[type=search]{padding-left:40px}
/* The status row is kept for assistive technology and in-place navigation, but only shows while searching. */
.workspace .cal-status{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.workspace .cal-main:has(#cal-search:not(:placeholder-shown)) .cal-status{position:static;width:auto;height:auto;padding:6px 14px;overflow:visible;clip-path:none;white-space:normal}
.workspace .cal-main:has(#cal-search:not(:placeholder-shown)) .cal-status>span:first-child{display:none}

/* Layout system 2026-09-17: header, page content and footer share one column at every width.
   Many older per-page rules (dashboard, calendar, refinement, office) set competing margins and
   max-widths, so the header drifted left of centred content on wide screens and gutters differed
   on phones and tablets. These rules sit last with enough specificity to be the single source. */
:root{--page-gutter:16px;--page-max:1376px}
@media(min-width:601px){:root{--page-gutter:clamp(24px,3vw,32px)}}
html body.workspace.workspace .page-shell>header{
 box-sizing:border-box!important;width:auto!important;max-width:none!important;
 margin-left:max(var(--page-gutter),calc((100% - var(--page-max)) / 2))!important;
 margin-right:max(var(--page-gutter),calc((100% - var(--page-max)) / 2))!important}
html body.workspace .page-shell>main#content{
 box-sizing:border-box!important;width:auto!important;max-width:none!important;margin-left:0!important;margin-right:0!important;
 padding-left:max(var(--page-gutter),calc((100% - var(--page-max)) / 2))!important;
 padding-right:max(var(--page-gutter),calc((100% - var(--page-max)) / 2))!important}
html body.workspace.workspace .page-shell>footer{
 box-sizing:border-box;align-items:center;
 padding-left:max(var(--page-gutter),calc((100% - var(--page-max)) / 2))!important;
 padding-right:max(var(--page-gutter),calc((100% - var(--page-max)) / 2))!important}
/* Footer items were 44px boxes with text at different vertical positions. */
html body.workspace.workspace .page-shell>footer>*{display:inline-flex;align-items:center}
@media(min-width:601px){html body.workspace.workspace .page-shell>footer>*{min-height:44px}}
/* Half-width cards (import, invite form) left ragged right edges beside full-width cards. */
.workspace .card.narrow-left{max-width:none}

/* 발표자료 2026-09-17: 위계·정렬·조작성 정리.
   - 비어 있는 헤더 슬롯이 좁은 화면에서 너비 100%를 차지해 헤더를 밀어내던 문제를 없앤다.
   - 도구 컨트롤은 모두 50px 높이, 같은 글자 역할. 단일 선택 두 개(종류·표시방식)는 같은 세그먼트 모양.
   - 카드 제목은 본문색, 썸네일은 원본(A4 가로) 비율. 섹션 발표 버튼은 제목보다 가벼운 틴트 버튼. */
.workspace .shell-slot:empty{display:none}
@media(max-width:600px),(max-height:500px) and (max-width:950px){
 html body.workspace .page-shell>header .office-jump-trigger{margin-inline-start:auto}
}
html body.workspace .mobile-tabbar button:not([aria-current]){border-color:transparent;background:transparent;color:var(--action)}

html body.workspace .presentation-library{--library-control:50px;--library-sticky-top:88px}
html body.workspace .presentation-library .hub-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:8px 16px;flex-wrap:wrap}
html body.workspace .presentation-library .library-saved-link{display:inline-flex;align-items:center;gap:2px;min-height:44px;font-size:var(--t-subhead);font-weight:var(--w-medium);color:var(--action)}
@media(min-width:1181px){html body.workspace .presentation-library .library-saved-link{display:none}}

html body.workspace .presentation-library .library-toolbar{display:grid;gap:12px;margin:0 0 24px}
html body.workspace .presentation-library .library-tools{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:0}
html body.workspace .presentation-library .library-tools label{flex:1 1 320px;min-width:0;display:block}
html body.workspace .presentation-library .library-tools input[type=search]{box-sizing:border-box;height:var(--library-control);min-height:var(--library-control);margin:0;font-size:var(--t-body)}
html body.workspace .presentation-library .library-view-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
html body.workspace .presentation-library :is(.library-tools nav,.library-display-tools){display:inline-flex;align-items:center;flex:0 0 auto;box-sizing:border-box;height:var(--library-control);margin:0;padding:2px;gap:2px;border:1px solid var(--rule);border-radius:var(--radius-pill);background:var(--fill-tint);vertical-align:middle}
html body.workspace .presentation-library :is(.library-tools nav,.library-display-tools) button{display:inline-flex;align-items:center;justify-content:center;gap:6px;box-sizing:border-box;height:44px;min-height:44px;padding:0 16px;border:0;border-radius:var(--radius-pill);background:transparent;box-shadow:none;color:var(--ink-2);font-size:var(--t-subhead);font-weight:var(--w-medium);white-space:nowrap}
html body.workspace .presentation-library :is(.library-tools nav,.library-display-tools) button[aria-pressed=true]{background:var(--surface);color:var(--accent);font-weight:var(--w-semibold);box-shadow:0 1px 2px var(--shadow-ambient)}
html body.workspace .presentation-library .library-selection-toggle{box-sizing:border-box;height:var(--library-control);min-height:var(--library-control);margin:0 0 0 auto;padding:0 18px;gap:8px;font-size:var(--t-subhead);font-weight:var(--w-medium);color:var(--ink-2);background:var(--surface);border:1px solid var(--rule-strong)}
html body.workspace .presentation-library .library-selection-toggle[aria-pressed=true]{color:var(--accent);background:var(--fill-tint);border-color:var(--accent);font-weight:var(--w-semibold)}
html body.workspace .presentation-library.library-selection-mode>[data-library-status]{position:static;width:auto;height:auto;margin:-12px 0 16px;padding:0;overflow:visible;clip-path:none;white-space:normal;font-size:var(--t-footnote);color:var(--ink-2)}

html body.workspace .presentation-library .library-group{margin:0 0 32px}
html body.workspace .presentation-library .library-group>.hub-section-title{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 16px;margin:0 0 12px}
html body.workspace .presentation-library .library-group h2{margin:0}
html body.workspace .presentation-library .library-group-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;width:auto;overflow:visible;padding:0}
html body.workspace .presentation-library .library-group-actions>*{flex:0 0 auto}
html body.workspace .presentation-library .library-slide-link{display:inline-flex;align-items:center;gap:8px;box-sizing:border-box;min-height:44px;padding:0 16px;border:1px solid var(--rule);border-radius:var(--radius-pill);background:var(--fill-tint);color:var(--accent);font-size:var(--t-subhead);font-weight:var(--w-semibold);box-shadow:none}
html body.workspace .presentation-library .library-slide-link:disabled{opacity:.45}
html body.workspace .presentation-library .library-print-link{min-height:44px;padding:0 16px;font-size:var(--t-subhead);font-weight:var(--w-semibold)}
html body.workspace .presentation-library .library-group-actions>a{min-height:44px;font-size:var(--t-subhead);font-weight:var(--w-medium)}
@media(min-width:601px){
 html body.workspace .presentation-library .library-group>.hub-section-title{position:sticky;top:var(--library-sticky-top);z-index:20;margin-inline:-12px;padding:6px 6px 6px 12px;border:1px solid var(--glass-rim);border-radius:var(--radius-tile);background:var(--glass-2);-webkit-backdrop-filter:blur(calc(var(--glass-blur,18px) * 1.5)) saturate(var(--glass-saturation,118%));backdrop-filter:blur(calc(var(--glass-blur,18px) * 1.5)) saturate(var(--glass-saturation,118%));box-shadow:0 1px 2px var(--shadow-ambient)}
}
@media(min-width:601px) and (max-width:1180px) and (min-height:501px){
 html body.workspace .presentation-library{--library-sticky-top:calc(var(--support-tabs-top,86px) + var(--support-tabs-height,54px) + 8px)}
}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){
 html body.workspace .presentation-library .library-group>.hub-section-title{background:var(--surface);-webkit-backdrop-filter:none;backdrop-filter:none;border-color:var(--rule)}
}
html body.workspace .presentation-library .library-more{display:flex;align-items:center;justify-content:center;box-sizing:border-box;height:48px;min-height:48px;margin:16px auto 0;padding:0 24px;border:1px solid var(--rule-strong);border-radius:var(--radius-pill);background:var(--surface);color:var(--accent);font-size:var(--t-subhead);font-weight:var(--w-medium)}
html body.workspace .presentation-library .library-more[hidden]{display:none}

html body.workspace .presentation-library .library-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
html body.workspace .presentation-library .library-item{display:flex;flex-direction:column;align-items:stretch;gap:8px;min-height:0;padding:12px;color:var(--ink)}
html body.workspace .presentation-library .library-thumbnail{display:block;box-sizing:border-box;width:100%;height:auto;max-height:none;aspect-ratio:297/210;object-fit:contain;background:var(--surface-2);border-radius:var(--radius-small)}
html body.workspace .presentation-library .library-item strong{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:2.9em;margin:2px 0 0;color:var(--ink);font-size:var(--t-headline);font-weight:var(--w-semibold);line-height:1.45}
html body.workspace .presentation-library .library-item small{display:inline-flex;align-items:center;gap:2px;margin:auto 0 0;color:var(--ink-2);font-size:var(--t-footnote);font-weight:var(--w-regular)}
@media(min-width:601px) and (max-width:1180px) and (min-height:501px){
 html body.workspace .presentation-library .library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(min-width:900px) and (max-width:1180px) and (min-height:501px){
 html body.workspace .presentation-library .library-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:600px){
 html body.workspace .presentation-library .library-tools label{flex-basis:100%}
 html body.workspace .presentation-library .library-tools nav{display:flex;width:100%;flex:1 1 100%}
 html body.workspace .presentation-library .library-tools nav button{flex:1 1 0;padding-inline:8px}
 html body.workspace .presentation-library .library-view-row{flex-wrap:nowrap}
 html body.workspace .presentation-library .library-display-tools button{padding-inline:12px}
 html body.workspace .presentation-library .library-selection-toggle{flex:1 1 auto;justify-content:center;padding-inline:12px}
 html body.workspace .presentation-library .library-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 html body.workspace .presentation-library .library-item{padding:8px;gap:6px;border-radius:var(--radius-tile)}
 html body.workspace .presentation-library .library-item strong{font-size:var(--t-subhead)}
 html body.workspace .presentation-library .library-more{width:100%}
}
@media(max-width:380px){html body.workspace .presentation-library .library-grid{grid-template-columns:1fr}}

html body.workspace .presentation-library.library-list-view .library-grid{grid-template-columns:1fr;gap:8px}
html body.workspace .presentation-library.library-list-view .library-item{display:grid;grid-template-columns:112px minmax(0,1fr);grid-template-rows:auto auto;align-content:center;column-gap:16px;row-gap:4px;min-height:92px;padding:10px 14px}
html body.workspace .presentation-library.library-list-view .library-thumbnail{grid-column:1;grid-row:1/3;align-self:center;width:112px;max-height:none}
html body.workspace .presentation-library.library-list-view .library-item strong{grid-column:2;grid-row:1;align-self:end;min-height:0;margin:0}
html body.workspace .presentation-library.library-list-view .library-item small{grid-column:2;grid-row:2;align-self:start;margin:0}
@media(max-width:600px){
 html body.workspace .presentation-library.library-list-view .library-item{grid-template-columns:88px minmax(0,1fr);column-gap:12px;min-height:80px;padding:8px 12px 8px 8px}
 html body.workspace .presentation-library.library-list-view .library-thumbnail{width:88px}
 html body.workspace .presentation-library.library-list-view .library-item strong{font-size:var(--t-headline)}
}