body[data-page="skills"] .layout{display:block;max-width:1400px;padding:0 28px}body[data-page="skills"] main{padding:14px 0 0}.breadcrumbs{height:24px;margin-bottom:10px}.hero{display:flex;align-items:center;justify-content:space-between;min-height:0;background:transparent;color:var(--ink);border-radius:0;gap:20px}.hero:before,.hero-graphic,.hero-tags,.hero-link,.hero-copy>.eyebrow{display:none}.hero-copy{padding:0}.hero h1{font-size:30px;letter-spacing:1px;margin:0}.hero-description{font-size:12px;color:var(--muted);margin-top:4px}.hero-stats{display:flex;gap:20px;padding:0;background:transparent;border:0}.hero-stats>div{padding:0;border:0}.hero-stats strong{font-size:22px;color:var(--ink)}.hero-stats span{color:var(--muted);font-size:10px}.sidebar{position:static;height:auto;padding:0;border:0;margin:16px 0 12px;display:block}.sidebar>:not(nav){display:none}.sidebar nav{display:flex;flex-direction:row;flex-wrap:wrap;gap:7px;margin:0}.category-button{width:auto;border:1px solid var(--line);padding:7px 12px;background:var(--white);font-size:12px}.category-button.selected{border-color:#8c9f7b}.category-button>span{margin-left:8px}.catalog-topline{padding:0 0 10px;font-size:11px}#catalog{padding-top:12px}.section-heading{margin-bottom:12px}.section-heading .eyebrow{display:none}.section-heading h2{font-size:24px;margin:0}.skills-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:12px}.skills-toolbar #search-form{flex:0 1 390px;min-width:280px;gap:8px}.search{height:36px;padding:5px 10px}.search>span{font-size:18px}.search input{font-size:12px}.skills-toolbar #sort{height:36px;padding:5px 9px}.skills-toolbar .filters{flex:1;gap:12px;margin:0}.filters label{font-size:11px}.filters select{font-size:11px;max-width:150px}.result-bar{font-size:11px}.skill-list{overflow-x:auto}.skill-list-head,.skill-row{display:grid;grid-template-columns:minmax(160px,1fr) minmax(280px,2.2fr) 100px 90px minmax(130px,1fr) 48px;min-width:950px;gap:14px;align-items:center;padding:11px 14px}.skill-list-head{font-size:14px;font-weight:700;text-align:center;background:#eceee3}.skill-row{min-height:64px;border-top:1px solid var(--line)}.skill-main{gap:9px;align-items:center}.skill-main h3{font-size:14px!important;text-align:left;line-height:1.6;margin:0}.skill-main small{font-size:10px;color:var(--muted)}.skill-icon{width:28px;height:30px;flex-shrink:0}.skill-description{font-size:12px;line-height:1.85;white-space:normal;overflow-wrap:anywhere}.skill-tagset{font-size:10px;justify-content:center}.skill-costs{font-size:11px;color:var(--muted);text-align:center;line-height:1.8}.skill-owners{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:11px}.skill-owners a{border-bottom:1px dotted #b7c6a8}.skill-open{font-size:10px}.related-section{padding:18px 0}.related-section h2{font-size:22px}@media(max-width:800px){body[data-page="skills"] .layout{padding:0 16px}.hero{display:block}.hero-stats{margin-top:12px;gap:22px}.skills-toolbar #search-form{flex:1 1 100%}.skills-toolbar .filters{flex-basis:100%}.filters label{flex-direction:row;align-items:center}.sidebar nav{overflow:visible}.category-button{font-size:11px;padding:6px 9px}}
body[data-page="skills"] .sidebar{height:auto!important;position:static!important;min-height:0!important;max-height:none!important}

/* Usage and text coverage are independent of active/passive ability type. */
.skill-usage-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px}.skill-usage-tabs button{display:inline-flex;gap:9px;align-items:center;padding:7px 11px;border:1px solid #cbd3c2;border-radius:4px;background:#fffef9;color:#31483b;font-size:14px}.skill-usage-tabs button span{font-size:12px;color:#465846}.skill-usage-tabs button.selected{background:#385b48;color:#fff;border-color:#385b48}.skill-usage-tabs button.selected span{color:#fff}.skill-usage-badge{display:table;margin-top:4px;padding:1px 5px;border:1px solid #cbd6bd;border-radius:3px;background:#f0f3e9;color:#354b39;font-size:11px;font-weight:400}.usage-enemy{background:#f3e8df;border-color:#dac1ae;color:#683f28}.usage-shared{background:#e4edf0;border-color:#b4cbd4;color:#294c5d}.usage-test,.usage-unknown{background:#f2eee0;border-color:#d6cda8;color:#5b4c20}.description-status{display:table;font-size:11px;font-weight:600;padding:0 5px;border:1px solid #d6cda8;border-radius:3px;background:#f7f2df;color:#5d4c20;margin-bottom:4px}.description-unavailable{color:#465447;font-size:13px}.skill-usage-note{margin:14px 0;padding:12px 15px;background:#edf1e6;border:1px solid #cbd5bf;border-radius:5px;font-size:14px}.skill-usage-note>.skill-usage-badge{display:inline-block;margin:0 10px 0 0}.skill-usage-note p{margin:6px 0 0;color:#3a4c3e;line-height:1.8}.skill-owner-expand{padding:10px 12px;border:1px solid #d3dac9;border-radius:4px}.skill-owner-expand summary{cursor:pointer;color:#354f3e}.skill-owner-list{margin-top:10px}.skill-owner-list a{font-size:14px}.more-owners{font-size:12px;color:#425d46}.skills-toolbar .filters{gap:8px 12px}.skills-toolbar .filters select{max-width:135px}
@media(max-width:800px){.skill-usage-tabs{gap:5px}.skill-usage-tabs button{padding:6px 8px;font-size:13px}.skill-usage-tabs button span{font-size:11px}.skills-toolbar .filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.skills-toolbar .filters label{display:flex;flex-direction:column;align-items:stretch;gap:3px;min-width:0}.skills-toolbar .filters select{max-width:none;width:100%;min-width:0}}

.skill-list-head,.skill-row{grid-template-columns:minmax(160px,1fr) 100px minmax(280px,2.2fr) 90px minmax(130px,1fr) 48px}

.skill-list-head,.skill-row{grid-template-columns:150px 95px minmax(280px,1fr) 85px 235px 48px}.skill-owners{align-items:flex-start;gap:7px;justify-content:flex-start}.skill-owners .owner-portrait{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:3px;width:66px;border:0;text-align:center;font-size:10px;line-height:1.5}.owner-portrait img,.owner-placeholder{width:34px;height:34px;object-fit:contain;image-rendering:pixelated}.owner-placeholder{display:grid;place-items:center;background:#e9efdf;border-radius:4px;color:#91a17b}.skill-owners .more-owners{font-size:10px;align-self:center}.skill-main{min-width:0}.skill-main h3{overflow-wrap:anywhere}.skill-owner-list .owner-portrait{display:inline-flex;flex-direction:column;gap:4px;align-items:center}.skill-owner-list img{width:36px;height:36px;object-fit:contain}

/* Keep list names concise and give acquisition chapters their own column. */
.skill-list-head,.skill-row{grid-template-columns:140px 95px minmax(250px,1fr) 80px 100px 220px 48px;min-width:1050px}
.skill-row>.skill-chapter{display:block;margin:0;padding:0;border:0;background:transparent;text-align:center;min-width:0;font-size:12px;color:var(--muted)}
.skill-row>.skill-chapter .chapter-limit-caption{display:none}
.skill-row>.skill-chapter strong{font-size:12px;font-weight:400}

/* Separate element and targeting type into compact, color-coded columns. */
.skill-list-head,.skill-row{grid-template-columns:140px 65px 70px minmax(250px,1fr) 80px 220px 48px;min-width:1000px}
.skill-element span,.skill-type span{display:inline-block;padding:2px 6px;border:1px solid;border-radius:3px;font-size:11px;line-height:1.5}
.skill-element span{background:#eff0ed;border-color:#d3d8d0;color:#526052}
.skill-element .element-fire{background:#fbe8e2;border-color:#e6b4a3;color:#a43c25}
.skill-element .element-ice{background:#e4f4fa;border-color:#a8cedd;color:#26708d}
.skill-element .element-thunder{background:#fff4cc;border-color:#dfcc76;color:#806009}
.skill-element .element-water{background:#e2edfc;border-color:#a6c2e8;color:#2d62a2}
.skill-element .element-wind{background:#e6f4e4;border-color:#afd3a8;color:#387538}
.skill-element .element-earth{background:#f1e7d8;border-color:#d2b792;color:#865b2c}
.skill-element .element-light{background:#fcf6dc;border-color:#ded096;color:#806b23}
.skill-element .element-dark{background:#eee5f5;border-color:#c8aedc;color:#744594}
.skill-element .element-all{background:#f6e4ef;border-color:#dcaecb;color:#914c77}
.skill-type span{background:#eeeaf6;border-color:#c7b9dd;color:#695086}
.skill-type .target-single{background:#e6eef9;border-color:#b3c6e3;color:#355f96}
.skill-type .target-group{background:#f8e9dc;border-color:#ddbc9c;color:#925e2c}
.skill-type .target-self{background:#e3f0e8;border-color:#aacdb9;color:#396e52}
.skill-type .target-random{background:#f4e4ef;border-color:#d5adca;color:#8b4c7b}

.skill-owners button.more-owners{flex-basis:100%;padding:2px 0;border:0;background:transparent;text-align:left;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px;cursor:pointer;color:#425d46}
.skill-owners button.more-owners:hover{color:#18332f}

/* Split the former flexible description width equally with the owner column. */
.skill-list-head,.skill-row{grid-template-columns:140px 65px 70px minmax(125px,calc(50% - 353.5px)) 80px minmax(345px,1fr) 48px}
.skill-description{min-width:0;white-space:normal;overflow-wrap:anywhere;word-break:normal}

/* Compact skill metadata: aligned label/value pairs instead of tall tiles. */
#detail-content .skill-detail-fields{grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:16px 0;border-top:1px solid #d5ddcc;border-left:1px solid #d5ddcc}
#detail-content .skill-detail-fields>div{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 10px;border-radius:0;border-right:1px solid #d5ddcc;border-bottom:1px solid #d5ddcc;background:#f4f6ee;min-width:0}
#detail-content .skill-detail-fields dt{font-size:11px;line-height:1.5;color:#53644f}
#detail-content .skill-detail-fields dd{margin:0;font-size:13px;line-height:1.5;font-weight:600;color:#263f33;white-space:normal;text-align:right}
@media(max-width:650px){#detail-content .skill-detail-fields{grid-template-columns:repeat(2,minmax(0,1fr))}#detail-content .skill-detail-fields>div{padding:8px}}

/* Effect types can be long identifiers; contain them inside their own column. */
.skill-tagset{min-width:0}.skill-tagset>span{max-width:100%;white-space:normal;overflow-wrap:anywhere;word-break:normal}
.effect-list .skill-list-head,.effect-list .skill-row{grid-template-columns:175px 55px 150px minmax(180px,1fr) 105px 130px 48px}
.effect-list .skill-description,.effect-list .skill-type{min-width:0;overflow-wrap:anywhere}