.build-planner-page,.gear-compare-page{width:100%;max-width:100%;padding-bottom:4rem;overflow-x:hidden}.planner-breadcrumbs{color:var(--text-muted);align-items:center;gap:.5rem;margin-top:1rem;margin-bottom:1.25rem;font-size:.85rem;display:flex}.planner-breadcrumbs a{color:var(--text-muted);text-decoration:none}.planner-breadcrumbs a:hover{color:var(--accent);text-decoration:underline}.planner-breadcrumbs .sep{opacity:.5}.planner-breadcrumbs .current{color:var(--silver);font-weight:600}.planner-header{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);margin-bottom:1.5rem;padding:1.25rem 1.5rem}.planner-title-row{border-bottom:1px solid #ffffff0f;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;padding-bottom:.85rem;display:flex}.planner-heading h1{color:var(--silver);letter-spacing:.02em;margin:0;font-size:1.75rem}.planner-heading p{color:var(--text-muted);margin:.25rem 0 0;font-size:.9rem}.planner-top-actions{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.btn-planner{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--panel);min-height:44px;color:var(--text);cursor:pointer;user-select:none;align-items:center;gap:.4rem;padding:.5rem .85rem;font-size:.85rem;font-weight:600;transition:all .15s;display:inline-flex}.btn-planner:hover{border-color:var(--accent);color:#fff;background:#50cdfc1f;text-decoration:none}.btn-planner.btn-primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.btn-planner.btn-primary:hover{filter:brightness(1.1);color:var(--accent-ink)}.btn-planner.btn-danger:hover{color:#f87171;background:#ef44441a;border-color:#f87171}.planner-controls-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;display:flex}.class-picker-group{flex-wrap:wrap;align-items:center;gap:.35rem;display:flex}.class-btn{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg);min-height:44px;color:var(--text-muted);cursor:pointer;align-items:center;gap:.4rem;padding:.35rem .65rem;font-size:.85rem;font-weight:600;transition:all .15s;display:flex}.class-btn:hover{color:var(--text);border-color:#ffffff4d}.class-btn.active{color:#fbbf24;background:#f59e0b26;border-color:#f59e0b;box-shadow:0 0 10px #f59e0b33}.class-btn img{object-fit:cover;border-radius:50%;width:20px;height:20px}.level-picker-group{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);align-items:center;gap:.6rem;min-height:44px;padding:.35rem .75rem;display:flex}.level-picker-group label{color:var(--silver);font-size:.85rem;font-weight:700}.level-slider{cursor:pointer;width:100px;accent-color:var(--accent)}.level-input{text-align:center;background:var(--panel);border:1px solid var(--border);width:48px;min-height:32px;color:var(--accent);border-radius:4px;font-weight:700}.planner-mobile-tabs{grid-template-columns:repeat(4,1fr);gap:.35rem;margin-bottom:1rem;display:none}.m-tab-btn{border:1px solid var(--border);background:var(--surface);min-height:48px;color:var(--text-muted);border-radius:var(--radius-sm);cursor:pointer;text-align:center;flex-direction:column;justify-content:center;align-items:center;padding:.5rem .25rem;font-size:.78rem;font-weight:600;display:flex}.m-tab-btn.active{background:var(--panel);border-color:var(--accent);color:var(--accent)}.planner-workspace{grid-template-columns:340px minmax(0,1fr) 340px;align-items:start;gap:1.25rem;width:100%;min-width:0;max-width:100%;display:grid}.planner-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-sizing:border-box;width:100%;min-width:0;max-width:100%;padding:1.25rem}.panel-header{border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.6rem;display:flex}.panel-title{color:var(--silver);align-items:center;gap:.5rem;margin:0;font-size:1.1rem;display:flex}.panel-subtitle{color:var(--text-muted);font-size:.8rem}.gear-slots-list{flex-direction:column;gap:.5rem;display:flex}.slot-category-title{text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);margin:.6rem 0 .2rem;padding-left:.2rem;font-size:.75rem;font-weight:700}.gear-slot-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;box-sizing:border-box;align-items:center;gap:.75rem;width:100%;min-width:0;max-width:100%;min-height:52px;padding:.4rem .6rem;transition:all .15s;display:flex;position:relative}.gear-slot-card:hover{background:#50cdfc0a;border-color:#50cdfc66}.gear-slot-card.selected{border-color:var(--accent);background:#50cdfc1a;box-shadow:0 0 10px #50cdfc26}.slot-icon-box{background:var(--bg);border:1px solid var(--border);border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;display:flex;position:relative;overflow:hidden}.slot-frame-bg{opacity:.45;object-fit:contain;width:32px;height:32px}.slot-item-icon{object-fit:cover;z-index:2;width:100%;height:100%;position:absolute;inset:0}.slot-grade-badge{z-index:3;border-radius:2px 0 0;padding:1px 3px;font-size:.65rem;font-weight:700;line-height:1;position:absolute;bottom:0;right:0}.slot-ench-badge{color:#38bdf8;z-index:3;background:#000000d9;border-radius:0 0 2px;padding:2px 3px;font-size:.68rem;font-weight:800;line-height:1;position:absolute;top:0;left:0}.slot-content-info{flex:1;min-width:0}.slot-label-name{color:var(--text-muted);font-size:.75rem;display:block}.slot-item-title{color:var(--text);white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:.88rem;font-weight:600;overflow:hidden}.slot-empty-title{color:#ffffff59;font-style:italic}.slot-item-meta{color:var(--text-muted);align-items:center;gap:.4rem;margin-top:1px;font-size:.75rem;display:flex}.slot-gems-strip{align-items:center;gap:2px;display:flex}.gem-dot{background:#ffffff26;border:1px solid #fff3;border-radius:50%;width:7px;height:7px}.gem-dot.filled{background:#38bdf8;border-color:#7dd3fc;box-shadow:0 0 4px #38bdf8}.slot-btn-clear{color:#ffffff4d;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;min-height:44px;padding:.25rem .5rem;font-size:1.1rem;display:flex}.slot-btn-clear:hover{color:#f87171}.center-tabs-nav{border-bottom:1px solid var(--border);white-space:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:thin;gap:.35rem;margin-bottom:1rem;padding-bottom:.5rem;display:flex;overflow:auto hidden}.c-tab-btn{white-space:nowrap;border-radius:var(--radius-sm);min-height:44px;color:var(--text-muted);cursor:pointer;background:0 0;border:1px solid #0000;flex-shrink:0;padding:.5rem .75rem;font-size:.82rem;font-weight:600;transition:all .15s}@media (width<=1400px){.c-tab-btn{padding:.45rem .6rem;font-size:.78rem}}.c-tab-btn:hover{color:var(--text);background:#ffffff0a}.c-tab-btn.active{background:var(--panel);border-color:var(--border);color:var(--accent)}.tab-pane{display:none}.tab-pane.active{display:block}.slot-inspector{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:1.25rem;padding:1rem}.inspector-header{border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:.85rem;padding-bottom:.65rem;display:flex}.inspector-title{align-items:center;gap:.75rem;display:flex}.inspector-name{color:var(--silver);margin:0;font-size:1.05rem;font-weight:700}.inspector-meta{color:var(--text-muted);font-size:.8rem}.control-row{flex-direction:column;gap:.4rem;margin-bottom:.85rem;display:flex}.control-label-row{justify-content:space-between;align-items:center;font-size:.85rem;font-weight:600;display:flex}.control-value-tag{color:var(--accent);font-weight:700}.slider-input{background:var(--panel);cursor:pointer;width:100%;height:6px;accent-color:var(--accent);border-radius:3px}.tier-pills{gap:.4rem;display:flex}.tier-pill{text-align:center;border:1px solid var(--border);background:var(--panel);min-height:44px;color:var(--text-muted);cursor:pointer;border-radius:4px;flex:1;padding:.4rem .5rem;font-size:.8rem;font-weight:600}.tier-pill.active{color:#d8b4fe;background:#a855f726;border-color:#a855f7}.sockets-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.5rem;margin-top:.5rem;display:grid}.socket-slot-item{background:var(--panel);border:1px solid var(--border);border-radius:4px;flex-direction:column;gap:.35rem;padding:.5rem;display:flex}.socket-slot-label{color:var(--text-muted);font-size:.75rem;font-weight:700}.socket-select,.socket-grade-select{background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:3px;min-height:38px;padding:.35rem;font-size:.8rem}.set-bonuses-box{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);margin-top:1rem;padding:.85rem}.set-bonuses-title{color:var(--silver);align-items:center;gap:.4rem;margin-bottom:.5rem;font-size:.88rem;font-weight:700;display:flex}.set-bonus-item{background:var(--panel);border:1px solid #ffffff0f;border-radius:4px;margin-bottom:.4rem;padding:.5rem .75rem}.set-bonus-item:last-child{margin-bottom:0}.set-bonus-name{color:#38bdf8;font-size:.82rem;font-weight:700}.set-bonus-desc{color:var(--text-muted);margin-top:.15rem;font-size:.78rem}.arcana-grid{flex-direction:column;gap:.75rem;display:flex}.arcana-card-row{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.75rem}.arcana-card-header{justify-content:space-between;align-items:center;margin-bottom:.5rem;display:flex}.skills-controls-bar{justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.stigma-slots-strip{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);flex-wrap:wrap;gap:.5rem;margin-bottom:1.25rem;padding:.75rem;display:flex}.stigma-slot-card{border:1px solid var(--border);background:var(--panel);cursor:pointer;border-radius:6px;justify-content:center;align-items:center;width:52px;height:52px;display:flex;position:relative}.stigma-slot-card:hover{border-color:var(--accent)}.stigma-slot-card img{object-fit:cover;border-radius:4px;width:44px;height:44px}.skills-list-grid{flex-direction:column;gap:.5rem;max-height:560px;padding-right:.35rem;display:flex;overflow-y:auto}.skill-row-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-sm);justify-content:space-between;align-items:center;gap:.75rem;padding:.5rem .75rem;display:flex}.skill-left-col{flex:1;align-items:center;gap:.65rem;min-width:0;display:flex}.skill-icon-wrap{background:var(--bg);border:1px solid var(--border);border-radius:4px;flex-shrink:0;width:36px;height:36px;overflow:hidden}.skill-info-wrap{flex:1;min-width:0}.skill-name-line{color:var(--text);white-space:nowrap;text-overflow:ellipsis;font-size:.85rem;font-weight:700;overflow:hidden}.skill-meta-line{color:var(--text-muted);font-size:.75rem}.skill-level-control{align-items:center;gap:.35rem;display:flex}.btn-level-step{border:1px solid var(--border);background:var(--bg);width:32px;height:32px;min-height:32px;color:var(--text);cursor:pointer;border-radius:3px;justify-content:center;align-items:center;font-weight:700;display:flex}.btn-level-step:hover{border-color:var(--accent);color:var(--accent)}.skill-level-display{text-align:center;width:28px;color:var(--accent);font-size:.85rem;font-weight:700}.daevanion-summary-box{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);text-align:center;padding:1.25rem}.daevanion-boards-grid{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.75rem;margin:1rem 0;display:grid}.board-card{background:var(--panel);border:1px solid var(--border);text-align:center;border-radius:4px;padding:.75rem .5rem}.board-card h4{color:var(--silver);margin:0 0 .25rem;font-size:.85rem}.board-card p{color:var(--text-muted);margin:0;font-size:.75rem}.stats-panel-sticky{position:sticky;top:1rem}.stats-hero-banner{grid-template-columns:repeat(3,1fr);gap:.5rem;margin-bottom:1rem;display:grid}.hero-stat-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-sm);text-align:center;padding:.6rem .4rem}.hero-stat-card .label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;font-size:.72rem}.hero-stat-card .val{color:var(--accent);margin-top:2px;font-size:1.15rem;font-weight:800}.stat-category-group{margin-bottom:1rem}.stat-group-heading{text-transform:uppercase;letter-spacing:.05em;color:var(--silver);border-bottom:1px solid #ffffff0f;align-items:center;gap:.4rem;margin-bottom:.4rem;padding-bottom:.25rem;font-size:.8rem;font-weight:700;display:flex}.stat-row-item{border-bottom:1px solid #ffffff08;flex-direction:column;padding:.35rem .2rem;font-size:.82rem;display:flex}.stat-row-item:last-child{border-bottom:none}.stat-primary-line{justify-content:space-between;align-items:center;display:flex}.stat-name-label{color:var(--text);font-weight:500}.stat-total-number{color:var(--silver);font-weight:700}.stat-breakdown-sub{color:var(--text-muted);margin-top:1px;font-size:.7rem;line-height:1.2}.stat-audit-note{color:var(--text-muted);border-top:1px solid #ffffff0f;margin-top:.85rem;padding-top:.65rem;font-size:.75rem;font-style:italic}.picker-modal-backdrop{backdrop-filter:blur(4px);z-index:1000;background:#000000bf;justify-content:center;align-items:center;padding:1rem;display:none;position:fixed;inset:0}.picker-modal-backdrop.open{display:flex}.picker-modal-box{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);flex-direction:column;width:100%;max-width:680px;max-height:85vh;display:flex;overflow:hidden;box-shadow:0 16px 40px #0009}.picker-modal-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:1rem 1.25rem;display:flex}.picker-modal-header h3{color:var(--silver);margin:0;font-size:1.15rem}.picker-btn-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;min-height:44px;padding:.25rem .5rem;font-size:1.5rem}.picker-btn-close:hover{color:#fff}.picker-filter-bar{background:var(--bg);border-bottom:1px solid var(--border);flex-direction:column;gap:.5rem;padding:.75rem 1.25rem;display:flex}.picker-search-input{background:var(--panel);border:1px solid var(--border);width:100%;min-height:44px;color:var(--text);border-radius:var(--radius-sm);padding:.5rem .75rem;font-size:.9rem}.picker-search-input:focus{border-color:var(--accent);outline:none}.picker-grade-chips{flex-wrap:wrap;gap:.35rem;display:flex}.grade-chip{border:1px solid var(--border);background:var(--panel);min-height:36px;color:var(--text-muted);cursor:pointer;border-radius:4px;padding:.3rem .65rem;font-size:.75rem;font-weight:600}.grade-chip.active{border-color:var(--accent);color:var(--accent);background:#50cdfc26}.picker-items-list{flex-direction:column;flex:1;gap:.5rem;padding:.75rem 1.25rem;display:flex;overflow-y:auto}.picker-item-row{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;justify-content:space-between;align-items:center;gap:.75rem;min-height:52px;padding:.5rem .75rem;transition:all .15s;display:flex}.picker-item-row:hover{border-color:var(--accent);background:#50cdfc0f}.picker-item-left{flex:1;align-items:center;gap:.75rem;min-width:0;display:flex}.picker-item-details{flex:1;min-width:0}.picker-item-name{white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:.9rem;font-weight:700;overflow:hidden}.picker-item-sub{color:var(--text-muted);margin-top:1px;font-size:.75rem}.picker-item-stats-preview{color:var(--silver);text-align:right;white-space:nowrap;font-size:.75rem}.planner-toast{background:var(--panel);border:1px solid var(--accent);color:#fff;border-radius:var(--radius-sm);z-index:2000;padding:.75rem 1.25rem;font-size:.88rem;font-weight:600;animation:.2s fadeIn;display:none;position:fixed;bottom:2rem;right:2rem;box-shadow:0 8px 24px #00000080}.planner-toast.show{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (width<=1100px){.planner-workspace{grid-template-columns:300px 1fr 300px;gap:1rem}}@media (width<=960px){.planner-workspace{grid-template-columns:minmax(0,1fr);width:100%;max-width:100%}.planner-panel{width:100%;min-width:0;max-width:100%;padding:.75rem}.planner-mobile-tabs{display:grid}.mobile-hide{display:none!important}}@media (width<=480px){.planner-header{padding:.75rem .5rem}.planner-heading h1{font-size:1.3rem}.class-picker-group{gap:.25rem}.class-btn{padding:.25rem .45rem;font-size:.78rem}.gear-slot-card{gap:.5rem;padding:.35rem .45rem}.hero-stat-card .val{font-size:1rem}}.faction-picker-group{align-items:center;gap:.5rem;display:flex}.faction-picker-group .control-label{color:var(--text-muted);font-size:.8rem;font-weight:600}.faction-toggle-pills{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);gap:2px;padding:2px;display:flex}.faction-pill{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:3px;padding:4px 10px;font-size:.8rem;font-weight:600;transition:all .15s}.faction-pill:hover{color:var(--text);background:#ffffff0a}.faction-pill.active{background:var(--surface);color:#fff;border:1px solid var(--border-hover,var(--border))}.faction-pill[data-faction=elyos].active{color:#38bdf8;border-color:#38bdf880}.faction-pill[data-faction=asmodian].active{color:#c084fc;border-color:#c084fc80}.picker-faction-chips{flex-wrap:wrap;gap:.35rem;margin-top:.35rem;display:flex}.faction-chip{background:var(--bg);border:1px solid var(--border);color:var(--text-muted);cursor:pointer;border-radius:3px;padding:2px 8px;font-size:.75rem;font-weight:600}.faction-chip:hover{color:var(--text)}.faction-chip.active{background:var(--surface);color:#fff;border-color:var(--accent)}.picker-race-tag{vertical-align:middle;border-radius:3px;margin-left:6px;padding:1px 6px;font-size:.7rem;font-weight:700;display:inline-block}.picker-race-tag.race-elyos{color:#38bdf8;background:#38bdf826;border:1px solid #38bdf84d}.picker-race-tag.race-asmodian{color:#c084fc;background:#c084fc26;border:1px solid #c084fc4d}.substats-box{background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:.75rem}.substat-row{align-items:center;gap:.5rem;margin-top:.5rem;display:flex}.substat-select{background:var(--surface);border:1px solid var(--border);color:var(--text);border-radius:4px;flex:1;padding:.35rem .5rem;font-size:.8rem}.substat-input{background:var(--surface);border:1px solid var(--border);width:70px;color:var(--text);text-align:center;border-radius:4px;padding:.35rem;font-size:.8rem}.btn-planner-mini{background:var(--surface);border:1px solid var(--border);color:var(--silver);cursor:pointer;border-radius:4px;padding:.25rem .5rem;font-size:.75rem;font-weight:600;transition:all .15s}.btn-planner-mini:hover{background:var(--panel);color:var(--text);border-color:var(--accent)}.dice-btn{background:var(--surface);border:1px solid var(--border);color:var(--silver);cursor:pointer;border-radius:4px;padding:.3rem .5rem;font-size:.85rem}.dice-btn:hover{background:var(--panel);border-color:var(--accent)}.pets-genus-container,.monoliths-container{flex-direction:column;gap:1.25rem;display:flex}.pets-header-box{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:1rem}.pet-display-card{background:var(--bg);border:1px solid var(--border);border-radius:6px;align-items:center;gap:1rem;margin-top:.75rem;padding:.75rem;display:flex}.genus-grid,.monoliths-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:.75rem;display:grid}.genus-card,.monolith-card{background:var(--panel);border:1px solid var(--border);border-radius:6px;flex-direction:column;gap:.5rem;padding:.75rem;display:flex}.genus-card-header,.monolith-card-header{justify-content:space-between;align-items:center;display:flex}.genus-card-title,.monolith-card-title{color:var(--text);font-size:.9rem;font-weight:700}.genus-level-badge,.monolith-level-badge{color:var(--accent);background:#50cdfc1a;border-radius:4px;padding:1px 6px;font-size:.75rem;font-weight:700}.genus-stat-summary,.monolith-stat-summary{color:var(--silver);min-height:2.2rem;font-size:.75rem;line-height:1.35}.compare-mode-tabs{border-bottom:1px solid var(--border);gap:.5rem;margin-bottom:1.25rem;padding-bottom:.75rem;display:flex}.compare-mode-btn{background:var(--panel);border:1px solid var(--border);color:var(--silver);cursor:pointer;border-radius:6px;padding:.5rem 1rem;font-size:.85rem;font-weight:600;transition:all .15s}.compare-mode-btn:hover{background:var(--surface);color:var(--text)}.compare-mode-btn.active{background:var(--surface);color:#fff;border-color:var(--accent)}.compare-overview-cards{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.75rem;margin-bottom:1.5rem;display:grid}.compare-stat-chip{background:var(--panel);border:1px solid var(--border);text-align:center;border-radius:6px;padding:.75rem}.compare-stat-chip .chip-label{color:var(--text-muted);text-transform:uppercase;margin-bottom:.25rem;font-size:.75rem}.compare-stat-chip .chip-values{justify-content:center;align-items:center;gap:.5rem;font-size:.95rem;font-weight:700;display:flex}.delta-badge{border-radius:3px;padding:1px 5px;font-size:.75rem;font-weight:700}.delta-pos{color:#22c55e;background:#22c55e1a}.delta-neg{color:#ef4444;background:#ef44441a}.delta-zero{color:var(--text-muted);background:#8ea9bd1a}.compare-slots-table{border-collapse:collapse;width:100%;font-size:.85rem}.compare-slots-table th{text-align:left;border-bottom:2px solid var(--border);color:var(--silver);padding:.6rem .5rem}.compare-slots-table td{border-bottom:1px solid var(--border);vertical-align:middle;padding:.6rem .5rem}
