/* Application design source: /DESIGN.md, PART A.
 * Output boundaries retain the Light/100% inheritance baseline, independently of chrome. */
:root, :where(.detail-page,.page-viewport,.quick-preview .preview-paper) {
 --app-ui-scale:1;
 color-scheme:light;
 --dps-left-row-height:clamp(30px,calc(34px * var(--app-ui-scale)),41px);
 --workspace-tab-height:var(--dps-left-row-height);
 --workspace-icon-hit-size:clamp(28px,calc(32px * var(--app-ui-scale)),39px);
 --property-heading-height:clamp(32px,calc(36px * var(--app-ui-scale)),44px);
 --color-control-height:clamp(28px,calc(30px * var(--app-ui-scale)),36px);
 --service-control-height:clamp(24px,calc(26px * var(--app-ui-scale)),32px);
 --app-canvas:#f5f5f5;
 --app-surface:#ffffff;
 --app-ink:#303030;
 --app-muted:#707070;
 --app-line:#dedede;
 --app-accent:#245d50;
 --app-accent-hover:#194b40;
 --app-accent-soft:#eaf2ed;
 --app-accent-selection:var(--app-accent);
 --app-accent-structure-selection:#687347;
 --app-control-text:#303030;
 --app-control-border:#d9d9d9;
 --app-control-hover:#f3f3f3;
 --app-control-selected:#eaeaea;
 --app-control-pressed:#e1e1e1;
 --app-primary-hover:#1f1f1f;
 --app-control-muted:#757575;
 --app-focus:#737373;
 /* Shared neutral interaction roles; keyboard focus is independent of dragging. */
 --interaction-line-hover:color-mix(in srgb,var(--app-ink) 32%,var(--app-surface));
 --interaction-line-drag:color-mix(in srgb,var(--app-ink) 55%,var(--app-surface));
 --interaction-focus:var(--app-focus);
 --app-canvas-highlight:#555555;
 --app-danger:#444444;
 --app-danger-soft:#f0f0f0;
 --app-warning:#555555;
 --app-warning-soft:#f1f1f1;
 --app-surface-subtle:#fafafa;
 --app-overlay:rgba(0,0,0,.4);
 --app-shadow-overlay:0 24px 80px #0003;
 --font-sans:'Pretendard Variable','Noto Sans CJK KR','Malgun Gothic','Apple SD Gothic Neo',sans-serif;
 --font-ui:'Source Han Sans KR VF','Malgun Gothic','Apple SD Gothic Neo',sans-serif;
 --font-serif:'DPS-font-source-han-serif-kr','Batang',serif;
 --font-mono:Consolas,monospace;

 --type-service-xs:12px;
 --type-service-sm:13px;
 --type-service-md:14px;
 --type-service-lg:15px;
 --type-service-xl:17px;
 --type-service-2xl:20px;
 --type-service-display:28px;
 /* The canonical base sizes remain fixed; personal scale changes semantic roles. */
 --type-page-title:calc(var(--type-service-display) * var(--app-ui-scale));
 --type-workspace-title:calc(var(--type-service-xl) * var(--app-ui-scale));
 --type-section-title:calc(var(--type-service-lg) * var(--app-ui-scale));
 --type-panel-title:calc(var(--type-service-md) * var(--app-ui-scale));
 --type-card-title:calc(var(--type-service-sm) * var(--app-ui-scale));
 --type-body:var(--type-card-title);
 --type-body-sm:calc(var(--type-service-xs) * var(--app-ui-scale));
 --type-navigation:var(--type-body-sm);
 --type-button:var(--type-body-sm);
 --type-input:var(--type-body-sm);
 --type-field-label:var(--type-body-sm);
 --type-helper:var(--type-body-sm);
 --type-caption:var(--type-body-sm);
 --type-meta:var(--type-body-sm);
 --type-mono:var(--type-body-sm);
 --type-large-title:calc(var(--type-service-2xl) * var(--app-ui-scale));
 --type-body-emphasis:calc(16px * var(--app-ui-scale));
 --type-dialog-title:calc(18px * var(--app-ui-scale));
 --type-viewer-title:calc(21px * var(--app-ui-scale));
 --type-empty-title:calc(23px * var(--app-ui-scale));
 --type-statistic:calc(25px * var(--app-ui-scale));
 --type-code-display:calc(27px * var(--app-ui-scale));
 --type-statistic-large:calc(30px * var(--app-ui-scale));
 --type-home-display:calc(52px * var(--app-ui-scale));
 --type-home-hero:clamp(calc(52px * var(--app-ui-scale)),calc(6vw * var(--app-ui-scale)),calc(94px * var(--app-ui-scale)));
 --type-editor-title-base:14px;
 --type-editor-control-base:11px;
 --type-editor-field-label-base:11px;
 --type-editor-value-base:12px;
 --type-editor-helper-base:11px;
 --type-editor-layer-base:11px;
 --type-editor-meta-base:10px;
 --type-editor-micro-meta-base:9px;
 --type-editor-title:calc(var(--type-editor-title-base) * var(--app-ui-scale));
 --type-editor-control:calc(var(--type-editor-control-base) * var(--app-ui-scale));
 --type-editor-field-label:calc(var(--type-editor-field-label-base) * var(--app-ui-scale));
 --type-editor-value:calc(var(--type-editor-value-base) * var(--app-ui-scale));
 --type-editor-helper:calc(var(--type-editor-helper-base) * var(--app-ui-scale));
 --type-editor-layer:calc(var(--type-editor-layer-base) * var(--app-ui-scale));
 --type-editor-meta:calc(var(--type-editor-meta-base) * var(--app-ui-scale));
 --type-editor-micro-meta:calc(var(--type-editor-micro-meta-base) * var(--app-ui-scale));
 --weight-regular:400;
 --weight-medium:500;
 --weight-semibold:600;
 --weight-section:650;
 --weight-bold:700;
 --leading-title:1.25;
 --leading-control:1.4;
 --leading-card:1.45;
 --leading-body:1.6;
 --leading-helper:1.55;
 --tracking-title:-1px;
 --tracking-workspace:-.2px;

 --space-1:4px;
 --space-2:8px;
 --space-3:12px;
 --space-4:16px;
 --space-5:20px;
 --space-6:24px;
 --space-8:32px;
 --space-12:48px;
 --radius-compact:4px;
 --radius-inset:6px;
 --radius-control:7px;
 --radius-single:5px;
 --radius-row:8px;
 --radius-panel:10px;
 --control-regular-height:clamp(34px,calc(38px * var(--app-ui-scale)),46px);
 --control-navigation-height:clamp(44px,calc(50px * var(--app-ui-scale)),60px);
 --control-compact-height:clamp(28px,calc(32px * var(--app-ui-scale)),39px);
 --control-dense-height:clamp(26px,calc(28px * var(--app-ui-scale)),34px);
 --icon-dense:14px;
 --icon-standard:16px;
 --icon-emphasis:20px;
 --motion-fast:140ms;
 --motion-standard:180ms;
 --motion-slow:240ms;
 --motion-easing:ease;

 /* Legacy blue/blue-bg are Green accent aliases, never a Blue palette. */
 --bg:var(--app-canvas);--white:var(--app-surface);--ink:var(--app-ink);
 --muted:var(--app-muted);--line:var(--app-line);
 --blue:var(--app-accent);--blue-bg:var(--app-accent-soft);--green:var(--app-accent);
 --control-focus:var(--app-focus);--control-surface:var(--app-surface);
 --control-text:var(--app-control-text);--control-border:var(--app-control-border);
 --control-hover:var(--app-control-hover);--control-selected:var(--app-control-selected);
 --control-muted:var(--app-control-muted);--control-edit:var(--app-accent);
 --control-edit-hover:var(--app-accent-hover);--canvas-highlight:var(--app-canvas-highlight);
 --control-sticky-shadow:0 5px 10px color-mix(in srgb,var(--control-text) 14%,transparent);
 --control-small-height:var(--control-compact-height);
 --control-height:var(--control-regular-height);
 --control-gap:var(--space-2);--control-group-gap:var(--space-4);
 --control-tab-font-size:var(--type-button);--control-tab-font-weight:var(--weight-semibold);
 --control-label-gap:0px;--control-support-gap:3px;--control-heading-gap:1px;
 --control-field-gap:var(--space-2);--control-panel-gap:6px;
 --control-panel-group-gap:var(--space-3);--control-panel-inset:var(--space-2);
 /* Workspace headers and Editor top rows share one desktop rhythm. */
 --workspace-header-height:clamp(44px,calc(48px * var(--app-ui-scale)),58px);--service-bar-height:clamp(36px,calc(40px * var(--app-ui-scale)),48px);
 --workspace-content-max-width:1320px;--workspace-content-inset:30px;
 --workspace-header-inset:var(--workspace-content-inset);
 --workspace-control-height:var(--control-regular-height);
 --workspace-control-radius:var(--radius-single);--workspace-surface:var(--app-surface);
}

:root[data-theme="dark"] {
 color-scheme:dark;
 --app-canvas:#1f1f1f;--app-surface:#292929;--app-surface-subtle:#333333;
 --app-ink:#eeeeee;--app-muted:#b6b6b6;--app-line:#4a4a4a;
 --app-accent:#98c8b0;--app-accent-hover:#b3dbc6;--app-accent-soft:#2d4336;
 --app-accent-selection:color-mix(in srgb,var(--app-accent) 65%,var(--app-canvas));
 --app-accent-structure-selection:#7e8966;
 --app-control-text:#e8e8e8;--app-control-border:#606060;
 --app-control-hover:#3a3a3a;--app-control-selected:#444444;--app-control-pressed:#4e4e4e;
 --app-primary-hover:#ffffff;--app-control-muted:#aaaaaa;--app-focus:#b8b8b8;
 --app-canvas-highlight:#c5c5c5;
 --app-danger:#e5e5e5;--app-danger-soft:#383838;
 --app-warning:#d4d4d4;--app-warning-soft:#353535;
 --app-overlay:rgba(0,0,0,.6);
 --app-shadow-overlay:0 24px 80px #0006;
}
/* Frozen output inheritance baseline: changing chrome colors must not recolor content.
 * Selection/focus are editor utilities; their neutral palette is shared intentionally. */
:where(.detail-page,.page-viewport,.quick-preview .preview-paper) {
 --app-ink:#24342e;--app-muted:#758079;--app-line:#e1e5df;
 --app-control-muted:#888888;--app-surface-subtle:#fafbf9;
 --app-danger:#a13a36;--app-danger-soft:#fff1ef;
 --app-warning:#8d661b;--app-warning-soft:#fff6df;
}
:root[data-ui-scale="80"] { --app-ui-scale:.8; }
:root[data-ui-scale="90"] { --app-ui-scale:.9; }
:root[data-ui-scale="110"] { --app-ui-scale:1.1; }
:root[data-ui-scale="120"] { --app-ui-scale:1.2; }
/* Reset inherited body typography as well as tokens, without touching canonical elements. */
:where(.detail-page,.page-viewport,.quick-preview .preview-paper) {
 font-family:var(--font-sans);font-size:13px;line-height:1.6;color:var(--app-ink);
}

/* Shared primitives may appear in either zone; explicit Editor roles stay dense. */
.editor-app {
 --type-field-label:var(--type-editor-field-label);
 --type-helper:var(--type-editor-helper);
 --type-caption:var(--type-editor-helper);
 --type-meta:var(--type-editor-meta);
}
@media(max-width:750px) { :root { --workspace-content-inset:18px; } }
@media(prefers-reduced-motion:reduce) {
 :root { --motion-fast:0ms;--motion-standard:0ms;--motion-slow:0ms; }
}