.skill-manual{display:grid;grid-template-columns:1.05fr .95fr;border-bottom:1px solid var(--line)}
.skill-manual>article{padding:72px 48px;border-right:1px solid var(--line);border-top:1px solid var(--line)}
.skill-manual>article:nth-child(2n){border-right:0}
.skill-manual h2,.outcome-section h2,.community-section h2{font-family:var(--display);font-size:clamp(42px,5vw,70px);line-height:.9;letter-spacing:-.04em;text-transform:uppercase;margin:18px 0 35px}
.skill-manual h2 em,.outcome-section h2 em{font-family:var(--serif);font-weight:400;text-transform:none;color:#18796d}
.manual-intro .skill-copy{max-width:720px;font-size:20px;line-height:1.75;white-space:normal}
.use-case-panel ul,.steps-panel ol{list-style:none;margin:28px 0 0;padding:0}
.use-case-panel li{position:relative;padding:19px 18px 19px 42px;border-top:1px solid var(--line);font-size:17px;line-height:1.45}
.use-case-panel li::before{content:"↳";position:absolute;left:8px;color:#18796d;font-weight:800}
.steps-panel{grid-column:1/-1;background:#fff}
.steps-panel ol{display:grid;grid-template-columns:repeat(4,1fr);border-left:1px solid var(--line)}
.steps-panel li{min-height:220px;padding:24px;border:1px solid var(--line);border-left:0;position:relative}
.steps-panel li span{display:block;font-family:var(--display);font-size:42px;color:#18796d;margin-bottom:42px}
.steps-panel li p{font-size:15px;line-height:1.65;margin:0}
.prompt-panel{grid-column:1/-1!important;display:grid;grid-template-columns:260px 1fr auto;gap:30px;align-items:start;background:var(--night);color:#eaf4f2;border-right:0!important}
.prompt-panel h2{font-size:45px;margin-bottom:0}
.prompt-panel pre{margin:0;padding:25px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);color:#d4e5e2;white-space:pre-wrap;font:16px/1.7 var(--body)}
.prompt-panel button{border:0;background:var(--acid);color:var(--night);padding:13px 16px;white-space:nowrap}
.outcome-section{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;padding:100px 48px;background:#dce8e6}
.outcome-heading>p:last-child{max-width:520px;line-height:1.7;color:#4d6870}
.outcome-grid{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.outcome-grid article{min-height:220px;padding:27px;background:rgba(255,255,255,.42);border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;transition:.25s}
.outcome-grid article:hover{background:#fff;transform:translateY(-3px)}
.outcome-grid article>span{font-size:10px;letter-spacing:.16em;color:#18796d}
.outcome-grid h3{font-family:var(--display);font-size:30px;line-height:1;text-transform:uppercase;margin:35px 0}
.outcome-grid small{margin-top:auto;font-size:9px;letter-spacing:.13em;color:#60777c}
.community-section{display:grid;grid-template-columns:1fr 380px;gap:80px;padding:90px 48px}
.community-section>div{max-width:760px}
.community-section form{align-self:start;position:sticky;top:30px;background:#fff;padding:25px;border:1px solid var(--line)}
.community-section textarea{width:100%;min-height:120px;padding:14px;border:1px solid var(--line);resize:vertical}
.community-section form button{background:var(--night);color:#fff;border:0;padding:12px 17px;margin-top:10px}
.community-section .comment{padding:22px 0;border-top:1px solid var(--line)}
.community-section .comment header{display:flex;justify-content:space-between;font-size:12px}
.community-section .comment p{font-size:16px;line-height:1.65}
@media(max-width:900px){.skill-manual{grid-template-columns:1fr}.skill-manual>article{border-right:0;padding:55px 24px}.steps-panel ol{grid-template-columns:1fr 1fr}.prompt-panel{grid-template-columns:1fr}.outcome-section{grid-template-columns:1fr;padding:70px 24px}.community-section{grid-template-columns:1fr;padding:70px 24px}.community-section form{position:static}}
@media(max-width:600px){.steps-panel ol,.outcome-grid{grid-template-columns:1fr}.steps-panel li{min-height:0}.prompt-panel pre{font-size:14px}.outcome-grid article{min-height:170px}}

/* Reading-first Skill manual: compact hierarchy, clear attribution, comfortable measure. */
.skill-detail{max-width:1180px;padding-top:38px}
.detail-hero{grid-template-columns:minmax(0,1fr) 320px;gap:52px;padding:48px 0 54px}
.detail-hero h1{font-size:clamp(42px,6vw,68px);line-height:.95;letter-spacing:-.035em;margin:18px 0 22px}
.detail-hero>div>p:not([data-category]){font-family:var(--body);font-size:19px;line-height:1.65;max-width:720px;color:#425d6d}
.detail-hero aside{padding:24px;border-radius:2px}
.attribution-note{margin:10px 0 22px;color:#b8cbd3;font-size:13px!important;line-height:1.55;letter-spacing:0!important;font-weight:400!important}
.skill-manual{display:block;border-bottom:0;padding:18px 0}
.skill-manual>article{padding:46px 0;border:0;border-bottom:1px solid var(--line)}
.skill-manual h2,.outcome-section h2,.community-section h2{font-size:clamp(26px,3.2vw,38px);line-height:1.12;letter-spacing:-.025em;text-transform:none;margin:10px 0 18px}
.manual-intro .skill-copy{max-width:780px;font-size:17px;line-height:1.85;color:#2d4a5d}
.section-help{max-width:720px;margin:0 0 24px;color:#5b7180;font-size:14px;line-height:1.7}
.use-case-panel ul{display:grid;grid-template-columns:1fr 1fr;gap:0 28px;margin-top:10px}
.use-case-panel li{padding:15px 12px 15px 30px;font-size:15px;line-height:1.6}
.steps-panel{background:transparent!important}
.steps-panel ol{grid-template-columns:1fr 1fr;border:0;gap:12px}
.steps-panel li{min-height:0;padding:22px 24px;border:1px solid var(--line)!important;background:rgba(255,255,255,.48);display:grid;grid-template-columns:44px 1fr;gap:10px;align-items:start}
.steps-panel li span{font-size:20px;margin:0;color:#18796d}
.steps-panel li p{font-size:15px;line-height:1.7}
.prompt-panel{grid-template-columns:220px minmax(0,1fr) auto!important;gap:24px!important;margin:20px 0;padding:32px!important;border-radius:3px}
.prompt-panel h2{font-size:28px;margin:8px 0 12px}
.prompt-panel .section-help{color:#9fb7be;font-size:12px;margin:0}
.prompt-panel pre{padding:20px;font-size:14px;line-height:1.75}
.outcome-section{grid-template-columns:310px 1fr;gap:48px;padding:62px 0;background:transparent;border-bottom:1px solid var(--line)}
.outcome-grid article{min-height:150px;padding:22px;background:rgba(255,255,255,.48)}
.outcome-grid h3{font-family:var(--body);font-size:17px;line-height:1.4;text-transform:none;margin:24px 0}
.community-section{grid-template-columns:minmax(0,1fr) 330px;gap:56px;padding:62px 0}
.community-section>div{max-width:700px}
.community-section form{top:90px;padding:22px}
.community-section .comment p{font-size:15px;line-height:1.7}
.comment-identity{display:flex;align-items:center;gap:10px}.comment-avatar{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#dce8e6;color:#176f66;font-size:10px;font-weight:800;letter-spacing:.04em}.community-section .comment header{align-items:center}.community-section .comment header>small{color:#718697}
@media(max-width:900px){.skill-detail{padding-top:28px}.detail-hero{gap:30px}.skill-manual>article{padding:38px 0}.outcome-section,.community-section{padding:48px 0}.prompt-panel{grid-template-columns:1fr!important}.community-section form{position:static}}
@media(max-width:640px){.use-case-panel ul,.steps-panel ol{grid-template-columns:1fr}.detail-hero h1{font-size:40px}.detail-hero>div>p:not([data-category]){font-size:17px}.outcome-section{padding:42px 0}.steps-panel li{grid-template-columns:36px 1fr}}
