/* Feature 039. Current guide foundations, element spacing and application contracts. */
@font-face{font-family:'Nunito Sans Condensed';src:url('NunitoSansCondensed-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
body{font-family:var(--kleis-font-family);font-size:var(--kleis-font-size-body)}
h1{font-size:var(--kleis-font-size-h1);line-height:1.25}h2{font-size:var(--kleis-font-size-h2)}h3{font-size:var(--kleis-font-size-h3)}h4{font-size:var(--kleis-font-size-h4)}h1,h2,h3,h4{font-weight:600;font-stretch:100%;line-height:1.25}
:lang(zh-Hant){letter-spacing:normal;font-family:'PingFang TC','Noto Sans TC',sans-serif;line-height:1.7}
.shop-heading h1{font-family:'Nunito Sans Condensed','PingFang TC','Noto Sans TC',sans-serif;font-weight:700;font-stretch:normal}
p{margin:0 0 1rem}.workarea>p:not(.meta):not(.identifier):not(.notice){max-width:75ch}.eyebrow{margin-bottom:.75rem}
.ledger,.inspector,.login,.preview{padding:var(--kleis-layout-panel-padding);border-radius:var(--kleis-radius-panel)}
.ledger h2,.inspector h2,.graph-toolbar h2{font-size:var(--kleis-font-size-h4)}.section-spaced{margin-top:var(--kleis-layout-section-gap)}
.workarea{container-type:inline-size}.workspace-grid{grid-template-columns:minmax(0,1fr);gap:1.5rem}@container(min-width:920px){.workspace-grid{grid-template-columns:minmax(480px,1fr) minmax(280px,340px)}}
form{display:flex;flex-direction:column;align-items:stretch;gap:var(--kleis-layout-field-gap);margin:1.5rem 0 0}form>button,form>.button{align-self:start}form>p{margin:0}form>label{margin:0}label{font-size:.875rem;font-weight:600;display:flex;flex-direction:column;gap:.5rem;margin:0 0 .5rem}label>input,label>select,label>textarea{margin:0}
input,select,textarea{font:inherit;font-size:1rem;line-height:1.5;border:1px solid var(--kleis-color-border-strong);padding:.625rem .75rem;border-radius:var(--kleis-control-radius);margin:0;min-width:0;max-width:100%;min-height:var(--kleis-control-hit-target)}textarea{font:14px/1.6 var(--kleis-font-family-code);resize:vertical}input[type=hidden]{display:none}input[type=file]{white-space:normal;overflow-wrap:anywhere}.form-grid,.filter-grid{gap:1.5rem}.form-grid label,.filter-grid label{margin-bottom:.5rem}
button,.button{font-size:.875rem;line-height:1.5;font-weight:600;min-height:44px;max-width:100%;white-space:normal;border-radius:8px;margin:0;transition:background-color 120ms,border-color 120ms,color 120ms}
.secondary{background:var(--kleis-color-surface-raised);color:var(--kleis-color-interactive);margin:0}.danger{color:var(--kleis-color-danger-text);border-color:var(--kleis-color-danger-border)}button:disabled{cursor:not-allowed;background:var(--kleis-surface-disabled);border-color:var(--kleis-color-border-strong);color:var(--kleis-color-text-secondary)}button:active:not(:disabled){background:var(--kleis-color-surface-selected);color:var(--kleis-color-interactive)}
.action-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}.notice{padding:1rem;border-radius:8px}.notice.review{border-color:var(--kleis-color-warning-border)}.notice.conflict{border-color:var(--kleis-color-danger-border)}
.state,.store-status{font:600 14px/20px var(--kleis-font-family);padding:4px 10px;border:1px solid var(--kleis-color-border-strong);border-radius:999px;max-width:100%;white-space:normal;overflow-wrap:anywhere}.state.approved{border-color:var(--kleis-color-success-border)}.state.review{border-color:var(--kleis-color-warning-border)}.state.conflict{border-color:var(--kleis-color-danger-border);border-style:solid}.state.neutral{color:var(--kleis-color-text-secondary)}
.sidebar{padding:2rem 1.25rem}.sidebar a{font-size:14px;font-weight:600;line-height:1.5;padding:12px;min-height:44px}.nav-group{display:grid;gap:4px;margin-top:16px}.nav-group-label{font-size:12px;margin:0 12px 4px;color:var(--kleis-color-text-muted)}.scope-label{margin-top:16px;padding:16px 12px}.sidebar a:hover{background:var(--kleis-color-surface-selected)}
.record-identifier,.identifier,.part-number,.inspector .identifier{font-family:var(--kleis-font-family-code);font-weight:600;font-variant-numeric:tabular-nums;font-variant-ligatures:none;letter-spacing:normal;white-space:pre-wrap;overflow-wrap:anywhere;display:inline;overflow:visible;max-width:100%}.summary strong,td.numeric{font-variant-numeric:tabular-nums}.table-scroll{max-width:100%;overflow:auto}.table-scroll:focus-visible,pre:focus-visible{outline-offset:-3px}caption{text-align:left;font-size:14px;color:var(--kleis-color-text-secondary);padding:0 0 12px}th,td{padding:16px;font-size:14px}th{text-align:start}td small{font-size:12px}.ledger form+form{border:1px solid var(--kleis-color-border);padding:24px;border-radius:16px;margin-top:24px}
.code-frame{margin:16px 0;border:1px solid var(--kleis-color-border);border-radius:8px;overflow:hidden;background:var(--kleis-color-surface-raised);min-width:0;max-width:100%}.code-frame figcaption{padding:16px;font-size:14px;color:var(--kleis-color-text-secondary)}.code-actions{display:flex;flex-wrap:wrap;gap:12px;padding:0 16px 16px}.code-frame pre{font:14px/1.6 var(--kleis-font-family-code);margin:0;padding:16px;white-space:pre;overflow:auto;tab-size:2;border:0;border-radius:0;max-height:32rem;background:var(--kleis-color-surface);color:var(--kleis-color-text)}.code-frame code{font:inherit;white-space:inherit}.code-wrapped pre{white-space:pre-wrap;overflow-wrap:anywhere}.code-feedback{font-size:14px;margin:0;padding:0 16px}.code-feedback:not(:empty){padding:16px}.code-frame .token{font:inherit}.code-frame .token.property{color:#003b5e;font-weight:600}.code-frame .token.string{color:#00626e}.code-frame .token.number,.code-frame .token.boolean,.code-frame .token.null{color:#71539c}.code-frame .token.punctuation,.code-frame .token.operator{color:#445460}
.view-control-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px;border:1px solid var(--kleis-color-border);border-radius:8px;background:white}.view-control-bar button{background:white;color:var(--kleis-color-interactive)}.view-control-bar output{min-width:4rem;text-align:center;font-variant-numeric:tabular-nums;font-size:14px}.graph-toolbar{align-items:start;gap:24px}.graph-toolbar h2{margin:0}.graph-picker{margin:16px 0}.graph-record{width:280px;height:112px;display:flex;flex-direction:column;gap:4px;padding:12px 16px;text-align:left;background:white;color:var(--kleis-color-text);border:1px solid var(--kleis-color-border-strong);border-radius:8px;overflow:hidden;cursor:pointer;font-weight:400}.graph-record:hover{background:var(--kleis-color-surface-selected)}.graph-record.graph-node-selected{background:var(--kleis-color-surface-selected);border-color:var(--kleis-color-interactive)}.graph-record:focus-visible{outline:2px solid var(--kleis-color-focus);outline-offset:-4px}.graph-record .graph-node-type{font-size:12px;color:var(--kleis-color-text-muted);line-height:16px}.graph-record .graph-node-name{font-size:16px;line-height:20px;font-weight:600;white-space:nowrap}.graph-record .graph-node-id{font:600 14px/18px var(--kleis-font-family-code);white-space:nowrap}.graph-record .graph-node-state{font-size:14px;line-height:18px;color:var(--kleis-color-text-secondary);white-space:nowrap}.graph-edge.graph-edge-selected path{stroke:var(--kleis-color-interactive);stroke-width:2}.graph-edge.graph-edge-selected text{fill:var(--kleis-color-interactive);font-weight:600}#graph-incoming{padding-left:20px;font-size:14px}#graph-incoming li{margin-bottom:12px}.graph-inspector h3{font-size:20px}.graph-inspector h4{font-size:16px}.form-feedback{margin:0}.table-scroll td .code-frame{min-width:260px}
@media(max-width:1199px){.workarea{padding:32px}.has-js .sidebar{z-index:5}.skip{z-index:10}}@media(max-width:767px){h1{font-size:2rem}h2{font-size:1.75rem}.workarea{padding:24px 16px}.ledger,.inspector,.login,.preview{padding:16px}.section-spaced{margin-top:48px}.summary{gap:24px;margin:24px 0 32px}.ledger form+form{padding:16px}.graph-toolbar{display:block}.view-control-bar{margin-top:16px}.shop-heading h1{font-size:48px}.shop-filters label{min-width:100%}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}@media(forced-colors:active){.state,.store-status,.notice,.graph-record,.code-frame{background:Canvas;color:CanvasText;border-color:CanvasText}.graph-record.graph-node-selected{border-color:Highlight}.graph-edge path{stroke:CanvasText}.graph-edge.graph-edge-selected path{stroke:Highlight}.code-frame .token{color:CanvasText!important}:focus-visible{outline-color:Highlight}button:disabled{color:GrayText}}

.view-control-bar button:disabled{color:var(--kleis-color-text-secondary);background:var(--kleis-surface-disabled);border-color:var(--kleis-color-border-strong)}.graph-record:disabled{cursor:default;background:var(--kleis-color-surface-raised);color:var(--kleis-color-text)}

.workarea p.identifier{display:block;margin-bottom:16px}.source-integrity{display:block;margin-bottom:16px}

.sidebar h2{font-size:20px}.graph-inspector #graph-record-details dd:nth-child(4){font-family:var(--kleis-font-family-code);font-weight:600;overflow-wrap:anywhere}

h3{margin-top:32px;margin-bottom:12px}h3:first-child{margin-top:0}h4{margin:32px 0 12px}.graph-inspector h3{margin-top:0}

@media(forced-colors:active){.sidebar a[aria-current=page]{outline:1px solid Highlight;outline-offset:-1px}}

/* Record type cues use the guide's unchanged SVG family, not status colors. */
.record-type-icon{display:inline-block;flex:none;vertical-align:middle;color:inherit;fill:none}.table-scroll a:has(>.record-type-icon){gap:8px}.table-scroll a:has(>.record-type-icon)>span{min-width:0;overflow-wrap:anywhere}.graph-record .graph-node-type{display:flex;align-items:center;gap:8px;min-height:16px}.graph-node-type .record-type-icon{width:16px;height:16px}@media(forced-colors:active){.record-type-icon{color:CanvasText}}

/* Standalone, authenticated commerce simulations. */
.preview-surface{width:100%;max-width:1360px;margin:0 auto;padding:40px;min-width:0}.preview-header{gap:24px}.preview-workspace-link{margin-left:auto;font-size:14px}.product-preview-launcher{margin:24px 0 32px}.product-preview-launcher>p{font-size:14px;margin-bottom:12px}.marketplace-masthead{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px;background:var(--kleis-color-surface-raised);border:1px solid var(--kleis-color-border);border-radius:16px;margin-bottom:16px}.marketplace-masthead h2{font-size:20px;margin:0}.marketplace-product-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;margin:32px 0}.marketplace-product-grid>section{min-width:0}.marketplace-terms{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:24px 0}.marketplace-terms dt{font-size:14px;color:var(--kleis-color-text-secondary)}.marketplace-terms dd{margin:8px 0 0;font-weight:600}.record-preview-link{font-size:14px;font-weight:400}.preview-surface h1,.preview-surface h2,.preview-surface p,.preview-surface dd{overflow-wrap:anywhere}.preview-surface .product-media-large{min-height:340px}.preview-surface .ledger{margin-bottom:24px}@media(max-width:1199px){.preview-surface{padding:32px}}@media(max-width:767px){.preview-surface{padding:24px 16px}.preview-header{flex-wrap:wrap;gap:16px}.preview-workspace-link{margin-left:0}.marketplace-product-grid{grid-template-columns:1fr;gap:24px}.marketplace-masthead{display:block;padding:16px}.marketplace-masthead>a{display:inline-block;margin-top:16px}.marketplace-terms{grid-template-columns:1fr}.preview-surface .product-media-large{min-height:220px}}

.catalog-photo{margin:0;background:var(--kleis-color-surface-raised);border-radius:16px;overflow:hidden}.catalog-photo img{display:block;width:100%;height:auto;max-height:540px;object-fit:contain}.shop-card .catalog-photo img{height:200px;object-fit:contain}.catalog-photo figcaption{padding:12px 16px;font-size:12px;color:var(--kleis-color-text-secondary)}.catalog-photo .image-error{margin:16px}

/* Feature 044: current application contracts and exact syntax roles. */
.code-frame .code-actions{gap:8px;width:fit-content;max-width:calc(100% - 32px);margin:0 16px 16px;padding:8px;border:1px solid var(--kleis-color-border);border-radius:var(--kleis-control-radius);background:var(--kleis-surface-panel)}
.record-action-set{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px;border:1px solid var(--kleis-color-border);border-radius:var(--kleis-control-radius);max-width:100%}
.structured-id{font:400 14px/1.6 var(--kleis-font-family-code);letter-spacing:normal;white-space:normal;overflow-wrap:anywhere}.structured-id .id-namespace{color:var(--kleis-color-identifier-namespace);font-weight:600}.structured-id .id-type{color:var(--kleis-color-identifier-type);font-weight:600}.structured-id .id-value{color:var(--kleis-color-identifier-value);font-weight:400}.structured-id .id-version{color:var(--kleis-color-identifier-version);font-weight:600}.structured-id .id-delimiter{color:var(--kleis-color-identifier-delimiter);font-weight:400}
.catalog-photo{background:transparent;border-radius:0;overflow:visible}.catalog-photo-frame{display:flex;align-items:center;justify-content:center;padding:16px;background:var(--kleis-surface-inset);border:1px solid var(--kleis-color-border);border-radius:var(--kleis-radius-panel);min-width:0}.catalog-photo .catalog-photo-frame img{display:block;width:auto;height:auto;max-width:100%;max-height:540px;object-fit:contain;border:0;border-radius:8px;background:transparent}.shop-card .catalog-photo-frame{min-height:232px}.shop-card .catalog-photo .catalog-photo-frame img{height:auto;max-height:200px}.catalog-photo figcaption{padding:16px 0;font-size:14px;line-height:1.6}.catalog-photo .notice{margin:0 0 16px}
.active-filter-context{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:24px 0}.active-filter-context p{margin:0}.active-filter-context a{display:inline-flex;align-items:center;min-height:44px;padding:8px 12px;border:1px solid var(--kleis-color-border);border-radius:8px;background:var(--kleis-surface-selected);font-size:14px}
:focus-visible{outline:2px solid var(--kleis-color-focus);outline-offset:3px}button:disabled{opacity:1;background:var(--kleis-surface-disabled);color:var(--kleis-text-disabled)}
@media(forced-colors:active){.structured-id span{color:CanvasText!important}.record-action-set,.code-frame .code-actions,.catalog-photo-frame{background:Canvas;border-color:CanvasText}.active-filter-context a{background:Canvas;color:LinkText}.catalog-photo img{forced-color-adjust:none}}

/* Reference rows stay distinct from the warm-gray page canvas. */
table{background:var(--kleis-table-row-background)}tbody tr{background:var(--kleis-table-row-background)}tbody tr:nth-child(even){background:var(--kleis-table-row-alt-background)}tbody tr.selected{background:var(--kleis-surface-selected)}th,td{vertical-align:middle}th.numeric,td.numeric{text-align:right;font-variant-numeric:tabular-nums}

/* Feature 045: measure field anatomy independently of form task spacing. */
.field-group{display:flex;flex-direction:column;gap:var(--kleis-layout-label-gap);min-width:0}.field-group>label,.field-group>input,.field-group>select,.field-group>textarea{margin:0}.form-grid>div,.filter-grid>div{display:flex;flex-direction:column;gap:var(--kleis-layout-label-gap)}.form-grid>div>label,.filter-grid>div>label{margin:0}
.task-action-row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--kleis-layout-action-gap)}.task-action-row>button{align-self:auto}.table-scroll td a:has(>.record-type-icon){display:inline-flex;align-items:start;gap:8px}.record-preview-link{display:block;width:fit-content;margin-top:8px}.exact-reference{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:16px 0}.exact-reference .reference-feedback{flex-basis:100%;font-size:14px;color:var(--kleis-color-text-secondary)}.exact-reference .reference-feedback:empty{display:none}.inline-record-action{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:8px;border:0;border-radius:8px;background:transparent;color:var(--kleis-color-interactive);font:600 14px/20px var(--kleis-font-family);text-decoration:underline;text-underline-offset:3px}.inline-record-action:hover{background:var(--kleis-surface-selected)}.record-state-context{display:flex;align-items:center;flex-wrap:wrap;gap:16px}.state.neutral{background:var(--kleis-surface-inset);color:var(--kleis-color-text-secondary);border-color:var(--kleis-color-border-strong)}
@media(forced-colors:active){.inline-record-action{background:Canvas;color:LinkText}.state.neutral{background:Canvas;color:CanvasText;border-color:CanvasText}}

/* All table record operations use explicit values, independent of copied text. */
.table-reference,.table-value{min-width:0;max-width:100%;display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px}.table-reference>.record-identifier{flex-basis:100%}.table-reference .record-action-set{gap:8px;background:var(--kleis-surface-panel);width:fit-content}.table-reference .record-action-set .button,.table-reference .record-action-set button{font-size:14px}.exact-copy-feedback{flex-basis:100%;font-size:14px;margin:0!important;color:var(--kleis-color-text-secondary)}.exact-copy-feedback:empty{display:none}.inline-reference-action{display:flex;align-items:center}.table-scroll table{width:100%;border-collapse:separate;border-spacing:0}.table-scroll tbody td{padding:20px;vertical-align:middle}.table-scroll th{padding:16px 20px}.table-scroll th.numeric,.table-scroll td.numeric{text-align:right}.table-scroll table caption:not(.sr-only){text-align:left}.target-search>.field-group{flex:1;min-width:0}.target-search>.field-group input{width:100%}
@media(max-width:767px){.table-reference .record-action-set{flex-wrap:wrap}.table-scroll tbody td,.table-scroll th{padding:16px}}

.table-scroll th.category,.table-scroll td.category{text-align:center}.record-action-set:has([data-exact-copy][hidden]){border:0;padding:0;background:transparent}.record-action-set:has([data-exact-copy][hidden]) .button{border:0;background:transparent;padding:8px;text-decoration:underline}
@media(min-width:768px){.table-reference>.record-identifier{flex:0 1 auto}.table-reference{gap:12px}.table-reference .record-action-set{flex:0 0 auto}}

/* Lookup ledgers become equivalent labeled records; comparisons retain local two-dimensional scroll. */
@media(max-width:767px){.record-ledger-table,.record-ledger-table tbody{display:block;width:100%}.record-ledger-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.record-ledger-table tbody tr{display:grid;gap:16px;padding:16px;margin-bottom:16px;border:1px solid var(--kleis-color-border);border-radius:16px}.table-scroll .record-ledger-table tbody td{display:block;width:100%;padding:0;text-align:left}.record-ledger-table td[data-label]::before{content:attr(data-label);display:block;font:600 14px/1.5 var(--kleis-font-family);color:var(--kleis-color-text-secondary);margin-bottom:8px}.record-ledger-table .table-reference .record-action-set{width:100%}.record-ledger-table .table-reference .record-action-set>*{flex:0 1 auto}.record-ledger-table .table-reference>.record-identifier{flex-basis:100%}}
@media(max-width:767px){.table-scroll .record-ledger-table{min-width:0;max-width:100%}.record-ledger-table tbody tr,.record-ledger-table td{min-width:0}.record-ledger-table tbody tr{grid-template-columns:minmax(0,1fr)}.record-ledger-table .table-reference .record-action-set{max-width:100%}}
.table-scroll td>a:has(>.record-type-icon),.record-ledger-table td:first-child>a:not(.record-preview-link){font-size:16px;font-weight:600;line-height:1.5}.table-scroll .record-preview-link{font-size:14px;font-weight:400}

.atlas-result .record-identifier,#atlas-selection-hint.structured-id{font:400 14px/1.6 var(--kleis-font-family-code)}#atlas-record .record-action-set{margin-top:16px}#atlas-record .reference-feedback{font-size:14px;margin-top:8px}#atlas-connections .record-action-set{gap:8px}#atlas-connections .record-action-set>.atlas-connection{margin:0!important}#atlas-record .state{font:600 14px/20px var(--kleis-font-family)}

.atlas-view-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:8px;border:1px solid var(--kleis-color-border);border-radius:8px;background:var(--kleis-surface-panel)}.atlas-controls .atlas-view-actions button{margin:0}.atlas-controls{gap:12px}@media(max-width:767px){.atlas-view-actions{width:100%}.atlas-view-actions>button{flex:1 1 120px}}