:root{--poe-bg-dark: #0c0c0e;--poe-bg-panel: #131318;--poe-bg-card: #1a1a1f;--poe-bg-hover: #252530;--poe-border: #2a2a35;--poe-border-light: #3a3a45;--poe-gold: #af6025;--poe-gold-light: #d4a84b;--poe-gold-dim: #8b4d1d;--poe-text: #c8c8c8;--poe-text-bright: #e8e8e8;--poe-text-dim: #7f7f7f;--poe-text-muted: #5a5a5a;--poe-str: #c51e1e;--poe-str-bg: rgba(197, 30, 30, .15);--poe-dex: #1ec51e;--poe-dex-bg: rgba(30, 197, 30, .15);--poe-int: #4169e1;--poe-int-bg: rgba(65, 105, 225, .15);--poe-success: #38b000;--poe-warning: #ffbe0b;--poe-error: #d00000;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--transition-fast: .15s ease;--transition-normal: .25s ease;--font-main: "Rajdhani", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%}body{font-family:var(--font-main);background:var(--poe-bg-dark);color:var(--poe-text);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--poe-bg-panel)}::-webkit-scrollbar-thumb{background:var(--poe-border-light);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--poe-gold-dim)}:focus-visible{outline:2px solid var(--poe-gold);outline-offset:2px}::selection{background:var(--poe-gold);color:var(--poe-bg-dark)}.text-gold{color:var(--poe-gold-light)}.text-dim{color:var(--poe-text-dim)}.text-muted{color:var(--poe-text-muted)}.text-str{color:var(--poe-str)}.text-dex{color:var(--poe-dex)}.text-int{color:var(--poe-int)}button{font-family:inherit;font-size:inherit;cursor:pointer;border:none;background:none;color:inherit}input,select{font-family:inherit;font-size:inherit;background:var(--poe-bg-card);border:1px solid var(--poe-border);color:var(--poe-text);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-sm);transition:border-color var(--transition-fast)}input:focus,select:focus{border-color:var(--poe-gold);outline:none}input::placeholder{color:var(--poe-text-muted)}a{color:var(--poe-gold-light);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--poe-gold)}.panel{background:var(--poe-bg-panel);border:1px solid var(--poe-border);border-radius:var(--radius-md)}.card{background:var(--poe-bg-card);border:1px solid var(--poe-border);border-radius:var(--radius-sm);padding:var(--spacing-md);transition:border-color var(--transition-fast),background var(--transition-fast)}.card:hover{border-color:var(--poe-border-light);background:var(--poe-bg-hover)}.badge{display:inline-flex;align-items:center;padding:2px 8px;font-size:.75rem;font-weight:500;border-radius:var(--radius-sm);text-transform:uppercase;letter-spacing:.5px}.badge-str{background:var(--poe-str-bg);color:var(--poe-str);border:1px solid var(--poe-str)}.badge-dex{background:var(--poe-dex-bg);color:var(--poe-dex);border:1px solid var(--poe-dex)}.badge-int{background:var(--poe-int-bg);color:var(--poe-int);border:1px solid var(--poe-int)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-sm);font-weight:500;transition:all var(--transition-fast)}.btn-primary{background:var(--poe-gold);color:var(--poe-bg-dark)}.btn-primary:hover{background:var(--poe-gold-light)}.btn-secondary{background:var(--poe-bg-card);border:1px solid var(--poe-border);color:var(--poe-text)}.btn-secondary:hover{border-color:var(--poe-gold);color:var(--poe-gold-light)}.btn-ghost{background:transparent;color:var(--poe-text-dim)}.btn-ghost:hover{color:var(--poe-text);background:var(--poe-bg-hover)}@media(max-width:768px){:root{--spacing-md: 12px;--spacing-lg: 16px;--spacing-xl: 24px}}.loading-spinner{display:flex;justify-content:center;align-items:center;padding:2rem;color:var(--poe-gold);font-size:1.2rem}.app{display:flex;flex-direction:column;height:100vh;overflow:hidden}.tab-nav{display:flex;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-lg);background:var(--poe-bg-panel);border-bottom:1px solid var(--poe-border)}.tab-btn{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);color:var(--poe-text-dim);border-radius:var(--radius-sm);font-weight:500;transition:all var(--transition-fast)}.tab-btn:hover{color:var(--poe-text);background:var(--poe-bg-hover)}.tab-btn.active{color:var(--poe-gold-light);background:var(--poe-bg-card)}.tab-badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;font-size:.75rem;font-weight:600;background:var(--poe-gold);color:var(--poe-bg-dark);border-radius:10px}.main-content{flex:1;overflow:auto;padding:var(--spacing-lg)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-xl);text-align:center;color:var(--poe-text-dim)}.empty-state h3{margin-bottom:var(--spacing-sm);color:var(--poe-text)}.empty-state p{max-width:400px}@media(max-width:768px){.tab-nav{padding:var(--spacing-sm);overflow-x:auto}.tab-btn{white-space:nowrap;font-size:.875rem}.main-content{padding:var(--spacing-md)}}.header{display:flex;flex-direction:column;padding:var(--spacing-sm) var(--spacing-md);background:var(--poe-bg-panel);border-bottom:1px solid var(--poe-border);position:sticky;top:0;z-index:50;gap:var(--spacing-xs)}.header-top{display:flex;justify-content:center;align-items:center}.header-title{font-size:1.1rem;font-weight:700;color:var(--poe-gold);display:flex;align-items:center;gap:var(--spacing-sm);margin:0}.title-icon-img{width:24px;height:24px;object-fit:contain}.header-nav{display:flex;justify-content:center;gap:var(--spacing-xs)}.nav-tab{padding:var(--spacing-xs) var(--spacing-sm);font-size:.8rem;font-weight:500;color:var(--poe-text-dim);border-radius:var(--radius-sm);transition:all var(--transition-fast);background:transparent;border:1px solid transparent;white-space:nowrap}.nav-tab:hover{color:var(--poe-text);background:var(--poe-bg-hover)}.nav-tab.active{color:var(--poe-gold-light);background:var(--poe-bg-card);border-color:var(--poe-border)}@media(min-width:768px){.header{position:relative;flex-direction:row;justify-content:flex-start;align-items:center;padding:var(--spacing-sm) var(--spacing-lg)}.header-top{justify-content:flex-start;flex:0 0 auto;z-index:1}.header-nav{position:absolute;left:50%;transform:translate(-50%);justify-content:center}.header-title{font-size:1.25rem}.title-icon-img{width:28px;height:28px}.nav-tab{padding:var(--spacing-xs) var(--spacing-md);font-size:.875rem}}.gem-card{display:flex;flex-direction:column;padding:var(--spacing-sm) var(--spacing-md);background:var(--poe-bg-card);border:1px solid var(--poe-border);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none}.gem-card:hover{border-color:var(--poe-border-light);background:var(--poe-bg-hover)}.gem-card.selected{border-color:var(--poe-gold);background:#af60251a}.gem-card.attr-str{border-left:3px solid var(--poe-str)}.gem-card.attr-dex{border-left:3px solid var(--poe-dex)}.gem-card.attr-int{border-left:3px solid var(--poe-int)}.gem-card.attr-none{border-left:3px solid var(--poe-text-dim)}.gem-card-header{display:flex;align-items:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-sm)}.gem-checkbox{width:18px;height:18px;display:flex;align-items:center;justify-content:center;border:1px solid var(--poe-border-light);border-radius:3px;font-size:.75rem;color:var(--poe-gold);flex-shrink:0}.gem-card.selected .gem-checkbox{background:var(--poe-gold);border-color:var(--poe-gold);color:var(--poe-bg-dark)}.gem-name{font-size:.875rem;font-weight:500;color:var(--poe-text-bright);line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gem-card-body{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-sm)}.gem-info{display:flex;align-items:center;gap:var(--spacing-sm)}.gem-level{font-size:.75rem;color:var(--poe-text-dim)}.gem-attrs{display:flex;gap:3px}.attr-dot{width:8px;height:8px;border-radius:50%}.attr-dot.attr-str{background:var(--poe-str)}.attr-dot.attr-dex{background:var(--poe-dex)}.attr-dot.attr-int{background:var(--poe-int)}.gem-availability{display:flex;align-items:center;gap:var(--spacing-xs)}.avail-badge{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;font-size:.625rem;font-weight:700;border-radius:3px}.avail-badge.quest{background:var(--poe-gold-dim);color:var(--poe-gold-light)}.avail-badge.vendor{background:#6464644d;color:var(--poe-text-dim)}.avail-badge.special{background:var(--poe-int-bg);color:var(--poe-int)}.avail-badge.unavailable{background:transparent;color:var(--poe-text-muted)}.earliest-act{font-size:.625rem;color:var(--poe-text-dim);padding:2px 4px;background:var(--poe-bg-dark);border-radius:2px}.class-dropdown{position:relative;width:100%}.class-dropdown-trigger{display:flex;align-items:center;justify-content:space-between;width:100%;padding:8px 12px;background:var(--poe-bg-input);border:1px solid var(--poe-border);border-radius:var(--radius-sm);color:var(--poe-text-dim);font-size:.875rem;cursor:pointer;transition:all var(--transition-fast)}.class-dropdown-trigger:hover{border-color:var(--poe-gold-dim)}.class-dropdown-trigger.has-selection{color:var(--poe-gold);border-color:var(--poe-gold-dim)}.dropdown-label{flex:1;text-align:left}.dropdown-arrow{transition:transform var(--transition-fast);opacity:.6}.dropdown-arrow.open{transform:rotate(180deg)}.class-dropdown-menu{position:absolute;top:100%;left:0;right:0;margin-top:4px;background:var(--poe-bg-card);border:1px solid var(--poe-border);border-radius:var(--radius-sm);box-shadow:0 4px 12px #0006;z-index:100;max-height:240px;overflow-y:auto}.class-dropdown-item{display:block;width:100%;padding:8px 12px;text-align:left;font-size:.875rem;color:var(--poe-text);background:transparent;border:none;cursor:pointer;transition:background var(--transition-fast)}.class-dropdown-item:hover{background:var(--poe-bg-hover)}.class-dropdown-item.selected{color:var(--poe-gold);background:#d4af371a}.class-dropdown-item:first-child{border-bottom:1px solid var(--poe-border);color:var(--poe-text-dim)}.gem-browser{display:grid;grid-template-columns:280px 1fr;gap:var(--spacing-xl);height:100%}.browser-sidebar{display:flex;flex-direction:column;gap:var(--spacing-md);padding:var(--spacing-lg);background:var(--poe-bg-panel);border:1px solid var(--poe-border);border-radius:var(--radius-md);height:fit-content;position:sticky;top:0}.type-toggle{display:flex;background:var(--poe-bg-input);border:1px solid var(--poe-border);border-radius:var(--radius-sm);padding:2px}.type-btn{flex:1;padding:var(--spacing-xs) var(--spacing-sm);font-size:.875rem;font-weight:500;color:var(--poe-text-dim);border-radius:var(--radius-sm);transition:all var(--transition-fast)}.type-btn.active{background:var(--poe-bg-hover);color:var(--poe-gold)}.type-btn:hover:not(.active){color:var(--poe-text)}.class-selector-row{position:relative}.search-box{position:relative;width:100%}.search-input{width:100%;padding-right:32px}.search-clear{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;color:var(--poe-text-dim);border-radius:50%}.search-clear:hover{color:var(--poe-text);background:var(--poe-bg-hover)}.clear-gems-btn{padding:4px 10px;font-size:.75rem;color:var(--poe-text-dim);background:var(--poe-bg-dark);border:1px solid var(--poe-border);border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;align-self:flex-start}.clear-gems-btn:hover{color:var(--poe-text);border-color:var(--poe-gold-dim)}.filter-section{display:flex;flex-direction:column;gap:var(--spacing-sm)}.filter-title{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--poe-text-dim)}.filter-chips{display:flex;gap:var(--spacing-xs)}.filter-chip{padding:var(--spacing-xs) var(--spacing-sm);font-size:.75rem;font-weight:600;border-radius:var(--radius-sm);border:1px solid var(--poe-border);color:var(--poe-text-dim);transition:all var(--transition-fast)}.filter-chip:hover{border-color:var(--poe-text-dim)}.filter-chip.active.filter-str{background:#c832324d;border-color:var(--poe-str);color:var(--poe-str)}.filter-chip.active.filter-dex{background:#32c8324d;border-color:var(--poe-dex);color:var(--poe-dex)}.filter-chip.active.filter-int{background:#3232c84d;border-color:var(--poe-int);color:var(--poe-int)}.level-inputs{display:flex;align-items:center;gap:var(--spacing-sm)}.level-input{width:80px;text-align:center;appearance:textfield;-moz-appearance:textfield}.level-input::-webkit-outer-spin-button,.level-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.level-separator{color:var(--poe-text-dim)}.show-selected-row{flex-direction:row;align-items:center;justify-content:space-between}.checkbox-label{display:flex;align-items:center;gap:var(--spacing-sm);font-size:.875rem;color:var(--poe-text);cursor:pointer}.selected-count{font-size:.75rem;color:var(--poe-gold);font-weight:500}.browser-main{min-height:0}.gem-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--spacing-md)}.empty-state{text-align:center;padding:var(--spacing-xl);color:var(--poe-text-dim)}.empty-state h3{color:var(--poe-text);margin-bottom:var(--spacing-sm)}.mobile-sticky-controls{display:none}.desktop-controls{display:flex;flex-direction:column;gap:var(--spacing-md);padding-bottom:var(--spacing-md);border-bottom:1px solid var(--poe-border);margin-bottom:var(--spacing-md)}@media(max-width:768px){.gem-browser{display:block;height:auto}.desktop-controls{display:none;padding:var(--spacing-md)}.search-input{max-width:100%}.mobile-sticky-controls{display:flex;flex-direction:column;gap:var(--spacing-sm);position:sticky;top:calc(var(--spacing-md) * -1);z-index:100;background:var(--poe-bg-dark);padding:var(--spacing-md) var(--spacing-sm) var(--spacing-sm) var(--spacing-sm);margin:calc(var(--spacing-md) * -1);margin-bottom:var(--spacing-md);border-bottom:1px solid var(--poe-border)}.browser-sidebar{position:static;background:transparent;padding:0;padding-bottom:var(--spacing-lg);border:none}.filter-section{flex-direction:row;align-items:center;flex-wrap:wrap;gap:var(--spacing-sm)}.filter-chips{flex:1}.level-inputs{flex:1;justify-content:flex-end}.show-selected-row{flex-wrap:nowrap}.gem-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:var(--spacing-sm)}}