.ability-shell{min-height:100vh;background:var(--bg);color:var(--ink)}.ability-header{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px clamp(12px,3vw,30px);background:color-mix(in srgb,var(--paper) 94%,transparent);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}.ability-header>div{display:grid;gap:2px}.ability-header small{color:var(--muted)}.ability-nav{display:flex;gap:8px;padding:10px clamp(12px,3vw,30px);overflow-x:auto;border-bottom:1px solid var(--line);background:var(--paper)}.ability-nav button,.ability-bottom button{appearance:none;border:0;background:transparent;color:inherit;padding:9px 12px;border-radius:999px;white-space:nowrap}.ability-nav button.active{background:var(--accent);color:white}.ability-main{width:min(1240px,100%);margin:0 auto;padding:18px clamp(12px,3vw,30px) 90px;min-width:0}.ability-directory{display:grid;gap:9px;margin:12px 0}.ability-card{appearance:none;width:100%;display:grid;grid-template-columns:minmax(120px,1fr) auto;gap:4px 12px;text-align:left;border:1px solid var(--line);background:var(--paper);color:inherit;border-radius:13px;padding:12px;cursor:pointer;min-width:0}.ability-card:hover{border-color:var(--accent)}.ability-card b,.ability-card span,.ability-card small{overflow-wrap:anywhere}.ability-card small{grid-column:1/-1;color:var(--muted)}.ability-modal{width:min(1050px,calc(100vw - 24px));max-height:calc(100vh - 28px);overflow:auto}.ability-detail-grid,.assignment-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.ability-detail-grid>section,.assignment-grid>form,.capability-section,.stage-node{border:1px solid var(--line);border-radius:13px;padding:12px;min-width:0}.assignment-grid form{display:grid;gap:8px}.capability-section{margin:10px 0;background:var(--paper)}.capability-section summary{cursor:pointer;font-weight:700}.capability-section summary span{float:right;color:var(--muted)}.capability-section>div{display:grid;gap:7px;margin-top:10px}.stage-tree{display:grid;gap:10px;margin:12px 0}.stage-node>div{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.stage-node>div span{border:1px solid var(--line);border-radius:999px;padding:5px 9px}.stage-node form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.ability-toast{position:fixed;right:16px;bottom:16px;z-index:1400;background:#173d31;color:white;padding:10px 14px;border-radius:10px;box-shadow:0 8px 25px #0004}.ability-toast.error{background:#7b2828}.ability-bottom{display:none}
@media(max-width:900px){.ability-nav{padding-bottom:12px}.ability-detail-grid,.assignment-grid{grid-template-columns:1fr}.ability-main{padding-bottom:92px}.stage-node form{grid-template-columns:1fr}}
@media(max-width:720px){.ability-header{top:28px}.ability-nav{display:none}.ability-main{padding:12px 8px 88px;overflow-x:hidden}.ability-card{grid-template-columns:1fr}.ability-card small{grid-column:auto}.ability-modal{width:calc(100vw - 10px);max-height:calc(100vh - 12px)}.ability-bottom{display:grid;position:fixed;z-index:50;left:0;right:0;bottom:0;grid-template-columns:repeat(4,1fr);padding:7px max(7px,env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(7px,env(safe-area-inset-left));background:var(--paper);border-top:1px solid var(--line)}.ability-bottom button{border-radius:10px}.ability-main pre{white-space:pre-wrap;word-break:break-word}.ability-detail-grid>section,.assignment-grid>form,.capability-section,.stage-node{overflow-wrap:anywhere}}
