:root{--bg0: #12141a;--bg1: #1a1e28;--bg2: #232836;--stroke: #343b4d;--text: #e8eaf0;--muted: #9aa3b5;--faint: #6b7385;--accent: #d4a24c;--accent-dim: #a67b2f;--near: #6fbf8a;--far: #c97b7b;--front: var(--near);--back: var(--far);--socket: #7eb6ff;--focus: #7eb6ff;--danger: #e07070;--radius: 10px;--font: "DM Sans", system-ui, sans-serif;--mono: "IBM Plex Mono", ui-monospace, monospace}*,*:before,*:after{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;font-family:var(--font);color:var(--text);background:radial-gradient(1200px 600px at 10% -10%,#2a2430 0%,transparent 55%),radial-gradient(900px 500px at 90% 0%,#1c2838 0%,transparent 50%),var(--bg0);line-height:1.45;scrollbar-width:thin;scrollbar-color:#4a5568 var(--bg0)}*{scrollbar-width:thin;scrollbar-color:#4a5568 var(--bg0)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--bg0)}::-webkit-scrollbar-thumb{background:#3a4254;border-radius:999px;border:2px solid var(--bg0)}::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--focus) 45%,#3a4254)}button,input,select,textarea{font:inherit;color:inherit}a{color:var(--focus)}.app{max-width:1120px;margin:0 auto;padding:28px 20px 64px}.hero{display:grid;gap:14px;margin-bottom:20px}.hero-top{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 20px}.brand{font-size:clamp(2.4rem,5vw,3.4rem);font-weight:700;letter-spacing:-.03em;line-height:1.05;margin:0}.brand-btn{display:inline;margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;letter-spacing:inherit;line-height:inherit;cursor:pointer;text-align:left}.brand-btn:hover span{color:color-mix(in srgb,var(--accent) 80%,#fff)}.brand-btn:focus-visible{outline:2px solid color-mix(in srgb,var(--focus) 55%,transparent);outline-offset:4px;border-radius:4px}.brand span{color:var(--accent)}.paste-field textarea{min-height:200px}.tagline{margin:0;color:var(--muted);max-width:52ch;font-size:1.05rem}.tagline-aside{display:block;margin-top:.65em;color:var(--faint);font-size:.92em}.meta-row{display:flex;flex-wrap:wrap;gap:0;align-items:center;margin:0;color:var(--faint);font-size:.8rem}.meta-row span{display:inline-flex;align-items:center}.meta-row span:not(:last-child):after{content:"·";margin:0 .55em;color:color-mix(in srgb,var(--faint) 70%,transparent)}.layout{display:grid;grid-template-columns:minmax(280px,340px) 1fr;gap:20px;align-items:start;overflow:visible}.layout>aside{overflow:visible;position:relative;z-index:2}@media(max-width:860px){.layout{grid-template-columns:1fr}}.panel{background:color-mix(in srgb,var(--bg1) 92%,transparent);border:1px solid var(--stroke);border-radius:var(--radius);padding:16px;overflow:visible}.panel h2{margin:0 0 12px;font-size:.95rem;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--muted)}.setup-panel{display:grid;gap:0;padding:14px 14px 16px}.setup-head{display:grid;gap:4px;margin-bottom:12px}.setup-head h2{margin:0}.setup-legend{margin:0;font-size:.78rem;color:var(--faint);line-height:1.35}.setup-legend em{font-style:normal;font-weight:600}.setup-legend em.near{color:var(--near)}.setup-legend em.far{color:var(--far)}.setup-grid{display:grid;grid-template-columns:1.1fr .9fr .9fr;gap:8px}.setup-grid .field{margin-bottom:0;min-width:0}.setup-grid select{padding:7px 30px 7px 8px;font-size:.86rem;background-position:right 10px center}.setup-grid select:focus{background-position:right 10px center}.setup-section{margin-top:16px;padding-top:14px;border-top:1px solid color-mix(in srgb,var(--stroke) 85%,transparent);display:grid;gap:0}.setup-section h3{margin:0 0 10px;font-size:.72rem;font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-dim)}.setup-section .field{margin-bottom:10px}.setup-section .field:last-child{margin-bottom:0}.setup-foot{display:grid;gap:10px}.setup-share{width:100%}.field{display:grid;gap:6px;margin-bottom:12px}.field label{font-size:.85rem;color:var(--muted)}.field-hint{font-size:.75rem;color:var(--faint)}.field input,.field select,.field textarea{width:100%;background:var(--bg0);border:1px solid var(--stroke);border-radius:8px;padding:8px 10px;color:var(--text);transition:border-color .15s ease,box-shadow .15s ease,background-color .15s ease}.field select{-moz-appearance:none;appearance:none;-webkit-appearance:none;padding:8px 34px 8px 10px;background-color:var(--bg0);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1.5 1.75L6 6.25L10.5 1.75' stroke='%239aa3b5' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:12px 8px;cursor:pointer}.field input:hover,.field select:hover,.field textarea:hover{border-color:color-mix(in srgb,var(--focus) 35%,var(--stroke))}.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--focus);box-shadow:0 0 0 3px color-mix(in srgb,var(--focus) 28%,transparent);background-color:color-mix(in srgb,var(--focus) 8%,var(--bg0))}.field select:focus{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1.5 1.75L6 6.25L10.5 1.75' stroke='%7eb6ff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:12px 8px}.field textarea{min-height:120px;resize:vertical;font-family:var(--mono);font-size:.82rem}.checks{display:grid;gap:8px;margin:2px 0 10px}.checks label{display:flex;gap:8px;align-items:flex-start;font-size:.9rem;color:var(--text)}.btn-row{display:flex;flex-wrap:wrap;gap:8px}.btn,button.btn,a.btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--stroke);background:var(--bg2);border-radius:8px;padding:8px 12px;cursor:pointer;color:var(--text);text-decoration:none;font:inherit;line-height:1.2;box-sizing:border-box}.btn:hover,button.btn:hover,a.btn:hover{border-color:var(--accent-dim);color:var(--text)}.btn.primary,button.btn.primary,a.btn.primary{background:var(--accent);border-color:var(--accent);color:#1a1408;font-weight:600}.btn.ghost,button.btn.ghost,a.btn.ghost{background:transparent}.btn.blue,a.btn.blue{background:color-mix(in srgb,var(--focus) 28%,var(--bg2));border-color:color-mix(in srgb,var(--focus) 65%,var(--stroke));color:#dce9ff}.btn.blue:hover,a.btn.blue:hover{background:color-mix(in srgb,var(--focus) 40%,var(--bg2));border-color:var(--focus);color:#fff}.tabs{display:grid;grid-template-columns:1fr 1fr;gap:0;margin:2px 0 0;border:1px solid var(--stroke);border-radius:10px;overflow:hidden;background:var(--bg0)}.tabs button{border:0;border-radius:0;background:transparent;padding:11px 16px;cursor:pointer;color:var(--muted);font-weight:600;font-size:.95rem}.tabs button+button{border-left:1px solid var(--stroke)}.tabs button:hover{color:var(--text);background:color-mix(in srgb,var(--bg2) 55%,transparent)}.tabs button.active{background:var(--bg2);color:var(--accent);box-shadow:inset 0 -2px 0 var(--accent)}.results-head{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-bottom:12px;flex-wrap:wrap}.results-head h2{margin:0;font-size:1.25rem}.muted{color:var(--muted);font-size:.9rem}.callout{border:1px solid var(--stroke);background:var(--bg1);border-radius:var(--radius);padding:12px 14px;color:var(--muted)}.callout.warn{border-color:color-mix(in srgb,var(--danger) 50%,var(--stroke));color:var(--text)}.result-list{display:grid;gap:10px}.result-card{border:1px solid var(--stroke);background:var(--bg1);border-radius:var(--radius);padding:12px 14px;display:grid;gap:10px}.result-card header{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center}.result-card h3{margin:0;font-size:1rem;font-weight:600}.slots{display:grid;gap:8px;min-width:0}.slot{border:1px solid var(--stroke);border-radius:8px;padding:10px 12px;background:var(--bg0);display:grid;gap:6px}.slot.near,.slot.front{border-color:color-mix(in srgb,var(--near) 55%,var(--stroke))}.slot.far,.slot.back{border-color:color-mix(in srgb,var(--far) 55%,var(--stroke))}.slot-top{display:grid;gap:2px}.slot .role{font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;color:var(--faint)}.slot.near .role,.slot.front .role{color:var(--near)}.slot.far .role,.slot.back .role{color:var(--far)}.slot-stats{list-style:none;margin:0;padding:0;display:grid;gap:3px}.slot-stats li{font-size:.8rem;color:var(--muted);line-height:1.35}.slot-stats-empty{margin:0;font-size:.78rem}.position-hint{font-size:.82rem;color:var(--muted);margin:0 0 12px;line-height:1.4}.position-hint strong{color:var(--text)}.result-far{margin:4px 0 0;font-size:.85rem;color:var(--far)}.result-body{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}@media(max-width:720px){.result-body{grid-template-columns:1fr}}.jewel-wheel{display:grid;justify-items:center;gap:8px;min-width:240px}.jewel-wheel-stage{position:relative;line-height:0}.wheel-tip{position:absolute;z-index:2;transform:translate(-50%,calc(-100% - 14px));pointer-events:none;display:grid;gap:2px;min-width:0;max-width:180px;padding:6px 10px;border-radius:8px;background:var(--bg0);border:1px solid var(--stroke);box-shadow:0 8px 22px color-mix(in srgb,#000 45%,transparent);text-align:center;line-height:1.25}.wheel-tip.below{transform:translate(-50%,14px)}.wheel-tip.near{border-color:color-mix(in srgb,var(--near) 45%,var(--stroke))}.wheel-tip.far{border-color:color-mix(in srgb,var(--far) 45%,var(--stroke))}.wheel-tip-role{font-size:.65rem;text-transform:uppercase;letter-spacing:.04em;color:var(--faint);white-space:nowrap}.wheel-tip.near .wheel-tip-role{color:var(--near)}.wheel-tip.far .wheel-tip-role{color:var(--far)}.wheel-tip-name{font-size:.8rem;font-weight:600;color:var(--text);overflow-wrap:anywhere}.wheel-tip-stats{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:2px;text-align:left}.wheel-tip-stats li{font-size:.7rem;font-weight:400;color:var(--muted);line-height:1.3}.wheel-halo{fill:color-mix(in srgb,var(--bg2) 80%,transparent)}.wheel-ring{stroke:var(--stroke);stroke-width:2}.wheel-entry-line{stroke:var(--faint);stroke-width:1.5}.wheel-entry-box{fill:var(--bg0);stroke:var(--stroke)}.wheel-entry-label{fill:var(--muted);font-size:10px;font-family:var(--font);font-weight:600}.wheel-socket{fill:color-mix(in srgb,var(--socket) 25%,var(--bg0));stroke:var(--socket);stroke-width:1.5}.wheel-notable .wheel-node{stroke-width:2}.wheel-notable.near .wheel-node{fill:color-mix(in srgb,var(--near) 30%,var(--bg0));stroke:var(--near)}.wheel-notable.far .wheel-node{fill:color-mix(in srgb,var(--far) 30%,var(--bg0));stroke:var(--far)}.wheel-notable.highlight .wheel-node{stroke-width:3}.wheel-node-letter{fill:var(--text);font-size:9px;font-family:var(--mono);font-weight:600;pointer-events:none}.wheel-center-title{fill:var(--text);font-size:11px;font-family:var(--font);font-weight:600}.wheel-center-sub{fill:var(--faint);font-size:8px;font-family:var(--font)}.wheel-legend{display:flex;gap:10px;font-size:.72rem;color:var(--muted);justify-content:center}.wheel-legend .leg.near{color:var(--near)}.wheel-legend .leg.far{color:var(--far)}.wheel-legend .leg.sock{color:var(--socket)}.tagline em{font-style:normal;color:var(--accent);font-weight:600}.slot .name{font-weight:600;font-size:.95rem;line-height:1.25}.slot .meta{font-size:.68rem;text-transform:uppercase;letter-spacing:.04em;color:var(--faint)}.enchant-list{display:flex;flex-wrap:wrap;gap:6px}.enchant-list span{font-size:.78rem;color:var(--muted);border:1px solid var(--stroke);border-radius:999px;padding:2px 8px}.enchant-list span.enchant-primary{color:var(--text);border-color:color-mix(in srgb,var(--accent) 50%,var(--stroke))}.search-box{position:relative;z-index:1}.search-box.is-open{z-index:40}.search-menu{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:50;list-style:none;margin:0;padding:4px;max-height:240px;overflow:auto;border:1px solid var(--stroke);border-radius:8px;background:var(--bg0)}.search-menu li button{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;border:0;border-radius:6px;background:transparent;padding:8px 10px;cursor:pointer;color:var(--text)}.search-menu li button:hover{background:var(--bg2)}.search-option-title{font-size:.9rem;font-weight:500}.search-option-meta{font-size:.75rem;color:var(--faint);font-family:var(--mono)}.search-empty{padding:10px 12px;color:var(--faint);font-size:.85rem}.chip-list{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}.selected-chip{display:inline-flex;align-items:center;gap:8px;justify-self:start;margin-top:8px;padding:5px 6px 5px 10px;border-radius:8px;background:color-mix(in srgb,var(--near) 14%,var(--bg0));border:1px solid color-mix(in srgb,var(--near) 40%,var(--stroke));font-size:.86rem;font-weight:550;color:var(--text);max-width:100%}.chip-list .selected-chip{margin-top:0;background:color-mix(in srgb,var(--bg2) 85%,var(--bg0));border-color:var(--stroke);font-weight:500}.selected-chip-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.selected-chip-remove,.selected-chip button{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border:0;border-radius:6px;background:color-mix(in srgb,var(--bg0) 55%,transparent);cursor:pointer;color:var(--muted);padding:0;flex-shrink:0;font-size:1rem;line-height:1}.selected-chip-remove:hover,.selected-chip button:hover{color:var(--text);background:color-mix(in srgb,var(--danger) 35%,var(--bg0))}.multi-enchants{max-height:160px;overflow:auto;border:1px solid var(--stroke);border-radius:8px;padding:8px;background:var(--bg0);display:grid;gap:6px}.multi-enchants label{display:flex;gap:8px;font-size:.85rem}.diagram{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.8rem;color:var(--faint);flex-wrap:wrap}.diagram .node{padding:4px 8px;border-radius:6px;border:1px solid var(--stroke)}.diagram .node.front{color:var(--front);border-color:color-mix(in srgb,var(--front) 40%,var(--stroke))}.diagram .node.back{color:var(--back);border-color:color-mix(in srgb,var(--back) 40%,var(--stroke))}.footer-note{margin-top:24px;color:var(--faint);font-size:.8rem;text-align:center}