.home-shell{min-height:100dvh;display:grid;place-items:center;padding:32px}
.home-panel{width:min(760px,100%);padding:48px;border:1px solid var(--line);border-radius:24px;background:rgba(12,10,8,.76);backdrop-filter:blur(16px);box-shadow:var(--shadow)}
.home-panel h1{margin:8px 0 12px;font-size:clamp(34px,5vw,54px)}
.home-panel>p{max-width:620px;color:var(--text-soft);font-size:17px}
.home-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.resume-card{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;margin-top:30px;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.resume-card strong{font-size:18px}.resume-card span{display:block;color:var(--muted)}
.modal-backdrop,.sheet-backdrop{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:20px;background:rgba(0,0,0,.66);backdrop-filter:blur(6px)}
.modal{width:min(520px,100%);max-height:min(760px,calc(100dvh - 40px));overflow:auto;padding:24px;border:1px solid var(--line-strong);border-radius:18px;background:var(--surface-strong);box-shadow:var(--shadow)}
.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.modal-head h2{margin:0;font-size:24px}
.form-grid{display:grid;gap:16px}.field{display:grid;gap:7px}.field span{color:var(--text-soft);font-size:13px}
.field input,.field select,.search-input{width:100%;min-height:46px;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:rgba(0,0,0,.24)}
.field input:focus,.field select:focus,.search-input:focus{border-color:var(--gold)}
.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}
.level-hero{height:100%;display:grid;place-items:center;text-align:center}
.level-control{display:grid;grid-template-columns:52px minmax(120px,220px) 52px;gap:24px;align-items:center}
.level-button{width:52px;height:52px;border:1px solid var(--line-strong);border-radius:50%;background:rgba(0,0,0,.18);font-size:28px}
.level-number{font-family:Georgia,serif;font-size:clamp(82px,10vw,132px);line-height:.9;color:var(--gold-light);text-shadow:0 10px 30px rgba(0,0,0,.35)}
.level-label{margin-top:14px;color:var(--text-soft);font-size:16px}
.level-track{display:grid;grid-template-columns:repeat(12,1fr);gap:8px;width:min(760px,100%);margin:36px auto 18px}
.level-track button{position:relative;min-width:0;height:42px;border:0;border-bottom:2px solid var(--line);background:transparent;color:var(--muted)}
.level-track button.active{color:var(--gold);border-color:var(--gold)}
.level-track button.complete{color:var(--text-soft);border-color:rgba(223,189,114,.48)}
.impact-line{color:var(--text-soft);font-size:15px}
.route-layout{height:100%;display:grid;grid-template-rows:auto minmax(0,1fr);gap:20px}
.route-track{display:grid;grid-template-columns:repeat(12,minmax(56px,1fr));gap:8px;overflow-x:auto;padding-bottom:8px}
.route-node{min-height:74px;padding:8px;border:1px solid transparent;border-radius:10px;background:rgba(255,255,255,.025);text-align:center}
.route-node:hover{background:var(--surface-hover)}
.route-node.active{border-color:var(--gold);background:rgba(223,189,114,.09)}
.route-node[aria-disabled="true"]{opacity:.3;pointer-events:none}
.route-node b{display:block;color:var(--gold);font-family:Georgia,serif}.route-node span{display:block;overflow:hidden;margin-top:6px;font-size:13px;white-space:nowrap;text-overflow:ellipsis}
.route-editor{display:grid;place-items:center;min-height:0}
.route-editor-card{width:min(760px,100%);padding:22px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);text-align:center}
.route-editor-card h2{margin-bottom:16px;font-size:28px}.class-picker-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;text-align:left}.class-picker-option{position:relative;display:grid;gap:3px;min-height:64px;padding:10px 34px 10px 12px;border:1px solid var(--line);border-radius:9px;background:rgba(12,10,8,.34);color:var(--text);text-align:left}.class-picker-option:hover{border-color:var(--line-strong);background:var(--surface-hover)}.class-picker-option.selected{border-color:var(--gold);background:rgba(223,189,114,.1);box-shadow:inset 3px 0 var(--gold)}.class-picker-option strong{font-size:15px}.class-picker-option small{overflow:hidden;color:var(--muted);font-size:12px;white-space:nowrap;text-overflow:ellipsis}.class-picker-option .choice-check{position:absolute;right:12px;top:50%;transform:translateY(-50%)}
.detail-list{display:grid;gap:0;margin-top:18px}.detail-row{display:flex;justify-content:space-between;gap:20px;padding:12px 0;border-bottom:1px solid var(--line)}.detail-row span{color:var(--muted)}
.unlock-list{display:grid;gap:10px;margin-top:16px}.unlock-item{display:flex;gap:10px;align-items:flex-start}.unlock-dot{flex:0 0 8px;width:8px;height:8px;margin-top:7px;border-radius:50%;background:var(--gold)}
.spell-layout{height:100%;min-height:0;display:flex;flex-direction:column;gap:10px;overflow:hidden}
.spell-toolbar,.spell-counts,.prepared-strip{flex:0 0 auto}
.spell-list{flex:1 1 auto}
.spell-toolbar{display:grid;grid-template-columns:minmax(240px,.75fr) minmax(420px,1.25fr);gap:18px;align-items:end}
.filter-tabs{display:flex;gap:5px;overflow-x:auto}.filter-tab{min-height:40px;padding:7px 12px;border:0;border-radius:8px;background:transparent;color:var(--muted);white-space:nowrap}.filter-tab:hover{background:var(--surface-soft);color:var(--text)}.filter-tab.active{background:rgba(223,189,114,.12);color:var(--gold-light)}
.spell-list{min-height:0;overflow:auto;border-top:1px solid var(--line);border-bottom:1px solid var(--line);scrollbar-gutter:stable;overscroll-behavior:contain;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(124px,auto);align-content:start;gap:1px 12px}
.spell-item{display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;align-items:stretch;width:100%;min-width:0;min-height:124px;padding:12px 10px;border:0;border-bottom:1px solid var(--line);background:rgba(10,8,6,.22);text-align:left;overflow:hidden}
.spell-item:hover,.spell-item.focused{background:var(--surface-hover)}
.spell-item.selected{box-shadow:inset 3px 0 var(--gold)}
.spell-icon{display:grid;place-items:center;width:48px;height:48px;border:1px solid var(--line);border-radius:12px;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.16),transparent 30%),linear-gradient(145deg,var(--icon-a,#684535),var(--icon-b,#261b18));color:white;font-family:Georgia,serif;font-size:18px}
.spell-copy{display:grid;grid-template-rows:auto auto minmax(2.8em,1fr) auto;gap:4px;min-width:0;min-height:100%;align-self:stretch;overflow:hidden}.spell-title-line{display:flex;min-width:0;gap:8px;align-items:center;justify-content:space-between}.spell-copy strong{display:block;overflow:hidden;min-width:0;font-size:16px;line-height:1.25;white-space:nowrap;text-overflow:ellipsis}.spell-meta{display:block;color:var(--muted);font-size:12px;line-height:1.35}.spell-copy p{display:-webkit-box;overflow:hidden;margin:1px 0 0;color:var(--text-soft);font-size:13px;line-height:1.4;-webkit-line-clamp:2;-webkit-box-orient:vertical}.spell-card-footer{display:flex;min-height:24px;align-items:flex-end;overflow:hidden}.spell-state{flex:0 0 auto;padding:2px 6px;border:1px solid rgba(223,189,114,.28);border-radius:999px;color:var(--gold);font-size:10px;line-height:1.2;white-space:nowrap}
.spell-detail-icon{width:68px;height:68px;font-size:24px}.spell-detail-title{display:flex;gap:16px;align-items:center;margin-bottom:24px}.spell-detail-title h2{margin:0 0 4px}.spell-detail-title p{margin:0;color:var(--muted)}
.spell-description{font-size:15px;line-height:1.75}.spell-actions{display:flex;gap:10px;margin-top:24px}
.placeholder-view{height:100%;display:grid;place-items:center;text-align:center}.placeholder-view h2{font-size:28px}.placeholder-view p{max-width:520px;color:var(--text-soft)}

.spell-item{transition:background .16s var(--ease),box-shadow .16s var(--ease)}
.spell-item+.spell-item{margin-top:1px}
.spell-item.selected{background:linear-gradient(90deg,rgba(223,189,114,.075),rgba(143,52,48,.035))}
.spell-list-image,.spell-detail-image,.library-thumb{opacity:.68;transition:opacity .18s var(--ease),filter .18s var(--ease);filter:saturate(.85)}
.spell-list-image.is-loaded,.spell-detail-image.is-loaded,.library-thumb.is-loaded{opacity:1;filter:none}

/* M10 computed effects, class abilities, and character output */
.computed-effect{display:grid;gap:10px;margin:18px 0;padding:14px;border:1px solid var(--line);border-radius:12px;background:rgba(0,0,0,.15)}
.computed-effect-head{display:flex;justify-content:space-between;gap:12px;align-items:center}.computed-effect-head>span{color:var(--gold);font-size:12px;font-weight:700;letter-spacing:.07em}.computed-effect-head small{color:var(--muted);font-size:11px}
.effect-part-list{display:grid;gap:7px}.effect-part{--damage-color:var(--gold);display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;align-items:center;padding:9px 10px;border-left:3px solid var(--damage-color);border-radius:7px;background:color-mix(in srgb,var(--damage-color) 8%,transparent)}
.damage-type-icon{display:grid;place-items:center;width:30px;height:30px;border:1px solid color-mix(in srgb,var(--damage-color) 45%,transparent);border-radius:8px;color:var(--damage-color);background:color-mix(in srgb,var(--damage-color) 10%,transparent);font-size:16px}
.effect-part b,.effect-part span,.effect-part small{display:block}.effect-part b{color:var(--damage-color);font:700 19px Georgia,serif}.effect-part span{font-size:12px}.effect-part small{margin-top:2px;color:var(--muted);font-size:11px}.effect-note{margin:0!important;color:var(--muted)!important;font-size:12px!important}
.computed-effect.compact{margin:7px 0 0;padding:8px}.computed-effect.compact .computed-effect-head{display:none}.computed-effect.compact .effect-part-list{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.computed-effect.compact .effect-part{grid-template-columns:24px minmax(0,1fr);padding:6px}.computed-effect.compact .damage-type-icon{width:22px;height:22px;font-size:12px}.computed-effect.compact .effect-part b{font-size:14px}.computed-effect.compact .effect-part small{display:none}
.feature-computed{--damage-color:var(--gold);display:grid;grid-template-columns:36px minmax(0,1fr);gap:10px;align-items:center;margin:16px 0;padding:10px;border-left:3px solid var(--damage-color);background:color-mix(in srgb,var(--damage-color) 7%,transparent)}.feature-computed b,.feature-computed span{display:block}.feature-computed b{color:var(--damage-color);font-size:18px}.feature-computed span{color:var(--text-soft);font-size:12px}.feature-effect-note{margin:16px 0;padding:10px;border-left:2px solid var(--gold);color:var(--text-soft);background:rgba(223,189,114,.05)}
.option-effect-formula{display:inline-flex!important;width:max-content;margin-top:6px;padding:2px 7px;border-radius:999px;background:color-mix(in srgb,var(--damage-color,var(--gold)) 10%,transparent);color:var(--damage-color,var(--gold))!important;font-size:11px!important;font-style:normal}
.cast-level-field{display:flex;justify-content:space-between;gap:14px;align-items:center;margin:14px 0;padding:10px 0;border-bottom:1px solid var(--line)}.cast-level-field span{color:var(--muted)}.cast-level-field select{min-height:40px;padding:7px 10px;border:1px solid var(--line);border-radius:8px;background:#15110d}
.feature-result-groups{display:grid;gap:10px}.feature-result-group>small{display:block;margin-bottom:5px;color:var(--muted);font-size:10px}.feature-summary-icon{overflow:visible}.feature-summary-icon i{position:absolute;left:50%;bottom:-8px;max-width:54px;padding:1px 4px;border-radius:4px;background:#18130f;color:var(--damage-color,var(--gold));font-size:8px;font-style:normal;white-space:nowrap;transform:translateX(-50%)}
.compact-feature-summary{display:grid;gap:7px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}.compact-feature-head{display:flex;justify-content:space-between;gap:10px;color:var(--gold);font-size:11px;font-weight:700}.compact-feature-row{display:flex;gap:6px;overflow-x:auto;padding-bottom:3px;scrollbar-width:thin}.compact-feature-chip{--damage-color:var(--gold);flex:0 0 auto;display:grid;grid-template-columns:22px minmax(0,1fr);gap:6px;align-items:center;min-width:92px;max-width:138px;padding:6px 8px;border:1px solid color-mix(in srgb,var(--damage-color) 28%,var(--line));border-radius:8px;background:color-mix(in srgb,var(--damage-color) 6%,rgba(0,0,0,.12));color:var(--text);text-align:left}.compact-feature-chip:hover,.compact-feature-chip:focus-visible{border-color:var(--damage-color);background:color-mix(in srgb,var(--damage-color) 11%,rgba(0,0,0,.12))}.compact-feature-chip>span{display:grid;place-items:center;width:22px;height:22px;border-radius:6px;color:var(--damage-color);background:color-mix(in srgb,var(--damage-color) 12%,transparent)}.compact-feature-chip b,.compact-feature-chip small{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.compact-feature-chip b{font-size:11px}.compact-feature-chip small{color:var(--damage-color);font-size:9px}
.combat-formula-list{display:grid;gap:5px}.combat-formula-item{display:grid;grid-template-columns:32px minmax(0,1fr);gap:8px;align-items:center;padding:6px;border:0;border-bottom:1px solid var(--line);background:transparent;text-align:left}.combat-formula-item:hover{background:var(--surface-hover)}.combat-formula-item b,.combat-formula-item small{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.combat-formula-item b{font-size:12px}.combat-formula-item small{color:var(--muted);font-size:10px}
.character-feature-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.character-feature-groups article{padding:14px;border-top:1px solid var(--line);background:rgba(0,0,0,.1)}.character-feature-groups h3{font-size:16px}.character-feature-row{display:grid;grid-template-columns:40px minmax(0,1fr);gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}.character-feature-row p{margin:3px 0;color:var(--muted);font-size:12px}.character-spell-cards{display:grid;gap:8px}.character-spell-card{display:grid;grid-template-columns:34px minmax(0,1fr);gap:8px;align-items:start;padding:8px;border-bottom:1px solid var(--line)}.character-spell-card b,.character-spell-card small{display:block}.character-spell-card small{color:var(--muted)}
.mobile-build-status,.mobile-result-summary{display:none}
.sheet-header{position:sticky;top:0;z-index:2;display:grid;grid-template-columns:1fr auto;align-items:center;min-height:38px;background:var(--surface-strong)}.sheet-handle{grid-column:1/-1;grid-row:1;align-self:start}.sheet-close{grid-column:2;grid-row:1;padding:7px 10px;border:0;background:transparent;color:var(--gold);font-weight:700}.sheet-scroll{min-height:0;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.damage-acid{--damage-color:var(--damage-acid)}.damage-cold{--damage-color:var(--damage-cold)}.damage-fire{--damage-color:var(--damage-fire)}.damage-lightning{--damage-color:var(--damage-lightning)}.damage-thunder{--damage-color:var(--damage-thunder)}.damage-poison{--damage-color:var(--damage-poison)}.damage-radiant{--damage-color:var(--damage-radiant)}.damage-necrotic{--damage-color:var(--damage-necrotic)}.damage-psychic{--damage-color:var(--damage-psychic)}.damage-force{--damage-color:var(--damage-force)}.damage-weapon{--damage-color:var(--damage-weapon)}.damage-slashing{--damage-color:var(--damage-slashing)}.damage-piercing{--damage-color:var(--damage-piercing)}.damage-bludgeoning{--damage-color:var(--damage-bludgeoning)}.damage-healing{--damage-color:var(--damage-healing)}.damage-temporary{--damage-color:var(--damage-temporary)}.damage-elemental{--damage-color:var(--damage-elemental)}
.spell-quick-effect{display:inline-flex!important;width:max-content;max-width:100%;margin-top:2px;padding:2px 7px;border-radius:999px;background:color-mix(in srgb,var(--damage-color,var(--gold)) 9%,transparent);color:var(--damage-color,var(--gold))!important;font-size:11px!important;font-style:normal;white-space:nowrap}