:root{color-scheme:dark;--page: #0b1020;--panel: #121a2b;--card: #1a2538;--card-hover: #202d42;--slot-hover: #151f32;--soft-text: #c9d4e1;--border: #29364a;--border-strong: #3b4d66;--text: #f1f5f9;--muted: #a3b4c8;--accent: #46d5e5;--accent-soft: rgba(70, 213, 229, .12);--positive: #75d69a;--danger: #e16a78;--danger-soft: rgba(225, 106, 120, .12);--radius: 10px;--control-height: 40px}html[data-theme=light]{color-scheme:light;--page: #f3f6fa;--panel: #ffffff;--card: #edf2f7;--card-hover: #e2e9f1;--slot-hover: #e7edf4;--border: #cbd5e1;--border-strong: #94a3b8;--text: #172033;--muted: #5d6b7e;--accent-soft: rgba(20, 154, 170, .1);--soft-text: #445166}*{box-sizing:border-box}html{min-width:320px;scroll-behavior:smooth}body{min-width:320px;min-height:100vh;margin:0;overflow-x:hidden;color:var(--text);background:var(--page);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button{color:inherit}button,[role=button]{-webkit-tap-highlight-color:transparent}h1,h2,h3,p{margin:0}img{display:block;max-width:100%}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.page-shell{width:min(1500px,calc(100% - 40px));margin:0 auto;padding:24px 0 64px}.tool-bar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 20px;border:1px solid var(--border);border-radius:12px;background:var(--panel)}.tool-bar h1{color:var(--text);font-size:clamp(22px,2vw,26px);font-weight:700;line-height:1.2;letter-spacing:-.025em}.tool-bar p,.section-help,.directory-heading p{color:var(--muted);font-size:13px}.tool-bar p{margin-top:4px}.tool-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px}.tool-actions button,.tool-actions select,.tool-actions input,.section-head button,.directory-search input{height:var(--control-height);border:1px solid var(--border);border-radius:8px;color:var(--text);background:var(--card);font-size:13px;font-weight:600;transition:border-color .15s ease,background-color .15s ease,color .15s ease}.tool-actions button,.section-head button{padding:0 14px;cursor:pointer}.tool-actions input,.tool-actions select{padding:0 12px}.tool-actions select{min-width:148px}.tool-actions input{width:140px}.tool-actions input::placeholder,.directory-search input::placeholder{color:#7f91a8}.tool-actions button:hover,.section-head button:hover{border-color:var(--border-strong);background:var(--card-hover)}.tool-actions button:disabled{opacity:.45;cursor:not-allowed}.tool-actions .accent-button,#save-layout,.section-head button{border-color:var(--accent);color:#07161a;background:var(--accent)}.tool-actions .accent-button:hover,#save-layout:hover,.section-head button:hover{border-color:#73e2ed;background:#73e2ed}#delete-layout:not(:disabled),#reset-build{border-color:#e16a7880;color:#f6c5cb;background:var(--danger-soft)}#delete-layout:not(:disabled):hover,#reset-build:hover{border-color:var(--danger);color:#fff;background:#e16a7833}.builder-layout{display:grid;grid-template-columns:minmax(0,1fr) 390px;align-items:start;gap:20px;margin-top:20px}.builder-main{min-width:0}.pet-area,.directory-panel,.summary-panel{border:1px solid var(--border);border-radius:12px;color:var(--text);background:var(--panel)}.pet-area{min-height:294px;padding:20px}.section-head,.directory-heading,.summary-title,.boost-group-head,.boost-limit{display:flex;align-items:center;justify-content:space-between;gap:12px}.section-head h2,.directory-heading h2{color:var(--text);font-size:20px;font-weight:700;line-height:1.25;letter-spacing:-.015em}.section-help{margin-top:5px}.pet-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(224px,1fr));gap:12px;margin-top:18px}.pet-card,.add-pet-card{min-width:0;min-height:184px;border:1px solid var(--border);border-radius:var(--radius);background:var(--card)}.pet-card{padding:12px;transition:border-color .15s ease,background-color .15s ease}.pet-card:hover{border-color:var(--border-strong)}.pet-card.selected{border-color:#46d5e599}.pet-head{display:flex;min-height:32px;align-items:center;justify-content:space-between;gap:10px}.pet-head strong{color:var(--text);font-size:14px;font-weight:700}.pet-actions{display:flex;align-items:center;gap:6px}.pet-head button{min-width:34px;height:30px;padding:0 10px;border:1px solid var(--border);border-radius:7px;color:var(--muted);background:transparent;cursor:pointer;font-size:12px;font-weight:600;transition:border-color .15s ease,background-color .15s ease,color .15s ease}.pet-head button:hover{border-color:var(--border-strong);color:var(--text);background:var(--card-hover)}.pet-head .pet-remove{width:30px;min-width:30px;padding:0;color:#ef9aa4;font-size:18px;line-height:1}.pet-head .pet-remove:hover{border-color:#e16a7899;color:#fff;background:var(--danger-soft)}.pet-slots{display:grid;grid-template-rows:repeat(2,minmax(60px,1fr));gap:8px;margin-top:8px}.slot{display:flex;min-width:0;min-height:60px;flex-direction:column;justify-content:center;padding:8px 10px;overflow:hidden;border:1px solid var(--border);border-radius:8px;color:var(--muted);background:var(--panel);cursor:pointer;text-align:left;transition:border-color .15s ease,background-color .15s ease}.slot:hover{border-color:var(--border-strong);background:var(--slot-hover)}.slot.active,.slot.drag-over{border-color:var(--accent);color:var(--text);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent)}.slot.filled{display:grid;min-height:68px;grid-template-columns:54px minmax(0,1fr);align-items:center;gap:10px;padding:6px 8px;overflow:visible;color:var(--text)}.slot.filled:hover{border-color:#e16a788c}.slot-image,.enchant-image-space{display:grid;place-items:center;overflow:hidden;border:0;border-radius:7px;color:#74869d;background:transparent;font-size:8px}.slot-image{width:52px;height:52px;overflow:visible}.slot-image img,.enchant-image-space img,.stat-image img{width:100%;height:100%;object-fit:contain}.slot-image img{object-position:center;transform:scale(.9);transform-origin:center}.slot-copy,.family-copy{display:flex;min-width:0;flex-direction:column;justify-content:center}.slot strong,.family-copy strong{overflow:hidden;color:var(--text);font-size:13px;font-weight:700;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}.slot-copy>span,.family-copy>span{display:-webkit-box;overflow:hidden;margin-top:3px;color:var(--muted);font-size:12px;line-height:1.3;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.slot.empty strong{color:var(--text)}.slot.empty>span{color:var(--muted);font-size:12px}.add-pet-card{display:grid;min-height:184px;place-items:center;border-style:dashed;color:var(--muted);cursor:pointer;font-size:14px;font-weight:700;transition:border-color .15s ease,background-color .15s ease,color .15s ease}.add-pet-card:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}.summary-panel{position:sticky;top:20px;padding:20px}.summary-title span,.breakdown-label{color:var(--text);font-size:14px;font-weight:700;letter-spacing:.04em}.boost-list-wrap{margin-top:16px;padding:14px;border:1px solid var(--border);border-radius:var(--radius);background:var(--card)}.boost-legend{display:flex;min-width:0;flex-direction:column;gap:4px}.boost-legend>div{display:grid;min-height:38px;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:10px;padding:4px 0}.boost-legend i.stat-image{display:grid;width:28px;height:28px;place-items:center;overflow:hidden;border-radius:6px;background:transparent;font-style:normal}.stat-image span{color:#74869d;font-size:7px}.boost-legend .stat-name{color:var(--muted);font-size:13px}.boost-legend .stat-row strong{color:var(--positive);font-size:14px;font-weight:700}.boost-legend .stat-row.is-negative strong{color:var(--danger)}.legend-empty{color:var(--muted);font-size:13px}.summary-divider{height:1px;margin:20px 0 16px;background:var(--border)}.boost-groups{display:flex;max-height:500px;flex-direction:column;gap:10px;margin-top:12px;overflow-y:auto;padding-right:4px;scrollbar-color:var(--border-strong) var(--panel);scrollbar-width:thin}.summary-empty{padding:22px 14px;border:1px dashed var(--border-strong);border-radius:var(--radius);color:var(--muted);text-align:center;font-size:13px}.boost-group{padding:13px;border:1px solid var(--border);border-radius:var(--radius);background:var(--card)}.boost-group-head strong{color:var(--text);font-size:14px}.boost-group-head span{color:var(--positive);font-size:14px;font-weight:700}.boost-group-head span.is-negative{color:var(--danger)}.boost-limit{align-items:flex-start;margin-top:6px;color:var(--muted);font-size:11px}.boost-limit strong{color:var(--soft-text);text-align:right;font-weight:600}.boost-bar{height:5px;margin:10px 0 6px;overflow:hidden;border-radius:99px;background:var(--border)}.boost-bar i{display:block;width:var(--bar-width);height:100%;border-radius:inherit;background:var(--positive)}.boost-sources{margin-top:4px}.boost-sources.scrollable{max-height:170px;overflow-y:auto;padding-right:4px;scrollbar-width:thin}.boost-line{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;min-height:30px;padding:7px 0;border-bottom:1px solid var(--border);color:var(--muted);font-size:11px}.boost-line:last-child{border-bottom:0}.boost-line span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.boost-line span:last-child{color:var(--positive);text-align:right;font-weight:600}.boost-line.is-negative span:last-child{color:var(--danger)}.boost-line.threshold-hit{margin-top:4px;padding:7px 8px;border:1px solid rgba(225,106,120,.45);border-radius:7px;color:#efadb5;background:var(--danger-soft)}.boost-line.threshold-hit span:last-child{color:#f2a1ab}.rule-notes{margin-top:12px;padding:11px 12px;border:1px solid #534b32;border-radius:var(--radius);color:#d7c993;background:#24231f;font-size:11px;line-height:1.45}.rule-notes p+p{margin-top:6px}html[data-theme=light] .rule-notes{border-color:#d8ca91;color:#6a5715;background:#fff8dc}.directory-panel{margin-top:20px;padding:20px}.directory-heading{align-items:flex-end}.directory-heading p{margin-top:4px}.directory-search input{width:260px;padding:0 12px;outline:0;font-weight:400}.directory-search input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.tabs{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px;padding-bottom:14px;border-bottom:1px solid var(--border)}.tab{min-width:72px;height:36px;padding:0 14px;border:1px solid var(--border);border-radius:8px;color:var(--muted);background:transparent;cursor:pointer;font-size:13px;font-weight:600;transition:border-color .15s ease,background-color .15s ease,color .15s ease}.tab:hover{border-color:var(--border-strong);color:var(--text);background:var(--card)}.tab.active{border-color:#46d5e58c;color:var(--accent);background:var(--accent-soft)}.directory-list{display:grid;grid-template-columns:repeat(4,minmax(190px,1fr));gap:10px;align-content:start;max-height:610px;margin-top:14px;overflow-y:auto;padding:1px 6px 4px 1px;scrollbar-color:var(--border-strong) var(--panel);scrollbar-width:thin}.directory-list[data-active-category=All]{max-height:none;overflow:visible;padding-right:1px}.directory-section{display:contents}.directory-section.hidden,.enchant-cube.hidden{display:none}.enchant-cube{display:grid;min-width:0;min-height:84px;grid-template-columns:58px minmax(0,1fr);align-items:center;gap:10px;padding:10px;overflow:hidden;border:1px solid var(--border);border-radius:var(--radius);color:var(--text);background:var(--card);cursor:grab;text-align:left;touch-action:pan-y;transition:border-color .15s ease,background-color .15s ease}.enchant-cube:hover{border-color:var(--border-strong);background:var(--card-hover)}.enchant-cube:active{cursor:grabbing}.enchant-image-space{width:56px;height:62px}.family-copy strong{font-size:14px}.family-copy>span{-webkit-line-clamp:3}.empty-results{margin-top:14px;padding:28px 16px;border:1px dashed var(--border-strong);border-radius:var(--radius);color:var(--muted);text-align:center}.toast{position:fixed;z-index:10;right:20px;bottom:20px;max-width:min(360px,calc(100% - 40px));padding:11px 14px;border:1px solid var(--border-strong);border-radius:8px;color:var(--text);background:var(--card);opacity:0;pointer-events:none;transform:translateY(8px);transition:opacity .15s ease,transform .15s ease}.toast.show{opacity:1;transform:translateY(0)}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:1260px){.builder-layout{grid-template-columns:minmax(0,1fr) 350px}.directory-list{grid-template-columns:repeat(3,minmax(190px,1fr))}}@media(max-width:1040px){.tool-bar{align-items:flex-start;flex-direction:column}.tool-actions{width:100%;justify-content:flex-start}.builder-layout{grid-template-columns:1fr}.summary-panel{position:static}}@media(max-width:760px){.page-shell{width:min(100% - 20px,1500px);padding-top:10px}.tool-bar,.pet-area,.directory-panel,.summary-panel{padding:15px}.tool-actions{align-items:stretch}.tool-actions select,.tool-actions input{width:calc(50% - 4px);min-width:0}.tool-actions button{flex:1 1 auto}.directory-heading{align-items:stretch;flex-direction:column}.directory-search input{width:100%}.directory-list,.pet-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:540px){.tool-actions select,.tool-actions input{width:100%}.section-head{align-items:flex-start}.pet-grid,.directory-list{grid-template-columns:1fr}.pet-card,.add-pet-card{min-height:176px}.tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.tab{min-width:0}.boost-line{grid-template-columns:1fr;gap:2px}.boost-line span:last-child{text-align:left}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}