/* Open core: tonal surfaces only, one lime tile, ease from tokens. */
.oc-sec{padding:72px 0}
.oc-hero{padding:96px 0 40px}
.oc-hero-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:64px;align-items:center}
.oc-hero .lead{margin-top:24px;max-width:46ch}
.oc-actions{margin-top:32px;display:flex;flex-wrap:wrap;gap:12px}
.oc-hero-mascot{justify-self:center}
.oc-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.oc-tile{display:grid;gap:16px;align-content:start;padding:36px;border-radius:var(--radius);background:var(--frame);min-height:220px}
.oc-tile h3{font-size:26px}
.oc-tile p{color:var(--muted);max-width:36ch}
.oc-tile.t1{background:var(--action);color:var(--action-ink)}
.oc-tile.t1 p{color:var(--action-ink)}
.oc-tile.t4{background:var(--panel)}
.oc-run{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:16px}
.oc-stages{display:grid;gap:8px;align-content:start}
.oc-stages button{min-height:76px;text-align:left;padding:16px 24px;border-radius:24px;background:var(--panel);font-size:16px;line-height:1.4;transition:background-color var(--fast) var(--ease),color var(--fast) var(--ease)}
.oc-stages button:hover{background:var(--frame)}
.oc-stages button[aria-pressed=true]{background:var(--ink);color:var(--canvas)}
.oc-stage-view{display:grid;gap:16px;align-content:center;min-height:300px;padding:40px;border-radius:var(--radius);background:var(--frame);min-width:0}
.oc-from{font-size:20px;color:var(--muted)}
.oc-arrow{font-size:28px;color:var(--muted)}
.oc-to{font-size:clamp(30px,3.6vw,48px);font-weight:500;letter-spacing:-.045em;line-height:1.1;overflow-wrap:anywhere}
.oc-note{color:var(--muted);min-height:1.5em}
.oc-stage-view.swap{animation:oc-fade 240ms var(--ease)}
@keyframes oc-fade{from{opacity:.2}to{opacity:1}}
.core-files{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:16px}
.core-file-list{display:grid;gap:8px;align-content:start}
.core-file-list button{min-height:56px;text-align:left;padding:16px 24px;border-radius:24px;background:var(--panel);font-size:16px;overflow-wrap:anywhere;transition:background-color var(--fast) var(--ease),color var(--fast) var(--ease)}
.core-file-list button:hover{background:var(--frame)}
.core-file-list button[aria-pressed=true]{background:var(--ink);color:var(--canvas)}
.core-file-list button[aria-disabled=true]{cursor:default}
.core-file-detail{display:grid;align-content:start;gap:20px;padding:40px;border-radius:var(--radius);background:var(--frame);min-width:0;min-height:340px}
.core-file-detail h3{font-size:30px;overflow-wrap:anywhere}
.core-file-detail p{color:var(--muted);max-width:44ch}
.core-file-counter{display:flex;align-items:center;gap:16px;font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums}
.oc-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.oc-col{display:grid;gap:20px;align-content:start;padding:36px;border-radius:var(--radius);background:var(--frame)}
.oc-col-b{background:var(--panel)}
.oc-col h3{font-size:26px}
.oc-col ul{display:grid;gap:12px;color:var(--muted);max-width:40ch}
.oc-steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px}
.oc-steps li{position:relative;display:grid;gap:20px;align-content:start;padding:32px;border-radius:var(--radius);background:var(--frame);min-height:180px}
.oc-steps li>span{font-size:36px;letter-spacing:-.04em;font-variant-numeric:tabular-nums;color:var(--muted)}
.oc-steps h3{font-size:26px}
.oc-steps li:not(:last-child)::after{content:"→";position:absolute;right:-36px;top:50%;translate:0 -50%;font-size:24px;color:var(--muted)}
@media(max-width:1000px){.oc-hero-grid{gap:32px}.oc-steps{gap:40px}}
@media(max-width:768px){
 .oc-sec{padding:40px 0}.oc-hero{padding:48px 0 16px}
 .oc-hero-grid,.oc-run,.core-files,.oc-cols,.oc-tiles,.oc-steps{grid-template-columns:minmax(0,1fr)}
 .oc-hero-mascot{width:160px;height:160px;justify-self:start}
 .oc-tile,.oc-col,.oc-stage-view,.core-file-detail{padding:24px;min-height:0}
 .oc-steps{gap:36px}.oc-steps li{padding:24px;min-height:0}
 .oc-steps li:not(:last-child)::after{content:"↓";right:auto;left:24px;top:auto;bottom:-34px;translate:none}
}
@media(prefers-reduced-motion:reduce){.oc-stages button,.core-file-list button{transition:none}.oc-stage-view.swap{animation:none}}