/* Shared presentation for the six approved workspaces only. */
#content[data-design-page] { --cd-line:#e3eaf4; --cd-ink:var(--ink,#263445); --cd-muted:var(--muted,#718199); --cd-surface:var(--surface,#fff); color:var(--cd-ink); }
.cd-blue { --cd-tint:#edf3ff; --cd-accent:#2e6cf2; }
.cd-green { --cd-tint:#ecf8f3; --cd-accent:#119d75; }
.cd-orange { --cd-tint:#fff5eb; --cd-accent:#e78227; }
.cd-purple { --cd-tint:#f5efff; --cd-accent:#9258d5; }
.cd-sky { --cd-tint:#edf8ff; --cd-accent:#2194cb; }
.cd-rose { --cd-tint:#fff2f7; --cd-accent:#d75e91; }
#content[data-design-page] [hidden] { display:none!important; }
.cd-intro { display:flex; justify-content:space-between; align-items:center; gap:20px; margin:4px 0 26px; }
.cd-intro h1 { font-size:29px; line-height:1.35; margin:0 0 8px; letter-spacing:.02em; }
.cd-intro p { margin:0; color:var(--cd-muted); font-size:14px; }
.cd-icon { display:inline-flex; align-items:center; justify-content:center; flex:0 0 48px; width:48px; height:48px; border-radius:50%; color:var(--cd-accent,#2e6cf2); background:color-mix(in srgb,var(--cd-surface,#fff) 80%,transparent); }
.cd-icon svg { width:25px; height:25px; }
#content[data-design-page] .cd-metrics { display:grid; grid-auto-flow:column; grid-template-columns:none; grid-auto-columns:minmax(0,1fr); gap:12px; margin:0 0 24px; padding:12px; background:var(--cd-surface); border:1px solid var(--cd-line); border-radius:20px; box-shadow:0 4px 18px #24456704; }
.cd-metric { background:var(--cd-tint); border-radius:13px; display:flex; align-items:center; gap:16px; padding:20px; min-width:0; }
.cd-metric>div { min-width:0; }
.cd-metric span:not(.cd-icon),.cd-old-metric>span:not(.cd-icon) { color:var(--cd-muted); font-size:13px; }
.cd-metric strong { color:var(--cd-accent); display:block; font-size:29px; line-height:1.2; margin-top:8px; }
#content[data-design-page] .cc-detail-heading { display:none; }
#content[data-design-page] .cc-admin-home { margin:0; padding:0; border:0; background:none; box-shadow:none; }
#content[data-design-page] .cd-old-metric { position:relative; display:grid; grid-template-columns:44px minmax(0,1fr); gap:5px 13px; background:var(--cd-tint); border:0; border-radius:13px; padding:18px 14px; min-width:0; }
#content[data-design-page] .cd-old-metric .cd-icon { grid-column:1; grid-row:1/4; width:44px; height:44px; align-self:center; }
#content[data-design-page] .cd-old-metric>span:not(.cd-icon),#content[data-design-page] .cd-old-metric>strong,#content[data-design-page] .cd-old-metric>small { grid-column:2; padding:0; margin:0; min-width:0; }
#content[data-design-page] .cd-old-metric>strong { font-size:27px; line-height:1.25; color:var(--cd-accent); }
#content[data-design-page] .cd-old-metric>small { color:var(--cd-muted); font-size:11px; }
#content[data-design-page] .cd-old-metric.cc-eta-stat>strong { font-size:clamp(16px,1.4vw,24px); white-space:nowrap; }
.cd-split { display:grid; grid-template-columns:315px minmax(0,1fr); gap:22px; align-items:start; }
.cd-master { background:var(--cd-surface); border:1px solid var(--cd-line); border-radius:18px; padding:12px; min-width:0; }
.cd-master-label { margin:5px 8px 13px; color:var(--cd-muted); font-size:13px; font-weight:600; }
.cd-detail { min-width:0; }
.cd-tabs { display:flex; flex-wrap:wrap; gap:6px; }
.cd-tab { color:var(--cd-muted); font:inherit; font-size:13px; border:0; border-radius:8px; padding:9px 13px; background:transparent; cursor:pointer; }
.cd-tab.active { color:#2e6cf2; background:var(--cd-blue-tint,#edf3ff); font-weight:600; }
.cd-categories { padding:0 4px 12px; border-bottom:1px solid var(--cd-line); margin-bottom:10px; }
.cd-categories .cd-tab { font-size:12px; padding:7px 8px; }
.cd-choice { display:block; text-align:left; width:100%; padding:17px 13px; border:1px solid transparent; border-radius:12px; background:transparent; color:var(--cd-ink); font:inherit; margin:5px 0; cursor:pointer; overflow-wrap:anywhere; }
.cd-choice:hover { background:var(--cd-blue-tint,#f5f8ff); }
.cd-choice.active { border-color:#cddfff; background:var(--cd-blue-tint,#edf3ff); }
.cd-choice-title { display:flex; align-items:center; gap:10px; line-height:1.5; font-size:14px; }
.cd-choice .cd-icon { background:var(--cd-tint); flex-basis:34px; width:34px; height:34px; }
.cd-choice .cd-icon svg { width:18px; height:18px; }
.cd-choice>small { display:block; color:var(--cd-muted); font-size:11px; margin:9px 0; line-height:1.7; }
.cd-choice>p { color:var(--cd-muted); font-size:13px; line-height:1.7; margin:9px 0; }
.cd-choice .cc-status { font-size:11px; }
#content[data-design-page] .cd-search-panel { padding:17px 20px 10px; margin:0 0 22px; background:var(--cd-surface); border:1px solid var(--cd-line); border-radius:16px; box-shadow:none; }
#content[data-design-page] #approvalInboxSearch { display:flex; align-items:end; gap:12px; margin:0 0 12px; }
#content[data-design-page] #approvalInboxSearch label { flex:1; }
#content[data-design-page] #approvalInboxSearch .btn { width:auto; min-width:100px; height:43px; }
#content[data-design-page] #approvalInboxSearch label>span { display:none; }
#content[data-design-page] input:not([type=checkbox]):not([type=radio]):not([type=file]),#content[data-design-page] select,#content[data-design-page] textarea { border-radius:9px; border-color:var(--cd-line); min-height:42px; }
#content[data-design-page] .cc-section[data-approval-list] { padding:0; margin:0; }
#content[data-design-page] [data-approval-list]>h2 { display:none; }
#content[data-design-page] [data-approval-list]>.cc-list { margin:0; gap:0; }
#content[data-design-page] .cd-detail .cc-card { padding:24px; border:1px solid var(--cd-line); border-radius:18px; box-shadow:none; background:var(--cd-surface); overflow:hidden; }
#content[data-design-page] .cd-card-banner { background:linear-gradient(110deg,var(--cd-tint),var(--cd-surface)); padding:22px 24px; margin:-24px -24px 23px; gap:14px; }
.cd-card-banner>strong { flex:1; min-width:0; overflow-wrap:anywhere; font-size:19px; }
#content[data-design-page] .cc-card .cc-meta { color:var(--cd-muted); line-height:1.8; font-size:13px; }
.cd-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; padding:23px 0; margin-bottom:8px; border-bottom:1px solid var(--cd-line); }
.cd-fact small { display:block; color:var(--cd-muted); margin-bottom:7px; }
.cd-fact strong { display:block; font-size:14px; font-weight:500; overflow-wrap:anywhere; white-space:pre-line; }
.cd-full { grid-column:1/-1; }
#content[data-design-page] .cc-actions { flex-wrap:wrap; gap:10px; }
#content[data-design-page] .cc-workflow-pager { margin:16px 0; justify-content:flex-end; }
.cd-history { border-top:1px solid var(--cd-line); padding-top:18px; margin-top:22px; color:var(--cd-muted); font-size:13px; }
.cd-history>div { display:flex; flex-wrap:wrap; gap:10px; padding:12px 0; line-height:1.6; }
.cd-history>div small { margin-left:auto; }
.cd-empty { padding:30px 18px; color:var(--cd-muted); text-align:center; line-height:1.7; background:var(--cd-surface); border-radius:16px; }
.cd-task-layout { grid-template-columns:260px minmax(0,1fr); }
.cd-type-choice { display:flex; align-items:center; text-align:left; width:100%; gap:13px; background:var(--cd-tint); color:var(--cd-ink); border:1px solid transparent; border-radius:13px; padding:18px 14px; font:inherit; font-size:14px; margin:0 0 11px; cursor:pointer; }
.cd-type-choice:last-child { margin-bottom:0; }
.cd-type-choice>span:last-child { color:var(--cd-accent); font-size:23px; margin-left:auto; }
.cd-type-choice.active { border-color:var(--cd-accent); box-shadow:0 0 0 1px color-mix(in srgb,var(--cd-accent) 12%,transparent); }
.cd-type-choice .cd-icon { flex-basis:40px; width:40px; height:40px; }
#content[data-design-page] .cd-task-panel { margin:0; padding:0; background:var(--cd-surface); border:1px solid var(--cd-line); border-radius:18px; overflow:hidden; box-shadow:none; }
.cd-panel-head { display:flex; align-items:center; gap:17px; padding:23px 25px; background:linear-gradient(110deg,var(--cd-tint),var(--cd-surface)); }
.cd-panel-head>div { flex:1; min-width:0; }
.cd-panel-head h2,.cd-panel-head h3 { font-size:21px; margin:0 0 8px; }
.cd-panel-head p { color:var(--cd-muted); font-size:13px; line-height:1.65; margin:0; }
#content[data-design-page] .cd-task-panel>form { padding:25px; gap:20px; }
#content[data-design-page] .cd-task-panel>.cc-meta { padding:0 25px; }
.cd-native-type,.cd-old-title { display:none!important; }
#content[data-design-page] .cc-field { min-width:0; }
#content[data-design-page] .cc-field>span { font-size:13px; }
#content[data-design-page] .cc-field input[type=file] { width:100%; font-size:12px; }
#content[data-design-page] .cc-field textarea { min-width:0; resize:vertical; }
#content[data-design-page=cash] .deposit-panel { padding:0; border:1px solid var(--cd-line); border-radius:18px; overflow:hidden; box-shadow:none; }
#content[data-design-page=cash] .deposit-panel-head { margin:0 0 22px; }
#content[data-design-page=cash] .deposit-filters { padding:0 24px; }
#content[data-design-page=cash] .deposit-list { padding:0 24px 24px; display:grid; gap:12px; }
#content[data-design-page=cash] .deposit-row { padding:21px; border:1px solid var(--cd-line); border-radius:12px; min-width:0; }
#content[data-design-page=cash] .deposit-store-icon { background:#edf3ff; color:#2e6cf2; border-radius:50%; width:46px; height:46px; flex:0 0 46px; }
.deposit-store-icon svg { width:23px; height:23px; }
.cd-after-layout { display:grid; grid-template-columns:330px minmax(0,1fr); gap:22px; align-items:start; }
.cd-after-layout.cd-after-readonly { grid-template-columns:minmax(0,1fr); }
#content[data-design-page] .cd-after-create { margin:0; padding:0; border:1px solid var(--cd-line); border-radius:18px; overflow:hidden; box-shadow:none; }
#content[data-design-page] .cd-after-create .cd-panel-head { padding:23px 20px; }
#content[data-design-page] .cd-after-create .cd-panel-head h2 { font-size:18px; }
#content[data-design-page] .cd-after-create>form { padding:22px; display:block; }
#content[data-design-page] .cd-after-create>form>.cc-field { margin-bottom:20px; }
#content[data-design-page] .cd-after-create>.cc-meta { padding:12px 22px 0; }
#content[data-design-page] .cd-after-list { padding:0; margin:0; min-width:0; }
#content[data-design-page] .cd-after-list>h2 { font-size:19px; margin:0 0 16px; }
#content[data-design-page] .after-sales-card { border:1px solid var(--cd-line); border-radius:16px; padding:22px; box-shadow:none; }
#content[data-design-page] .after-sales-card .cc-card-top { gap:10px; }
#content[data-design-page] .after-sales-card .cc-card-top>strong { flex:1; min-width:0; }
#content[data-design-page] .after-sales-card .cc-card-top>.cd-icon { width:38px; height:38px; flex-basis:38px; background:var(--cd-tint); }
#content[data-design-page] .after-sales-card .cc-card-top>.cd-icon svg { width:21px; height:21px; }
#content[data-design-page] .cd-purchase-section { padding:0; margin:0; }
#content[data-design-page] .cc-purchase-card { border:1px solid var(--cd-line); border-radius:18px; padding:24px; overflow:hidden; box-shadow:none; }
#content[data-design-page] .cd-eta { border:1px solid var(--cd-line); background:var(--cd-blue-tint,#f4f8ff); border-radius:10px; padding:14px 18px; margin:20px 0; }
#content[data-design-page] .cd-eta strong { font-size:20px; color:#2e6cf2; margin:0 10px; }
#content[data-design-page] .cc-ann-section { padding:0; margin:0; }
#content[data-design-page] .cc-ann-head>h3 { display:none; }
#content[data-design-page] .cc-ann-head { justify-content:flex-end; }
#content[data-design-page] .cc-ann-head-actions { width:100%; justify-content:space-between; }
#content[data-design-page] .cc-announcement-item>p { line-height:1.95; font-size:15px; white-space:pre-wrap; overflow-wrap:anywhere; padding:13px 0 22px; }
#content[data-design-page] .cc-announcement-images { flex-wrap:wrap; }
.cd-modal { --cd-surface:#fff; --cd-line:#e3eaf4; }
.cd-modal .modal { border:1px solid var(--cd-line); border-radius:20px; overflow:hidden; }
.cd-modal .modal-header { gap:16px; background:linear-gradient(100deg,#edf3ff,#fff); padding:22px 26px; }
.cd-modal .modal-title { flex:1; font-size:21px; }
.cd-modal .modal-close { margin-left:auto; }
.cd-modal .modal-body { padding:25px 26px; }
.cd-modal .modal-footer { border-top:1px solid var(--cd-line); background:#fafcff; padding:18px 26px; }
.cd-modal .cc-form-grid { gap:20px; }
.cd-modal input,.cd-modal select,.cd-modal textarea { border-radius:9px; }
.cd-modal .cc-field { min-width:0; }
.app-shell[data-theme=dark] #content[data-design-page] { --cd-line:#2d3d50; --cd-blue-tint:#202e48; }
.app-shell[data-theme=dark] .cd-blue,.cd-modal[data-theme=dark] .cd-blue { --cd-tint:#202e48; --cd-accent:#83b0ff; }
.app-shell[data-theme=dark] .cd-green { --cd-tint:#163c34; --cd-accent:#70dbb1; }
.app-shell[data-theme=dark] .cd-orange { --cd-tint:#3d3024; --cd-accent:#ffc078; }
.app-shell[data-theme=dark] .cd-purple { --cd-tint:#332746; --cd-accent:#c49aee; }
.app-shell[data-theme=dark] .cd-sky { --cd-tint:#1c3545; --cd-accent:#73c7ee; }
.app-shell[data-theme=dark] .cd-rose { --cd-tint:#3d2636; --cd-accent:#f7a1c7; }
.cd-modal[data-theme=dark] { --cd-surface:#141b22; --cd-line:#2d3d50; }
.cd-modal[data-theme=dark] .modal-header { background:linear-gradient(100deg,#202e48,#141b22); }
.cd-modal[data-theme=dark] .modal-footer { background:#141b22; }
.cd-choice:focus-visible,.cd-type-choice:focus-visible,.cd-tab:focus-visible { outline:3px solid #75a9ff; outline-offset:2px; }
@media(max-width:1200px) {
  .cd-split { grid-template-columns:265px minmax(0,1fr); gap:17px; }
  .cd-task-layout { grid-template-columns:230px minmax(0,1fr); }
  .cd-after-layout { grid-template-columns:290px minmax(0,1fr); gap:18px; }
  #content[data-design-page=purchasing] .cd-metrics { grid-auto-flow:row; grid-template-columns:repeat(3,minmax(0,1fr)); }
  .cd-metric { gap:12px; padding:16px; }
}
@media(max-width:900px) {
  .cd-after-layout { grid-template-columns:minmax(0,1fr); }
  #content[data-design-page] .cd-metrics { grid-auto-flow:row; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cd-metric:last-child:nth-child(odd) { grid-column:1/-1; }
  #content[data-design-page=cash] .deposit-row { padding:17px; }
}
@media(max-width:720px) {
  .cd-intro { margin-bottom:20px; align-items:flex-start; }
  .cd-intro h1 { font-size:25px; }
  .cd-intro p { font-size:12px; line-height:1.7; }
  .cd-intro-actions .btn { white-space:nowrap; font-size:12px; }
  .cd-split { grid-template-columns:minmax(0,1fr); gap:18px; }
  .cd-master { max-height:340px; overflow:auto; }
  .cd-task-layout>.cd-master { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; max-height:none; }
  .cd-task-layout .cd-master-label { grid-column:1/-1; }
  .cd-type-choice { padding:12px 8px; font-size:12px; gap:7px; margin:0; }
  .cd-type-choice .cd-icon { width:30px; height:30px; flex-basis:30px; }
  .cd-type-choice .cd-icon svg { width:19px; height:19px; }
  .cd-type-choice>span:last-child { display:none; }
  #content[data-design-page] .cd-metrics { padding:8px; gap:8px; border-radius:14px; }
  .cd-metric { padding:13px 10px; gap:8px; }
  .cd-metric>.cd-icon { flex-basis:34px; width:34px; height:34px; }
  .cd-metric>.cd-icon svg { width:21px; height:21px; }
  .cd-metric strong { font-size:24px; }
  .cd-metric span:not(.cd-icon) { font-size:11px; }
  #content[data-design-page] .cd-detail .cc-card,#content[data-design-page] .cc-purchase-card { padding:18px; }
  #content[data-design-page] .cd-card-banner { padding:18px; margin:-18px -18px 20px; flex-wrap:wrap; }
  .cd-card-banner>strong { font-size:17px; }
  .cd-panel-head { padding:20px 18px; flex-wrap:wrap; }
  .cd-panel-head h2,.cd-panel-head h3 { font-size:18px; }
  .cd-panel-head .cd-icon { width:40px; height:40px; flex-basis:40px; }
  #content[data-design-page] .cd-task-panel>form { padding:20px 18px; }
  #content[data-design-page] input:not([type=checkbox]):not([type=radio]):not([type=file]),#content[data-design-page] select,#content[data-design-page] textarea { font-size:16px; max-width:100%; }
  #content[data-design-page] .cd-search-panel { padding:15px 13px 8px; }
  #content[data-design-page] #approvalInboxSearch .btn { min-width:auto; }
  #content[data-design-page] #approvalInboxSearch label { min-width:0; }
  #content[data-design-page=cash] .deposit-list { padding:0 15px 15px; }
  #content[data-design-page=cash] .deposit-filters { padding:0 15px; }
  #content[data-design-page=purchasing] .cd-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #content[data-design-page] .cd-old-metric { grid-template-columns:minmax(0,1fr); padding:14px; }
  #content[data-design-page] .cd-old-metric .cd-icon { display:none; }
  #content[data-design-page] .cd-old-metric>span:not(.cd-icon),#content[data-design-page] .cd-old-metric>strong,#content[data-design-page] .cd-old-metric>small { grid-column:1; }
  #content[data-design-page] .cd-old-metric.cc-eta-stat { grid-column:1/-1; }
  #content[data-design-page] .cd-old-metric.cc-eta-stat>strong { font-size:23px; }
  #content[data-design-page] .cc-ann-head-actions { flex-wrap:wrap; gap:12px; }
  .cd-facts { gap:20px 14px; }
  .cd-modal .modal-header,.cd-modal .modal-body,.cd-modal .modal-footer { padding:18px; }
  .cd-modal .modal-title { font-size:19px; }
  .cd-modal .modal-header .cd-icon { width:36px; height:36px; flex-basis:36px; }
}

#content[data-design-page] .cd-old-metric>.cd-icon { color:var(--cd-accent); }
#content[data-design-page] .cd-purchase-section { background:transparent; border:0; box-shadow:none; }
#content[data-design-page] .cc-purchase-new { margin:14px 0 20px; padding:12px 16px; background:var(--cd-surface); border:1px solid var(--cd-line); border-radius:12px; }
#content[data-design-page] .cc-purchase-new>summary::before { content:none; }
#content[data-design-page] .cc-purchase-filters { gap:10px; margin-bottom:16px; }
#content[data-design-page=cash] .deposit-filters { margin-bottom:16px; }
.cd-modal[data-theme=dark] .modal { background:#141b22; color:#e8f0fc; }
.cd-modal[data-theme=dark] input,.cd-modal[data-theme=dark] textarea,.cd-modal[data-theme=dark] select { color:#e8f0fc; background:#1b2735; border-color:#2d3d50; }
.cd-modal[data-theme=dark] .cc-field>span,.cd-modal[data-theme=dark] .cc-meta { color:#aebed2; }
.cd-modal[data-theme=dark] .btn:not(.btn-primary):not(.btn-danger) { background:#1b2735; color:#a3c6ff; border-color:#39516b; }
.cd-modal [data-purchase-form-slot] .cc-form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
@media(max-width:600px) { .cd-modal [data-purchase-form-slot] .cc-form-grid { grid-template-columns:minmax(0,1fr); } }
/* Announcement reading content and permission-gated management controls. */
.announcement-reading-toolbar { display:flex; justify-content:flex-end; margin:0 0 18px; }
.announcement-reading-actions { margin-top:20px; }
.announcement-reading { display: grid; gap: 24px; width: 100%; min-width: 0; }
.announcement-reading-card { min-width: 0; padding: 34px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
.announcement-reading-title { margin: 0 0 24px; padding-inline-start: 16px; border-inline-start: 4px solid var(--ok-ink); font-size: 26px; line-height: 1.5; font-weight: 650; color: var(--ink); overflow-wrap: anywhere; }
.announcement-reading-body { color: var(--body); font-size: 16px; line-height: 1.95; white-space: pre-wrap; overflow-wrap: anywhere; }
.announcement-reading-images { display: grid; gap: 20px; min-width: 0; margin-top: 28px; }
.announcement-reading-image { display: block; width: 50%; min-width: 0; padding: 0; border: 0; border-radius: 12px; background: transparent; overflow: hidden; cursor: zoom-in; }
.announcement-reading-image img { display: block; width: 100%; height: auto; max-width: 100%; object-fit: contain; }
.announcement-thumbnail-status { display: block; padding: 22px 12px; color: var(--muted); font-size: 14px; line-height: 1.6; background: var(--surface); }
.announcement-reading-image[data-image-state=ready] .announcement-thumbnail-status { display:none; }
.announcement-reading-image:not([data-image-state=ready]) img { height:1px; opacity:0; }
.announcement-reading-image:focus-visible { outline: 3px solid var(--brand); outline-offset: 4px; }
.announcement-reading-image:disabled { cursor: progress; }
.announcement-reading-empty { margin: 0; padding: 36px; border-radius: 18px; border: 1px solid var(--line); background: var(--surface); color: var(--muted); }
@media (max-width: 900px) {
  .announcement-reading { gap: 18px; }
  .announcement-reading-card { padding: 24px 20px; }
  .announcement-reading-title { font-size: 23px; padding-inline-start: 12px; margin-bottom: 20px; }
  .announcement-reading-body { font-size: 15px; line-height: 1.9; }
  .announcement-reading-images { margin-top: 24px; gap: 16px; }
}
