:root{--bg: #16110c;--panel: #211a12;--panel-raised: #2a2118;--border: #3d3020;--text: #eadfc8;--muted: #a08d72;--faint: #6e5f4b;--accent: #d9a441;--accent-dim: #8a6a2e;--tier-top: #e8d9a0;--tier-middle: #d9a441;--tier-base: #a06a3a}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100vh}body{background:radial-gradient(1200px 500px at 20% -10%,#2b2013 0%,transparent 60%),var(--bg);color:var(--text);font-family:Segoe UI,system-ui,sans-serif;font-size:15px;line-height:1.5}h1,h2,h3,h4{font-family:Georgia,Times New Roman,serif;font-weight:500;margin:0}.app{max-width:1200px;margin:0 auto;padding:24px 20px 60px}.app-header{margin-bottom:18px}.app-header h1{font-size:42px;letter-spacing:.5px;color:var(--accent)}.app-header .tagline{margin:2px 0 0;color:var(--muted);font-style:italic}.layout{display:grid;grid-template-columns:minmax(0,11fr) minmax(0,9fr);grid-template-areas:"picker pyramid" "diagram diagram" "results results";gap:18px;align-items:start}.area-picker{grid-area:picker;min-width:0}.area-pyramid{grid-area:pyramid;min-width:0}.area-diagram{grid-area:diagram;min-width:0}.area-results{grid-area:results;min-width:0}.card{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:16px}.card-title-row{display:flex;align-items:baseline;gap:10px;margin-bottom:10px}.card-title-row h2{font-size:19px;color:var(--accent)}.count{color:var(--muted);font-size:13px}.text-btn{margin-left:auto;background:none;border:none;color:var(--muted);cursor:pointer;font-size:13px;text-decoration:underline}.text-btn:hover{color:var(--text)}.hint{color:var(--faint);font-style:italic;margin:6px 0}.picker-controls{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}.search{background:var(--panel-raised);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:9px 12px;font-size:14px;outline:none}.search:focus{border-color:var(--accent-dim)}.family-chips{display:flex;flex-wrap:wrap;gap:6px}.chip{display:inline-flex;align-items:center;gap:6px;background:var(--panel-raised);border:1px solid var(--border);border-radius:999px;color:var(--muted);cursor:pointer;font-size:12px;padding:4px 10px}.chip .dot{width:8px;height:8px;border-radius:50%;background:var(--family-color, var(--faint));display:inline-block}.chip:hover{color:var(--text)}.chip-active{border-color:var(--accent-dim);color:var(--text);background:#332816}.note-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}.note-card{position:relative;background:var(--panel-raised);border:1px solid var(--border);border-left:3px solid var(--family-color, var(--border));border-radius:8px;cursor:pointer;padding:8px 22px 8px 10px;display:flex;flex-direction:column;gap:3px;transition:border-color .15s,background .15s}.note-card:hover{background:#332918}.note-card-selected{border-color:var(--accent-dim);background:#332816}.note-card-disabled{opacity:.45;cursor:not-allowed}.note-name{font-size:13.5px;line-height:1.25}.info-btn{position:absolute;top:4px;right:5px;width:16px;height:16px;border-radius:50%;border:1px solid var(--border);background:none;color:var(--muted);cursor:pointer;font-size:10px;line-height:1;padding:0}.info-btn:hover{color:var(--accent);border-color:var(--accent-dim)}.selected-mark{position:absolute;bottom:4px;right:6px;color:var(--accent);font-size:12px}.tier-badge{display:inline-block;font-size:10.5px;letter-spacing:.4px;border-radius:4px;padding:1px 6px;border:1px solid var(--border);color:var(--muted)}.tier-top{color:var(--tier-top);border-color:color-mix(in srgb,var(--tier-top) 40%,transparent)}.tier-middle{color:var(--tier-middle);border-color:color-mix(in srgb,var(--tier-middle) 40%,transparent)}.tier-base{color:var(--tier-base);border-color:color-mix(in srgb,var(--tier-base) 45%,transparent)}.results-title{font-size:19px;color:var(--accent);margin-bottom:12px}.descriptors{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}.descriptor-wrap{position:relative}.tooltip{position:absolute;bottom:calc(100% + 6px);left:8px;z-index:30;width:260px;background:#120d08;border:1px solid var(--accent-dim);border-radius:8px;padding:10px 12px;color:var(--text);box-shadow:0 8px 24px #0000008c;pointer-events:none}.tooltip strong{color:var(--accent);font-size:13px}.tooltip p{margin:4px 0;font-size:12.5px;color:var(--text)}.tooltip em{font-size:11px;color:var(--faint)}.descriptor{width:100%;display:grid;grid-template-columns:110px 1fr 34px;align-items:center;gap:10px;background:var(--panel-raised);border:1px solid var(--border);border-radius:8px;color:var(--text);cursor:pointer;padding:7px 12px;font-size:14px;text-align:left}.descriptor:hover{border-color:var(--accent-dim)}.descriptor-word{font-family:Georgia,serif;font-size:15px;color:var(--accent)}.descriptor-bar{height:5px;background:#17110b;border-radius:3px;overflow:hidden}.descriptor-fill{display:block;height:100%;background:linear-gradient(90deg,var(--accent-dim),var(--accent));border-radius:3px}.descriptor-pct{font-size:11.5px;color:var(--muted);text-align:right}.block{margin-top:14px}.block h3{font-size:13px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-bottom:8px}.contrast-list{display:flex;flex-wrap:wrap;gap:8px}.contrast-chip{background:#2e2314;border:1px dashed var(--accent-dim);border-radius:999px;color:var(--text);cursor:pointer;font-size:13px;padding:5px 12px;display:inline-flex;align-items:center;gap:8px}.contrast-pcts{color:var(--faint);font-size:11px}.interactions{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:5px}.interactions li{font-size:13.5px;color:var(--text)}.inline-facet{background:none;border:none;color:var(--accent);cursor:pointer;font-size:13.5px;text-decoration:underline dotted;padding:0;font-family:inherit}.narrative{font-family:Georgia,serif;font-size:16.5px;line-height:1.65;color:var(--text);margin:0;border-left:3px solid var(--accent-dim);padding-left:14px;font-style:italic}.pyramid-hint{margin:-4px 0 10px}.tiers{display:flex;flex-direction:column;gap:6px}.tier{background:var(--panel-raised);border:1px solid var(--border);border-radius:8px;padding:9px 12px;min-height:56px;transition:border-color .15s,background .15s}.tier-dragover{border:1px dashed var(--accent);background:#d9a44114}.tier-top{width:72%;margin:0 auto}.tier-middle{width:86%;margin:0 auto}.tier-base{width:100%}.tier-label{display:flex;align-items:baseline;gap:8px;margin-bottom:5px}.tier-name{font-family:Georgia,serif;font-size:14px;text-transform:uppercase;letter-spacing:1.5px}.tier-top .tier-name{color:var(--tier-top)}.tier-middle .tier-name{color:var(--tier-middle)}.tier-base .tier-name{color:var(--tier-base)}.tier-sub{font-size:11px;color:var(--faint)}.tier-notes{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:5px;min-height:26px}.tier-note{display:inline-flex;align-items:center;gap:5px;font-size:12px;background:#17110b;border:1px solid var(--border);border-left:3px solid var(--family-color, var(--border));border-radius:5px;padding:3px 6px 3px 8px;cursor:grab}.tier-note:active{cursor:grabbing}.tier-note-name{pointer-events:none}.tier-note-x{background:none;border:none;color:var(--muted);cursor:pointer;font-size:13px;line-height:1;padding:0 2px}.tier-note-x:hover{color:#e26d5a}.tier-empty-hint{color:var(--faint);font-size:12px;font-style:italic;padding:3px 0}.tier-facets{display:flex;flex-wrap:wrap;gap:4px}.tier-facet{font-size:11px;color:var(--muted);background:none;border:none}.tier-facet:after{content:"·";margin-left:4px;color:var(--faint)}.tier-facet:last-child:after{content:""}.dg-tree{display:flex;flex-direction:column;align-items:center;margin-top:10px}.dg-root,.dg-final{border:1px solid var(--accent-dim);background:#332816;border-radius:999px;padding:6px 18px;font-family:Georgia,serif;letter-spacing:1.5px;text-transform:uppercase;font-size:12px;color:var(--accent);text-align:center}.dg-final{display:flex;flex-direction:column;gap:2px;border-color:var(--accent);background:linear-gradient(180deg,#3a2d17,#332816);padding:8px 22px}.dg-final-label{font-size:10px;color:var(--muted)}.dg-final-effect{color:var(--text);text-transform:none;letter-spacing:.3px;font-style:italic;font-size:15px}.dg-trunk{width:2px;height:22px;background:var(--border)}.dg-branches{position:relative;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:14px;padding-top:22px;width:100%;max-width:860px}.dg-branches:before{content:"";position:absolute;top:0;left:var(--rail-inset, 12%);right:var(--rail-inset, 12%);height:2px;background:var(--border)}.dg-branch{position:relative;padding-top:22px;display:flex;flex-direction:column;gap:8px}.dg-branch:before{content:"";position:absolute;top:-22px;left:50%;width:2px;height:22px;background:var(--border)}.dg-facet{display:flex;justify-content:space-between;align-items:center;background:var(--panel-raised);border:1px solid var(--border);border-top:2px solid var(--accent-dim);border-radius:8px;padding:6px 10px}.dg-facet-name{font-family:Georgia,serif;color:var(--accent);font-size:14px}.dg-facet-pct{font-size:11px;color:var(--muted)}.dg-notes{display:flex;flex-direction:column;gap:5px}.dg-note{font-size:12px;background:#17110b;border:1px solid var(--border);border-radius:5px;padding:3px 8px;color:var(--text);text-align:center}.overlay{position:fixed;inset:0;background:#080502a8;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:100;display:flex;align-items:flex-start;justify-content:center;padding:8vh 16px 16px}.modal{position:relative;width:min(560px,100%);background:var(--panel);border:1px solid var(--accent-dim);border-radius:12px;padding:22px 24px;box-shadow:0 18px 60px #0009;max-height:80vh;overflow-y:auto}.modal-close{position:absolute;top:10px;right:12px;background:none;border:none;color:var(--muted);font-size:22px;cursor:pointer;line-height:1}.modal-close:hover{color:var(--text)}.modal-title{font-size:26px;color:var(--accent)}.modal-summary{color:var(--text);font-style:italic;margin:6px 0 14px}.modal-definition{color:var(--muted);margin:0 0 14px}.modal-block h4{font-size:12px;text-transform:uppercase;letter-spacing:1.2px;color:var(--muted);margin-bottom:5px}.modal-block p{margin:0 0 14px;color:var(--text)}.typical-notes{display:flex;flex-wrap:wrap;gap:6px}.typical-note{font-size:12px;border:1px solid var(--border);border-radius:999px;padding:3px 10px;color:var(--muted)}.drawer-overlay{justify-content:flex-end;padding:0;align-items:stretch}.drawer{position:relative;width:min(380px,100%);height:100%;background:var(--panel);border-left:1px solid var(--accent-dim);padding:24px 22px;overflow-y:auto}.drawer-name{font-size:26px;color:var(--accent);margin-bottom:8px;padding-right:24px}.drawer-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}.drawer-family{font-size:12.5px;text-transform:uppercase;letter-spacing:.8px}.drawer-vol{font-size:12px;color:var(--faint)}.drawer-blurb{color:var(--muted);font-style:italic}.drawer-subhead{font-size:12px;text-transform:uppercase;letter-spacing:1.2px;color:var(--muted);margin:18px 0 8px}.drawer-facets{display:flex;flex-direction:column;gap:5px;margin-bottom:18px}.drawer-facet{display:grid;grid-template-columns:92px 1fr 34px;align-items:center;gap:8px;background:var(--panel-raised);border:1px solid var(--border);border-radius:7px;color:var(--text);cursor:pointer;padding:6px 10px;font-size:13px;text-align:left}.drawer-facet:hover{border-color:var(--accent-dim)}.drawer-facet-name{color:var(--accent);font-family:Georgia,serif;font-size:13.5px}.drawer-toggle{width:100%;border-radius:8px;border:1px solid var(--accent-dim);background:#332816;color:var(--accent);cursor:pointer;font-size:14px;padding:10px}.drawer-toggle:hover{background:#3d2f18}.drawer-toggle.in-blend{background:none;color:var(--muted);border-color:var(--border)}@media(max-width:900px){.layout{grid-template-columns:1fr;grid-template-areas:"picker" "pyramid" "diagram" "results"}.tier-top,.tier-middle{width:100%}.dg-branches{grid-auto-flow:row;grid-template-columns:1fr 1fr}.dg-branches:before,.dg-branch:before{display:none}.dg-branches,.dg-branch{padding-top:0}}