:root{--ground: #0a0e0c;--ground-2: #070a09;--surface: #121815;--hair: #25302a;--hair-soft: #1b241f;--ink: #dee4da;--ink-dim: #9aa69c;--ink-faint: #6e7a72;--brass: #c9a15c;--cold: #79b4c4;--warm: #d98a57;--oil-1: #b9ce5a;--oil-2: #e0c86a;--serif: "Songti TC", "Noto Serif TC", "Source Han Serif TC", Georgia, "Times New Roman", serif;--latin: "Cormorant Garamond", Georgia, serif;--sans: "PingFang TC", "Hiragino Sans TC", "Noto Sans TC", "Helvetica Neue", Arial, sans-serif;--mono: "IBM Plex Mono", "SF Mono", Menlo, monospace}*{box-sizing:border-box}[hidden]{display:none!important}html{min-width:0;background:var(--ground)}body{min-width:0;min-height:100vh;margin:0;overflow-x:hidden;background:var(--ground);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased}button{border:0;background:none;color:inherit;font:inherit;cursor:pointer}button:disabled{cursor:default}:focus-visible{outline:2px solid var(--brass);outline-offset:3px}#scent-field{position:fixed;z-index:0;inset:0;display:block;width:100%;height:100%}.veil{position:fixed;z-index:1;inset:0;pointer-events:none;background:radial-gradient(120% 80% at 50% 40%,transparent 0%,rgba(10,14,12,.55) 62%,var(--ground-2) 100%)}#app{position:relative;z-index:2}.app-shell{width:min(100%,1280px);margin:0 auto;padding:0 clamp(16px,3vw,40px) 104px}.masthead{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:16px;padding:22px 0 14px;border-bottom:1px solid var(--hair-soft)}.wordmark{display:flex;align-items:baseline;gap:12px}.wordmark b{font-family:var(--serif);font-size:1.35rem;font-weight:600;letter-spacing:.14em}.wordmark span{color:var(--ink-faint);font-family:var(--latin);font-size:1rem;font-style:italic;letter-spacing:.06em}.masthead p{margin:0;color:var(--ink-faint);font-family:var(--mono);font-size:.75rem;letter-spacing:.16em;text-transform:uppercase}.mode-tabs{display:flex;flex-wrap:wrap;gap:2px;margin:14px 0 26px}.mode-tabs button{padding:7px 15px 8px;border:1px solid transparent;border-radius:2px;color:var(--ink-faint);font-size:.875rem;letter-spacing:.1em;transition:color .2s,border-color .2s,background .2s}.mode-tabs button:hover{color:var(--ink-dim)}.mode-tabs button[aria-selected=true]{border-color:var(--hair);background:#ffffff07;color:var(--ink)}.mode-tabs i{margin-right:7px;color:var(--ink-faint);font-family:var(--mono);font-size:.75rem;font-style:normal}.content-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start;min-width:0}.content-layout.is-wide{grid-template-columns:minmax(0,1fr)}.stage{min-width:0}.oil-rail{position:sticky;top:20px;max-height:calc(100vh - 44px);overflow-y:auto;padding-right:6px}.oil-rail::-webkit-scrollbar{width:3px}.oil-rail::-webkit-scrollbar-thumb{border-radius:2px;background:var(--hair)}.family-group{margin-bottom:18px}.family-group h2,.gauge-label,.eyebrow,.slot h2,.clue span,th{font-family:var(--mono);font-size:.75rem;font-weight:400;letter-spacing:.18em;text-transform:uppercase}.family-group h2{margin:0 0 5px;color:var(--ink-faint);font-size:.7rem;letter-spacing:.2em}.family-group ul{margin:0;padding:0;list-style:none}.oil-button{display:flex;align-items:center;gap:9px;width:100%;padding:5px 8px 6px;border-radius:2px;color:var(--ink-dim);font-size:.875rem;text-align:left;transition:color .18s,background .18s}.oil-button:hover,.oil-button[aria-current=true]{background:#ffffff0e;color:var(--ink)}.oil-button[aria-current=true] .direction-glyph{color:var(--oil-1)}.direction-glyph{width:1em;flex:none;color:var(--ink-faint);font-family:var(--mono);font-size:.85rem}.oil-button small{margin-left:auto;color:var(--ink-faint);font-family:var(--mono);font-size:.7rem;letter-spacing:.04em}.eyebrow{margin:0 0 10px;color:var(--ink-faint)}.oil-title{display:flex;flex-wrap:wrap;align-items:flex-end;gap:18px;margin-bottom:4px}.oil-title h1{margin:0;font-family:var(--serif);font-size:clamp(2.55rem,6vw,4rem);font-weight:600;letter-spacing:.06em;line-height:1.05;text-wrap:balance}.oil-title em{padding-bottom:.5em;color:var(--oil-2);font-family:var(--latin);font-size:clamp(1.25rem,2.4vw,1.75rem);font-style:italic;font-weight:300;letter-spacing:.03em}.instrument{display:flex;flex-wrap:wrap;align-items:flex-start;gap:clamp(20px,4vw,44px);margin-top:14px;padding:18px 0 20px;border-top:1px solid var(--hair-soft);border-bottom:1px solid var(--hair-soft)}.gauge{display:flex;flex-direction:column;gap:7px}.gauge-label{color:var(--ink-faint)}.direction-value{display:flex;align-items:baseline;gap:10px}.direction-value b{color:var(--oil-1);font-family:var(--mono);font-size:1.75rem;font-weight:400;line-height:1}.direction-value span{font-size:.95rem}.temperature-scale{display:flex;align-items:center;gap:4px;height:26px}.temperature-scale.is-cold{color:var(--cold)}.temperature-scale.is-warm{color:var(--warm)}.temperature-mark{display:block;width:9px;height:2px;border-radius:1px;background:var(--hair)}.temperature-mark.is-current{width:2px;height:13px;background:currentColor}.temperature-label{margin-left:6px;color:var(--ink-dim);font-family:var(--mono);font-size:.75rem}.volatility{color:var(--ink);font-family:var(--mono);font-size:.85rem;letter-spacing:.02em}.breathe-controls{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin:26px 0 8px}.inhale-button{position:relative;overflow:hidden;padding:11px 26px;border:1px solid var(--oil-1);border-radius:999px;color:var(--ink);font-size:.875rem;letter-spacing:.16em;transition:color .3s,border-color .3s,background .3s}.inhale-button:hover{background:#ffffff0d}.inhale-button.is-busy{border-color:var(--hair);color:var(--ink-faint)}.breathe-controls>span{color:var(--ink-faint);font-family:var(--mono);font-size:.75rem;letter-spacing:.14em}.reveal-list{max-width:60ch;margin:22px 0 0;padding:0;list-style:none}.reveal-list li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:16px;padding:15px 0;border-bottom:1px solid var(--hair-soft);opacity:1;transform:none;transition:opacity .9s ease,transform .9s ease}.reveal-list li.is-hidden{opacity:0;transform:translateY(10px)}.sequence{padding-top:5px;color:var(--ink-faint);font-family:var(--mono);font-size:.75rem;letter-spacing:.08em}.reveal-list h2{margin:0 0 3px;color:var(--ink-faint);font-family:var(--mono);font-size:.7rem;font-weight:400;letter-spacing:.2em;text-transform:uppercase}.reveal-list p{max-width:62ch;margin:0;font-size:1.075rem;line-height:1.65}.first-nose{display:flex;flex-wrap:wrap;gap:10px}.first-nose b{color:var(--oil-1);font-family:var(--serif);font-size:1.5rem;font-weight:400;letter-spacing:.14em}.first-nose b+b:before{margin-right:10px;color:var(--ink-faint);content:"·";font-size:1.15rem}.oil-footnote{display:flex;flex-wrap:wrap;gap:22px;margin-top:22px;color:var(--ink-faint);font-family:var(--mono);font-size:.75rem;letter-spacing:.04em}.oil-footnote b{color:var(--ink-dim);font-weight:400}.oil-footnote .caution{color:var(--warm)}.panel{padding:clamp(18px,2.6vw,28px);border:1px solid var(--hair-soft);border-radius:3px;background:#1218159e}.panel>h1{margin:0 0 4px;font-family:var(--serif);font-size:1.5rem;font-weight:600;letter-spacing:.1em}.lede{max-width:62ch;margin:0 0 20px;color:var(--ink-dim);font-size:.9rem}.quiz-panel{max-width:720px}.clues{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:1px;margin:20px 0 26px;border:1px solid var(--hair-soft);background:var(--hair-soft)}.clue{padding:14px 16px;background:var(--ground)}.clue span{display:block;margin-bottom:6px;color:var(--ink-faint)}.clue b{color:var(--ink);font-family:var(--serif);font-size:1.2rem;font-weight:400;letter-spacing:.1em}.choices{display:flex;max-width:440px;flex-direction:column;gap:8px}.choice{display:flex;align-items:baseline;gap:12px;padding:12px 16px;border:1px solid var(--hair);border-radius:2px;text-align:left;transition:border-color .2s,background .2s,opacity .2s}.choice:hover:not(:disabled){border-color:var(--oil-1);background:#ffffff08}.choice em{color:var(--ink-faint);font-family:var(--latin);font-size:1rem;font-style:italic}.choice.is-right{border-color:var(--oil-1);background:#ffffff0d}.choice.is-wrong{border-color:var(--warm);opacity:.65}.verdict{margin-top:22px;padding-top:18px;border-top:1px solid var(--hair-soft)}.verdict p{max-width:56ch;margin:0 0 12px}.verdict .why{color:var(--ink-dim);font-size:.9rem}.score{display:inline-block;margin:8px 0 0 14px;color:var(--ink-faint);font-family:var(--mono);font-size:.75rem;letter-spacing:.14em}.verdict>.score:first-child{margin-left:0}.ghost-button{padding:9px 20px;border:1px solid var(--hair);border-radius:999px;color:var(--ink-dim);font-size:.875rem;letter-spacing:.12em;transition:color .2s,border-color .2s}.ghost-button:hover{border-color:var(--brass);color:var(--ink)}.blend-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(24px,4vw,48px);align-items:start}.slots{display:flex;flex-direction:column;gap:2px}.slot{padding:14px 16px;border:1px solid var(--hair-soft);background:#12181580}.slot h2{margin:0 0 9px;color:var(--ink-faint)}.slot h2 span{float:right;color:var(--ink-dim);font-weight:400;letter-spacing:.06em;text-transform:none}.pills{display:flex;flex-wrap:wrap;gap:6px}.pill{padding:6px 12px 7px;border:1px solid var(--hair);border-radius:999px;color:var(--ink-dim);font-size:.875rem;transition:color .18s,border-color .18s,background .18s}.pill:hover{border-color:var(--ink-faint);color:var(--ink)}.pill[aria-pressed=true]{border-color:var(--oil-1);background:var(--oil-1);color:var(--ground)}.blend-summary{min-height:1.7em}.axes{display:flex;flex-direction:column;gap:14px;margin:0 0 24px}.axis{display:grid;grid-template-columns:64px minmax(0,1fr) 34px;align-items:center;gap:12px}.axis>span{color:var(--ink-dim);font-size:.875rem}.bar{position:relative;height:3px;border-radius:2px;background:var(--hair-soft)}.bar i{position:absolute;inset:0 auto 0 0;border-radius:2px;background:var(--oil-1);transition:width .5s cubic-bezier(.2,.7,.3,1)}.axis var{color:var(--ink-faint);font-family:var(--mono);font-size:.75rem;font-style:normal;font-variant-numeric:tabular-nums;text-align:right}.recipe{padding-top:18px;border-top:1px solid var(--hair-soft)}.recipe p{max-width:52ch;margin:0 0 10px}.recipe .gap-note{color:var(--ink-faint);font-size:.875rem}.drops{color:var(--ink);font-family:var(--mono);font-size:.85rem;letter-spacing:.04em}.dilution{margin-top:12px;color:var(--ink-faint);font-family:var(--mono);font-size:.75rem;letter-spacing:.04em}.method{max-width:860px}.method h2{margin:30px 0 8px;font-family:var(--serif);font-size:1.2rem;letter-spacing:.1em}.anchors{display:grid;gap:1px;margin:0 0 34px;padding:0;border:1px solid var(--hair-soft);background:var(--hair-soft);list-style:none}.anchors li{display:grid;grid-template-columns:26px 96px minmax(0,1fr);gap:14px;align-items:baseline;padding:16px 18px;background:var(--ground)}.anchors .sequence{color:var(--brass)}.anchors b{font-family:var(--serif);font-size:1.05rem;font-weight:600;letter-spacing:.12em}.anchors p,.body-copy{max-width:62ch;margin:0;color:var(--ink-dim);font-size:.9rem}.table-wrap{max-width:100%;margin:16px 0 22px;overflow-x:auto}table{width:100%;min-width:760px;border-collapse:collapse;font-size:.875rem}th,td{padding:11px 14px 11px 0;border-bottom:1px solid var(--hair-soft);vertical-align:top;text-align:left}th{color:var(--ink-faint)}.scenario-row{cursor:pointer;transition:background .18s}.scenario-row:hover,.scenario-row:focus-visible{background:#ffffff0b}.scenario-row:focus-visible{outline:0;box-shadow:inset 3px 0 var(--brass)}.direction-cell{color:var(--oil-1);font-family:var(--mono);white-space:nowrap}.formula-cell{color:var(--ink-dim);white-space:nowrap}.scenario-lessons{max-width:68ch;margin:0 0 30px;padding-left:1.4em;color:var(--ink-dim);font-size:.9rem}.scenario-lessons li+li{margin-top:8px}.scenario-lessons b,.mnemonics b{color:var(--ink)}.blend-skeleton{margin:16px 0 28px;padding-left:18px;border-left:1px solid var(--hair);color:var(--ink-dim);font-family:var(--mono);font-size:.8rem}.blend-skeleton>div{display:grid;grid-template-columns:7rem 10rem 8rem minmax(12rem,1fr);gap:10px;line-height:2}.blend-skeleton b{color:var(--ink);font-weight:400}.mnemonics{max-width:62ch;color:var(--ink-dim);font-size:.9rem}.mnemonics p{margin:0 0 5px}.disclaimer{max-width:62ch;margin:26px 0 0;padding-top:14px;border-top:1px solid var(--hair-soft);color:var(--ink-faint);font-size:.75rem}.sound-button{position:fixed;z-index:5;right:clamp(14px,3vw,28px);bottom:clamp(14px,3vw,28px);display:flex;align-items:center;gap:8px;padding:8px 14px;border:1px solid var(--hair);border-radius:999px;background:#0a0e0cd1;color:var(--ink-faint);font-family:var(--mono);font-size:.75rem;letter-spacing:.16em;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.sound-button:hover{border-color:var(--ink-faint);color:var(--ink-dim)}.sound-button.is-on{border-color:var(--oil-1);color:var(--oil-1)}@media(max-width:900px){.content-layout{grid-template-columns:minmax(0,1fr)}.oil-rail{position:static;display:flex;gap:18px;max-height:none;margin-bottom:22px;padding:0 0 10px;overflow-x:auto;border-bottom:1px solid var(--hair-soft)}.family-group{flex:none;margin-bottom:0}.family-group ul{display:flex;gap:2px}.oil-button{padding:5px 10px 6px;white-space:nowrap}.oil-button small{display:none}.blend-layout{grid-template-columns:minmax(0,1fr)}}@media(max-width:560px){.masthead{align-items:flex-start}.mode-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.mode-tabs button{text-align:left}.anchors li{grid-template-columns:26px minmax(0,1fr)}.anchors p{grid-column:2}.slot h2 span{display:block;float:none;margin-top:3px}.score{display:block;margin-left:0}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
