/* Approved KATA refined presentation. Production fills and media geometry keep
   their original lifecycle, timing and semantic state colours. */
.operation-grid{align-items:stretch;gap:16px}
.operation-card,.station-card,.work-panel,.work-context,.station-work-panel,.chart{
 background:var(--kata-panel,#fcfdfe);
 border:1px solid var(--kata-border,#b6c9d5);
 border-radius:10px;
 box-shadow:var(--kata-shadow,0 5px 16px #163a5014);
 min-width:0;
}
.identity{
 border-color:var(--kata-border,#b6c9d5);
 background:var(--kata-panel,#fcfdfe);
 color:var(--kata-text,#15394d);
}
.identity h1,.identity h2,.identity h3,.layout-node-info>strong{color:var(--kata-text,#15394d)}
.identity h2,.identity h3{font-weight:700;letter-spacing:-.25px}
.identity .kpis strong,.identity .bar-time strong,.timing strong{
 font-variant-numeric:tabular-nums;
 white-space:nowrap;
 overflow-wrap:normal;
 word-break:normal;
}
.identity .kpis small{font-weight:500}
.identity .kpis span,.identity .bar-time>span{line-height:1.25}
.operation-performance-card{padding:0;overflow:hidden;gap:0}
.operation-performance-card>.identity{
 border-width:0 0 1px;
 border-radius:0;
 padding:20px;
 min-height:108px;
 background:var(--kata-card-tint,#edf3f7);
}
.operation-performance-card>.identity h2{font-size:27px}
.operation-overview-body{padding:18px 20px}

/* Every process reserves the same product row, including empty positions. */
.operation-process-grid{align-items:stretch;gap:14px;grid-auto-rows:1fr}
.operation-process-grid>.process-card{display:flex;flex-direction:column;min-width:0}
.approved-operation .operation-process-grid .process-card>.identity{
 display:grid;
 grid-template-columns:minmax(0,1fr) max-content;
 grid-template-rows:68px minmax(51px,1fr);
 align-items:end;
 gap:0 12px;
 padding:14px 14px 12px;
 min-height:165px;
 height:100%;
 border-radius:10px;
 box-shadow:var(--kata-shadow,0 5px 16px #163a5014);
 background:linear-gradient(180deg,var(--kata-card-tint,#edf3f7) 0,var(--kata-card-tint,#edf3f7) 79px,var(--kata-panel,#fcfdfe) 79px,var(--kata-panel,#fcfdfe) 100%);
}
.approved-operation .operation-process-grid .identity>div:first-of-type{
 grid-column:1/-1;
 grid-row:1;
 display:grid;
 grid-template-rows:23px 16px 29px;
 align-self:start;
 align-content:start;
 min-height:68px;
 min-width:0;
 width:auto;
}
.approved-operation .operation-process-grid .identity h2{
 font-size:17px;
 line-height:1.25;
 white-space:nowrap;
 overflow:hidden;
 text-overflow:ellipsis;
}
.approved-operation .operation-process-grid .identity p{
 margin:0;
 max-width:none;
 font-size:10px;
 line-height:1.3;
 white-space:nowrap;
 overflow:hidden;
 text-overflow:ellipsis;
}
.approved-operation .operation-process-grid .identity .process-unit-label{
 grid-row:3;
 min-height:24px;
 align-self:center;
 font-size:14px;
 font-weight:650;
 color:var(--kata-text,#15394d);
}
.approved-operation .operation-process-grid .identity>.kpis{
 grid-column:1;
 grid-row:2;
 display:grid;
 grid-template-columns:repeat(2,minmax(0,1fr));
 align-items:end;
 align-self:stretch;
 gap:12px;
 width:100%;
 margin:0;
 padding-top:10px;
 border-top:1px solid #d7e3eb;
}
.approved-operation .operation-process-grid .identity .kpis>div{gap:3px;min-width:0}
.approved-operation .operation-process-grid .identity .kpis span{font-size:10px;white-space:nowrap}
.approved-operation .operation-process-grid .identity .kpis strong,
.approved-operation .operation-process-grid .identity .kpis .produced strong{
 font-size:28px;
 font-weight:700;
 line-height:1.1;
 letter-spacing:-.5px;
}
.approved-operation .operation-process-grid .identity .kpis strong small{font-size:.5em;letter-spacing:0}
.approved-operation .operation-process-grid .identity>.bar-time{
 grid-column:2;
 grid-row:2;
 display:grid;
 align-content:end;
 align-self:stretch;
 gap:2px;
 min-width:71px;
 padding-top:10px;
 border-top:1px solid #d7e3eb;
 text-align:right;
}
.approved-operation .operation-process-grid .identity .bar-time>span{font-size:10px;white-space:nowrap}
.approved-operation .operation-process-grid .identity .bar-time strong{font-size:18px;line-height:1.1}
.approved-operation .operation-process-grid .identity .bar-time small{font-size:9px;line-height:1.2}
.approved-operation .operation-process-grid .identity>.badge{grid-column:1/-1;justify-self:start;margin-top:9px}
.operation-process-grid .overview-controls{margin-top:-1px;border:1px solid var(--kata-border,#b6c9d5);border-radius:0 0 9px 9px;background:var(--kata-panel,#fcfdfe)}
.operation-process-grid .process-card:has(>.overview-controls)>.identity{border-radius:10px 10px 0 0}

/* Reference metrics form one quiet panel to the right of the process. */
.operation-reference .process-card>.identity{
 display:grid;
 grid-template-columns:minmax(0,1fr) auto auto;
 align-items:stretch;
 flex-wrap:nowrap;
 gap:0;
 padding:0;
 min-height:146px;
 border:1px solid var(--kata-border,#b6c9d5);
 border-top:3px solid var(--teal,#007f8b);
 border-radius:10px;
 box-shadow:var(--kata-shadow,0 5px 16px #163a5014);
}
.operation-reference .identity>div:first-of-type{display:grid;align-content:center;gap:4px;padding:17px 20px;min-width:0;width:auto}
.operation-reference .identity h2{font-size:28px;line-height:1.2}
.operation-reference .identity p{font-size:11px;line-height:1.35;margin:0}
.operation-reference .identity .process-unit-label{font-size:20px;font-weight:650;min-height:25px;margin-top:4px}
.operation-reference .reference-label{font-size:9px;font-weight:650;justify-self:start}
.operation-reference .identity>.kpis{
 display:flex;
 align-items:center;
 justify-content:center;
 gap:28px;
 margin:0;
 padding:18px 24px;
 background:#f3f7fab3;
 border-left:1px solid #d7e2e9;
}
.operation-reference .identity .kpis>div{gap:5px}
.operation-reference .identity .kpis span{font-size:10px}
.operation-reference .identity .kpis strong{font-size:32px;line-height:1.1}
.operation-reference .identity .kpis .produced strong{font-size:40px;line-height:1.1}
.operation-reference .identity>.bar-time{padding:18px 24px;align-content:center;gap:4px;min-width:120px;background:#f3f7fab3;border-left:1px solid #d7e2e9}
.operation-reference .identity .bar-time strong{font-size:25px;line-height:1.1}
.operation-reference .identity>.badge{grid-column:1/-1;justify-self:start;margin:0 20px 12px}
.production-heading .main-identity{box-shadow:var(--kata-shadow,0 5px 16px #163a5014);background:linear-gradient(90deg,var(--kata-card-tint,#edf3f7),var(--kata-card-tint,#edf3f7) 45%,var(--kata-panel,#fcfdfe) 45%,var(--kata-panel,#fcfdfe))}

.station-grid{align-items:stretch;gap:14px}
.station-card{display:flex;flex-direction:column;overflow:hidden}
.station-card-main{display:flex;flex-direction:column;flex:1;min-width:0}
.station-card-main>.identity{
 display:grid;
 grid-template-columns:minmax(0,1fr);
 align-items:start;
 gap:12px;
 margin:0;
 padding:14px;
 min-height:124px;
 border:0;
 border-bottom:1px solid #d3e0e8;
 border-radius:0;
 background:linear-gradient(180deg,var(--kata-card-tint,#edf3f7) 0,var(--kata-card-tint,#edf3f7) 63px,var(--kata-panel,#fcfdfe) 63px,var(--kata-panel,#fcfdfe) 100%);
}
.station-card-main .identity>div:first-of-type{display:grid;gap:4px;align-items:start;min-height:38px;width:100%}
.station-card-main .identity h3{font-size:22px;line-height:1.2;overflow-wrap:break-word}
.station-card-main .identity p{font-size:10px;line-height:1.3;margin:0}
.station-card-main .identity>.kpis{display:flex;align-items:end;justify-content:space-between;width:100%;gap:18px}
.station-card-main .identity .kpis span{font-size:10px}
.station-card-main .identity .kpis strong,.station-card-main .identity .kpis .produced strong{font-size:30px;line-height:1.1}
.station-card-main .station-detail{padding:14px;flex:1;background:var(--kata-panel,#fcfdfe)}
.station-card-main .station-detail .work-unit{font-size:clamp(19px,1.5vw,26px);font-weight:650;line-height:1.25}
.station-card-main .station-piece-detail{font-size:10px;color:var(--muted,#4f6878)}
.station-card-main .step-name{margin:8px 0 6px;line-height:1.3}
.station-card-main .step-name.has-step{font-size:clamp(20px,1.6vw,26px);font-weight:700}
.station-card-main .timing{margin-top:8px;margin-bottom:2px}
.station-card-main .timing strong{font-size:clamp(32px,2.8vw,42px)}
.station-card-controls{border-top:1px solid #d5e2ea;padding:0 14px 14px;background:var(--kata-panel,#fcfdfe)}
.station-card-controls .operator-row{padding:10px 0}
.station-work-panel{box-shadow:var(--kata-shadow,0 5px 16px #163a5014)}

/* Chart frames share card depth; plots, labels and series retain their units. */
.charts{gap:14px}
.chart{padding:14px;overflow:hidden}
.chart h3{font-size:13px;font-weight:650;line-height:1.3;color:var(--kata-text,#15394d);margin-bottom:10px}
.chart .chart-legend{font-size:10px;line-height:1.4;color:var(--muted,#4f6878)}
.approved-charts>.chart-panel.compact{box-shadow:none;background:transparent}
.approved-charts .charts.compact>.chart{border-color:var(--kata-border,#b6c9d5);border-radius:10px;padding:12px}

/* Backgrounds stay opaque over the factory image. Sizing remains in alpha15. */
.operation-dashboard .layout-stage .layout-node{
 border-color:var(--kata-border,#b6c9d5);
 box-shadow:var(--kata-shadow,0 5px 16px #163a5014);
 background:linear-gradient(180deg,var(--kata-card-tint,#edf3f7) 0,var(--kata-card-tint,#edf3f7) 34px,var(--kata-panel,#fcfdfe) 34px,var(--kata-panel,#fcfdfe) 100%);
}
.operation-dashboard .layout-stage .layout-node-info>strong{font-weight:700;color:var(--kata-text,#15394d)}
.operation-dashboard .layout-stage .layout-module-metrics .layout-metric-label{color:var(--muted,#4f6878)}
.operation-dashboard .layout-stage .layout-node.helping{border-color:var(--red,#ae2849)}
.layout-focus-active .layout-reference-accesses{box-shadow:var(--kata-shadow,0 5px 16px #163a5014)}

@media(min-width:721px) and (max-width:1099px){
 .approved-operation .operation-process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .operation-reference .identity>.kpis{gap:18px;padding:16px}
 .operation-reference .identity>.bar-time{padding:16px;min-width:104px}
}
@media(max-width:720px){
 .approved-operation .operation-process-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .operation-reference .process-card>.identity{grid-template-columns:minmax(0,1fr) auto;min-height:0}
 .operation-reference .identity>div:first-of-type{grid-column:1/-1;padding:16px}
 .operation-reference .identity>.kpis{justify-content:space-between;gap:20px;padding:16px;border-left:0;border-top:1px solid #d7e2e9}
 .operation-reference .identity>.bar-time{padding:16px;min-width:100px;border-top:1px solid #d7e2e9}
 .operation-reference .identity .kpis .produced strong{font-size:34px}
 .operation-reference .identity .kpis strong{font-size:28px}
 .operation-reference .identity .bar-time strong{font-size:22px}
 .station-card-main>.identity{min-height:120px;padding:14px}
 .station-card-main .identity h3{font-size:22px}
 .station-card-main .identity .kpis strong,.station-card-main .identity .kpis .produced strong{font-size:30px}
 .production-heading .main-identity{background:var(--kata-card-tint,#edf3f7)}
 .chart{padding:12px}
}
@media(max-width:600px){
 .approved-operation .operation-process-grid{grid-template-columns:minmax(0,1fr)}
 .approved-operation .operation-process-grid .process-card>.identity{min-height:165px}
 .operation-process-grid{grid-auto-rows:auto}
 .operation-performance-card>.identity{padding:16px;flex-wrap:wrap}
 .operation-overview-body{padding:16px}
 .operation-reference .identity>.kpis{gap:14px}
 .station-grid{gap:12px}
}
@media(prefers-reduced-motion:reduce){.identity .fill{transition:none}}

/* Control lists have different station counts. Their height must not feed back
   into a 100% summary or force every process row to match the longest list. */
.approved-operation.show-operation-controls .operation-process-grid{
 grid-auto-rows:auto;
 align-items:start;
}
.approved-operation.show-operation-controls .operation-process-grid>.process-card{
 height:auto;
 align-self:start;
}
.approved-operation.show-operation-controls .operation-process-grid .process-card>.identity{
 height:auto;
 flex:0 0 auto;
}
.approved-operation.show-operation-controls .operation-process-grid .overview-controls{flex:0 0 auto}

.station-work-panel>.controls~.module-buttons,
.station-card-controls>.controls~.module-buttons{margin-top:14px}
