/* Local Skill library: the same square, monochrome editorial system. */
.product-filters { display:flex; flex-wrap:wrap; gap:12px; padding-bottom:22px; border-bottom:1px solid var(--line); }
.product-filters .is-active { background:var(--dark); color:var(--on-dark); }
.products-list[data-products] { padding-top:0; }
.skill-card-art { display:block; position:relative; width:100%; height:auto; min-height:0; aspect-ratio:16/9; overflow:hidden; background:var(--surface); }
.skill-card-art>*,.skill-detail-cover>*,.skill-cover-preview>* { position:absolute; inset:0; width:100%; height:100%; }
.skill-card-art .skill-art-placeholder,.skill-detail-cover .skill-art-placeholder { min-height:0; }
.skill-card-art img,.skill-detail-cover img { width:100%; height:100%; object-fit:cover; }
.skill-art-placeholder { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:20px; height:100%; min-height:220px; background:#eaeae5; color:var(--ink); border:1px solid var(--line); }
.skill-art-placeholder>span { font:500 3rem/1.2 var(--serif); letter-spacing:.07em; }
.skill-art-placeholder small { font-size:var(--text-meta); }
.skill-tags { display:flex; flex-wrap:wrap; gap:8px 16px; margin-top:22px; font-size:var(--text-meta); color:var(--muted); }
.skill-detail-heading { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:56px; padding-block:64px; align-items:center; }
.skill-detail-heading>div { min-width:0; }
.skill-detail-heading h1 { font-size:3.5rem; line-height:1.3; margin-top:20px; }
.skill-detail-cover { position:relative; height:auto; min-height:0; aspect-ratio:16/9; overflow:hidden; border:1px solid var(--line); }
.skill-download { display:flex; flex-wrap:wrap; align-items:center; gap:20px; margin-top:28px; }
.skill-download>span { font-size:var(--text-meta); color:var(--muted); }
.skill-reading { display:grid; grid-template-columns:minmax(0,820px) 280px; gap:64px; align-items:start; padding-block:16px 48px; }
.skill-reading .prose { min-width:0; }
.skill-reading section { scroll-margin-top:32px; }
.skill-detail-aside { display:flex; flex-direction:column; gap:18px; padding-left:24px; border-left:1px solid var(--line); position:sticky; top:32px; font-size:var(--text-control); }
.skill-detail-aside>p { font-size:var(--text-meta); color:var(--muted); }
.skill-detail-aside { display:block; max-height:calc(100dvh - 64px); overflow:auto; padding-right:10px; scrollbar-gutter:stable; overscroll-behavior:contain; }
.skill-detail-toc { display:flex; flex-direction:column; gap:18px; }
.skill-detail-toc>p { font-size:var(--text-meta); color:var(--muted); }
.skill-other-recommendations { margin-top:32px; padding-top:26px; border-top:1px solid var(--line); }
.skill-other-recommendations h2 { font:500 24px/1.4 var(--serif); margin-bottom:20px; overflow-wrap:anywhere; }
.skill-recommend-list { list-style:none; margin:0; padding:0; }
.skill-recommend-list li { border-bottom:1px solid var(--line); }
.skill-recommend-list a { display:grid; grid-template-columns:25px minmax(0,1fr); gap:10px; padding-block:18px; }
.skill-recommend-list a:hover { background:var(--surface); }
.skill-recommend-list a:focus-visible { outline:2px solid var(--ink); outline-offset:3px; }
.skill-recommend-index,.skill-recommend-meta { font-size:var(--text-meta); line-height:1.7; color:var(--muted); }
.skill-recommend-name { display:block; font-size:var(--text-control); line-height:1.6; overflow-wrap:anywhere; }
.skill-recommend-meta { display:block; margin-top:8px; overflow-wrap:anywhere; }
.skill-recommend-empty { font-size:var(--text-meta); line-height:1.7; }
.skill-recommend-settings { margin-top:28px; border:1px solid var(--line); padding:22px; }
.skill-recommend-settings summary { font-size:var(--text-control); line-height:1.7; cursor:pointer; }
.skill-recommend-settings-fields { padding-top:24px; }
.skill-recommend-settings-fields>label { margin-bottom:22px; }
.skill-recommend-settings input:not([type=checkbox]),.skill-item-recommendation input:not([type=checkbox]) { width:100%; padding:12px; border:1px solid var(--line); border-radius:0; background:var(--paper); color:var(--ink); font:var(--text-control)/1.7 var(--sans); }
#studio-skills .skill-recommend-switch { display:flex; flex-direction:row; align-items:flex-start; gap:14px; font-size:var(--text-control); line-height:1.7; }
.skill-recommend-switch input { width:22px; height:22px; accent-color:var(--ink); margin-top:4px; flex-shrink:0; }
.skill-item-recommendation { padding:24px; border:1px solid var(--line); margin-top:28px; background:var(--surface); }
.skill-item-recommendation h3 { font-size:var(--text-card); margin-bottom:22px; }
.skill-item-recommendation>label { margin-bottom:22px; }
.skill-case { margin-block:30px; padding:28px; border:1px solid var(--line); }
.skill-case .module-topline { font-size:var(--text-meta); line-height:1.7; }
.skill-case h3 { margin-top:0; }
.skill-case h4 { font-family:var(--sans); font-size:var(--text-reading); font-weight:600; margin:28px 0 12px; }
.skill-case .skill-case-source,.skill-hash { font-size:var(--text-meta); overflow-wrap:anywhere; }
.skill-hash code { font-size:var(--text-meta); white-space:normal; overflow-wrap:anywhere; }
.skill-preview-note { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px; margin-top:32px; }
.skill-file-info .button { margin-top:18px; }
.studio-layout:has(#studio-skills:not([hidden])) .studio-savebar { display:none; }
.skill-dropzone { display:flex; flex-direction:column; align-items:flex-start; gap:18px; border:1px dashed var(--line); padding:28px; margin-block:28px; background:var(--surface); }
.skill-dropzone p { font-size:var(--text-body); line-height:1.7; }
.skill-dropzone p:last-child,.skill-dropzone>p:nth-of-type(2) { font-size:var(--text-meta); }
.skill-dropzone.is-dragging { background:var(--dark); color:var(--on-dark); outline:3px solid var(--line); outline-offset:4px; }
.skill-dropzone.is-dragging .button { color:var(--ink); background:var(--paper); }
.skill-dropzone progress { display:block; max-width:100%; width:400px; height:20px; accent-color:var(--ink); }
.skill-library-toolbar { display:flex; flex-wrap:wrap; justify-content:space-between; gap:24px; align-items:flex-end; padding-block:20px; border-block:1px solid var(--line); margin-block:28px; }
.skill-library-toolbar label { min-width:min(100%,240px); }
.skill-library-toolbar select,#skill-select,#skill-candidate-select { width:100%; font-size:var(--text-control); min-height:52px; padding:10px 12px; background:var(--paper); color:var(--ink); border:1px solid var(--line); border-radius:0; }
.skill-candidate-panel { border:1px solid var(--line); padding:24px; margin-bottom:28px; }
.skill-candidate-panel p { margin-bottom:20px; font-size:var(--text-body); }
.skill-candidate-panel label { margin-bottom:22px; }
.skill-editor-header { display:flex; align-items:flex-start; flex-wrap:wrap; gap:20px; justify-content:space-between; padding-block:32px 24px; }
.skill-editor-header h3 { margin:0; font-size:var(--text-card); }
.skill-editor-header .meta { padding-top:12px; }
.skill-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.skill-fields .full { grid-column:1/-1; }
.skill-fields input,.skill-fields textarea,.skill-case-editor input,.skill-case-editor textarea,.skill-case-editor select { font-size:var(--text-control); line-height:1.7; width:100%; min-width:0; border:1px solid #85857e; border-radius:0; background:var(--paper); color:var(--ink); padding:12px 14px; }
.skill-cover-controls { margin-top:36px; }
.skill-cover-controls>h3,.skill-case-editors>h3 { font-size:var(--text-card); margin-bottom:18px; }
.skill-cover-preview { position:relative; overflow:hidden; margin-top:24px; width:min(100%,640px); aspect-ratio:16/9; background:var(--surface); border:1px solid var(--line); }
.skill-cover-preview img { width:100%; height:100%; object-fit:cover; }
.skill-cover-controls>label { margin-top:22px; }
.skill-case-editors { margin-top:40px; }
.skill-case-editor { border:1px solid var(--line); margin-top:24px; padding:24px; }
.skill-case-editor h4 { margin:0 0 22px; font-size:var(--text-control); line-height:1.5; }
.skill-case-editor label { margin-bottom:22px; }
.skill-case-editor label:last-of-type { margin-bottom:0; }
.skill-cases-actions { display:flex; flex-wrap:wrap; gap:20px; margin-top:24px; }
.skill-admin-actions { display:flex; flex-wrap:wrap; gap:14px; margin-block:32px; padding-block:24px; border-block:1px solid var(--line); }
.skill-admin-actions .button { justify-content:center; gap:12px; padding:12px 18px; }
.skill-danger-action { color:#6e241b; }
.skill-evidence { margin-block:30px; border-bottom:1px solid var(--rule); padding-bottom:24px; }
.skill-evidence summary { font-size:var(--text-control); cursor:pointer; padding-block:14px; }
.skill-evidence pre { font:var(--text-control)/1.7 var(--sans); white-space:pre-wrap; overflow-wrap:anywhere; max-height:420px; overflow:auto; padding:22px; background:var(--surface); }
.skill-evidence h4 { font-size:var(--text-control); margin-bottom:18px; overflow-wrap:anywhere; }
.skill-evidence p,.skill-evidence .meta { font-size:var(--text-meta); line-height:1.7; margin-block:16px; }
.skill-evidence select { font-size:var(--text-control); padding:10px; max-width:100%; background:var(--paper); }
.skill-proposal { margin-top:28px; padding:24px; border:1px solid var(--line); }
.skill-proposal h3 { font-size:var(--text-card); margin-bottom:20px; }
.skill-proposal p { font-size:var(--text-body); line-height:1.7; margin-block:18px; }
.skill-proposal pre { font:var(--text-body)/1.7 var(--sans); white-space:pre-wrap; overflow-wrap:anywhere; max-height:380px; overflow:auto; }
.skill-ai-panel { padding:24px; margin-block:24px; border:1px solid var(--line); background:var(--surface); }
.skill-ai-panel h3 { font-size:var(--text-card); line-height:1.35; margin:0 0 18px; }
.skill-ai-panel p { font-size:var(--text-body); line-height:1.7; margin-block:18px; overflow-wrap:anywhere; }
.skill-ai-panel .form-hint { font-size:var(--text-meta); }
.skill-ai-panel .button { max-width:100%; white-space:normal; text-align:left; }
.skill-ai-panel .button:disabled { opacity:.55; cursor:wait; }
.skill-candidate-preview { max-height:640px; overflow:auto; padding:24px; margin-top:20px; border:1px solid var(--line); background:var(--surface); }
.skill-candidate-preview h4 { font:500 22px/1.4 var(--serif); margin:28px 0 18px; }
.skill-candidate-preview h4:first-child { margin-top:0; }
.skill-candidate-preview h5 { font:600 var(--text-control)/1.7 var(--sans); margin:20px 0 12px; }
.skill-candidate-preview .skill-candidate-text { font:var(--text-body)/1.7 var(--sans); white-space:pre-wrap; overflow-wrap:anywhere; }
.skill-candidate-preview p { font-size:var(--text-meta); overflow-wrap:anywhere; }
.skill-candidate-case { margin-block:28px; padding-block:24px; border-block:1px solid var(--line); }
.skill-editor-empty { margin-block:32px; padding:28px; background:var(--surface); font-size:var(--text-body); }
.md-table { margin-block:28px; width:100%; }
.md-table table { width:100%; table-layout:fixed; border-collapse:collapse; font-size:var(--text-reading); line-height:1.75; }
.md-table th,.md-table td { vertical-align:top; padding:16px; border:1px solid var(--line); overflow-wrap:anywhere; text-align:left; }
.md-table th { font-weight:600; background:var(--surface); }
.prose h4 { font-size:var(--text-reading); line-height:1.5; margin-block:24px 12px; }
@media (max-width:1050px) {
  .skill-detail-heading { grid-template-columns:minmax(0,1fr); gap:36px; }
  .skill-detail-cover { max-width:760px; }
  .skill-reading { grid-template-columns:minmax(0,1fr); }
  .skill-detail-aside { display:none; }
}
@media (max-width:900px) { .skill-fields { grid-template-columns:minmax(0,1fr); } }
@media (max-width:1050px) {
  .skill-detail-aside.has-skill-recommendations { display:block; position:static; max-height:none; overflow:visible; padding:28px 0 0; border-left:0; border-top:1px solid var(--line); }
  .skill-detail-toc { display:none; }
  .skill-other-recommendations { margin:0; padding:0; border-top:0; }
  .skill-recommend-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 28px; }
}
@media (max-width:639px) {
  .skill-recommend-list { grid-template-columns:minmax(0,1fr); }
  .md-table table,.md-table tbody,.md-table tr,.md-table td { display:block; width:100%; }
  .md-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  .md-table tr { margin-bottom:22px; border:1px solid var(--line); }
  .md-table td { border:0; border-bottom:1px solid var(--rule); padding:18px; }
  .md-table td:last-child { border-bottom:0; }
  .md-table td::before { content:attr(data-label); display:block; font-weight:600; font-size:var(--text-control); margin-bottom:10px; }
  .skill-detail-heading { padding-block:44px; gap:28px; }
  .skill-detail-heading h1 { font-size:2.25rem; }
  .skill-reading { gap:0; }
  .skill-case { padding:22px; }
  .skill-dropzone,.skill-candidate-panel,.skill-case-editor,.skill-proposal { padding:20px; }
  .skill-admin-actions { flex-direction:column; align-items:stretch; }
  .skill-admin-actions .button { width:100%; }
  .skill-library-toolbar { align-items:stretch; }
  .skill-library-toolbar label { width:100%; }
  .skill-cover-preview { width:100%; }
}