.skills-shell{width:min(1120px,calc(100% - 28px));margin:0 auto;padding:18px 0 72px}
.skills-topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;min-height:52px;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10;background:rgba(5,7,10,.92);backdrop-filter:blur(12px)}
.skills-topbar strong{font-size:.78rem;letter-spacing:.12em}.skills-version{justify-self:end;color:var(--muted);font-size:.72rem}
.skills-hero{padding:56px 0 30px;max-width:820px}.skills-hero h1{font-size:clamp(2.4rem,7vw,5.4rem);line-height:.94;letter-spacing:-.055em;margin:12px 0}.skills-hero p{color:#aab4c2;max-width:740px;font-size:1.03rem}
.skills-toolbar{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;margin-bottom:16px}.skills-toolbar label{font-size:.78rem;font-weight:800;color:#c8d0da}.skills-toolbar select{background:#080c11;color:var(--text);border:1px solid var(--line);border-radius:10px;padding:8px 11px}
.skill-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.skill-card{background:linear-gradient(180deg,#0d1218,#090d12);border:1px solid var(--line);border-radius:16px;padding:18px;display:grid;grid-template-rows:auto 1fr auto;gap:12px;min-height:240px}.skill-card:hover{border-color:#36516d}.skill-icon{font-size:1.55rem}.skill-card h2{font-size:1.2rem;margin:0 0 8px}.skill-card p{margin:0;color:#98a4b3}.skill-card button{justify-self:start;border:1px solid #355273;background:#0b1219;color:var(--accent);border-radius:10px;padding:8px 11px;font-weight:800}
.skill-composer{margin-top:18px;padding:20px}.composer-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.composer-head h2{font-size:2rem;letter-spacing:-.04em;margin:.2rem 0}.composer-head p{color:var(--muted);margin:0;max-width:720px}
.skill-form{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}.skill-form label{display:grid;gap:6px}.skill-form label span{font-size:.76rem;font-weight:800;color:#cbd3dd}.skill-form input,.skill-form textarea{width:100%;border:1px solid var(--line);background:#080c11;color:var(--text);border-radius:11px;padding:11px 12px;outline:none}.skill-form input:focus,.skill-form textarea:focus{border-color:#5f9fe8}.skill-form label:last-of-type{grid-column:1/-1}.skill-build{grid-column:1/-1;justify-self:start;border:1px solid #5e9fe9;background:#101923;color:#fff;border-radius:11px;padding:10px 14px;font-weight:900}
.skill-output{margin-top:22px;border-top:1px solid var(--line);padding-top:18px}.skill-output-head{display:flex;justify-content:space-between;align-items:center}.skill-output-head h3{margin:.2rem 0;font-size:1.45rem}.skill-output pre{white-space:pre-wrap;word-break:break-word;background:#070a0e;border:1px solid var(--line);border-radius:12px;padding:16px;color:#d8e0e9;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;line-height:1.55;max-height:520px;overflow:auto}.skill-actions{display:flex;gap:10px;margin-top:12px}.skill-primary{display:inline-flex;text-decoration:none;border:1px solid #4f8ed6;background:#102030;color:#fff;border-radius:11px;padding:10px 14px;font-weight:900}.skill-note{color:#6f7b89;font-size:.76rem;margin:12px 0 0}
@media(max-width:860px){.skill-grid{grid-template-columns:1fr 1fr}.skills-hero{padding-top:38px}}
@media(max-width:560px){.skills-shell{width:min(100% - 20px,720px)}.skill-grid{grid-template-columns:1fr}.skills-hero h1{font-size:2.7rem}.skill-form{grid-template-columns:1fr}.skill-form label:last-of-type,.skill-build{grid-column:auto}.skills-toolbar{align-items:flex-start;gap:10px}.skill-card{min-height:auto}.skill-primary{width:100%;justify-content:center}}