/* AROMA LAB final name-first layer */
.name-first-specimen{display:flex!important;align-items:center!important;justify-content:center!important}.name-first-specimen::after{content:"NAME → AROMA → MOLECULE"!important}.hero-name{display:flex;flex-direction:column;align-items:flex-start;gap:9px;width:100%}.hero-name small{font:800 9px var(--mono);letter-spacing:.12em;color:var(--green)}.hero-name strong{font-size:clamp(28px,4vw,56px);line-height:1;letter-spacing:-.05em}.hero-name span{font:800 11px var(--mono);letter-spacing:.08em;color:var(--muted)}
.card{aspect-ratio:.78;touch-action:manipulation}.front{background:var(--paper)}.name-front{flex:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:50px 22px 28px;gap:8px}.name-front small{font:900 7px var(--mono);letter-spacing:.12em;color:var(--green)}.name-front h3{margin:0;font-size:clamp(22px,2.1vw,34px);line-height:1.03;letter-spacing:-.055em;font-weight:950;word-break:keep-all}.name-front-en{font:700 9px/1.35 var(--mono);letter-spacing:.04em;color:var(--muted)}.name-front-foot{border-top:1.5px solid var(--ink);padding:11px 13px;display:flex;justify-content:space-between;align-items:center;gap:8px;font:800 8px var(--mono);letter-spacing:.07em;color:var(--muted)}.name-front-foot>span:first-child{color:var(--green);opacity:0;transition:.2s}body.show-hints .name-front-foot>span:first-child{opacity:1}
.back-face{background:var(--ink);color:var(--paper);display:flex;flex-direction:column;overflow:hidden}.reveal-head{height:34px;flex:0 0 34px;padding:9px 11px 7px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #454943;font:800 7px var(--mono);letter-spacing:.09em;color:#bbbdb6}.reveal-body{flex:1;min-height:0;display:grid;grid-template-rows:42% 35% 23%}.reveal-stage{position:relative;min-height:0}.stage-label{position:absolute;left:8px;top:7px;z-index:3;font:900 6px var(--mono);letter-spacing:.1em;opacity:.6}
.aroma-stage{background:var(--cream);color:var(--ink);display:grid;grid-template-columns:minmax(0,1fr) 88px;align-items:center;gap:5px;padding:19px 9px 7px;border-bottom:1px solid #555}.aroma-stage-images{min-width:0;height:100%;display:flex;align-items:center;justify-content:center;gap:3px;overflow:hidden}.final-aroma-img{display:block;max-width:100%;object-fit:contain;background:transparent}.aroma-stage-images .final-aroma-img{width:min(50%,145px);height:100%;max-height:132px}.aroma-stage-copy{font-size:10px;line-height:1.3;font-weight:900}
.molecule-stage{display:grid;grid-template-columns:minmax(0,1fr) 112px;align-items:center;gap:8px;padding:20px 9px 7px;border-bottom:1px solid #454943}.final-structure{min-width:0;height:100%;display:grid;place-items:center;padding:5px;background:var(--paper);border-radius:7px;overflow:hidden}.final-structure img{display:block;width:100%;height:100%;max-height:105px;object-fit:contain;object-position:50% 50%;filter:grayscale(1) contrast(1.2);mix-blend-mode:multiply;transform:none!important;transform-origin:50% 50%}.card:hover .final-structure img{transform:none!important}.final-structure .structure-fallback{font-size:7px}.molecule-copy{min-width:0;display:flex;flex-direction:column;gap:3px}.molecule-copy strong{font-size:10px;line-height:1.15}.molecule-copy span{font:700 6.5px/1.3 var(--mono);color:#c4c6be}.molecule-copy em{font:900 6px var(--mono);font-style:normal;color:var(--yellow);letter-spacing:.06em}.molecule-copy small{font-size:6px;line-height:1.3;color:#aaa79c}
.drinks-stage{padding:20px 8px 7px}.final-drink-rail{margin:0;border:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:3px}.drink-ref{min-width:0;min-height:30px;border:1px solid #5a5f5a;border-radius:3px;background:transparent;color:#777b77;padding:4px 2px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font-family:var(--mono)}.drink-ref span{font-size:5.5px;font-weight:900;letter-spacing:.04em}.drink-ref strong{font-size:6px;line-height:1.1}.drink-ref.on{border-color:var(--yellow);color:var(--yellow)}.drink-ref.on:hover{background:var(--yellow);color:var(--ink)}.drinks-stage .related{display:block;margin-top:5px;font-size:6px}
.visual-index{margin:48px 0 0;border:1.8px solid var(--ink);border-radius:16px;background:var(--paper);box-shadow:5px 5px 0 var(--yellow);overflow:hidden}.visual-index>summary{list-style:none;cursor:pointer;padding:17px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px}.visual-index>summary::-webkit-details-marker{display:none}.visual-index>summary span{display:flex;align-items:baseline;gap:10px}.visual-index>summary b{font:950 16px var(--mono);letter-spacing:-.03em}.visual-index>summary small,.visual-index>summary i{font:800 8px var(--mono);font-style:normal;letter-spacing:.08em;color:var(--muted)}.visual-index[open]>summary{border-bottom:1.5px solid var(--ink);background:var(--yellow)}.visual-index-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr))}.visual-index-grid figure{margin:0;min-width:0;aspect-ratio:1;position:relative;border-right:1px solid #c8c4b7;border-bottom:1px solid #c8c4b7;padding:13px 7px 7px;display:grid;grid-template-rows:1fr auto;place-items:center;background:var(--paper)}.visual-index-grid figure>span{position:absolute;left:6px;top:5px;font:700 6px var(--mono);color:var(--muted)}.visual-index-grid .final-aroma-img{width:100%;height:100%;min-height:0;max-height:115px}.visual-index-grid figcaption{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px;font-weight:800}
.card:focus-visible .face{outline:3px solid var(--orange);outline-offset:3px}
@media(hover:hover) and (pointer:fine){.card:not(.pinned):hover .card-inner{transform:none}.card.hover-revealed:not(.pinned) .card-inner{transform:rotateY(180deg)}}
@media(max-width:1050px){.visual-index-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.molecule-stage{grid-template-columns:minmax(0,1fr) 96px}}
@media(max-width:760px){.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.card{aspect-ratio:.68}.name-front{padding:44px 13px 21px}.name-front h3{font-size:19px}.name-front-en{font-size:7px}.reveal-head{height:30px;flex-basis:30px}.reveal-body{grid-template-rows:42% 36% 22%}.aroma-stage{grid-template-columns:1fr;padding:18px 5px 5px}.aroma-stage-copy{display:none}.aroma-stage-images .final-aroma-img{max-height:104px}.molecule-stage{grid-template-columns:1fr;padding:18px 5px 5px}.molecule-copy{display:none}.final-structure img{max-height:95px}.visual-index-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.visual-index>summary b{font-size:13px}}
@media(max-width:430px){.cards{grid-template-columns:1fr;gap:18px}.card{height:520px;aspect-ratio:auto}.name-front{align-items:center;text-align:center;padding:56px 24px 28px}.name-front small{font-size:8px}.name-front h3{font-size:28px;line-height:1.05}.name-front-en{font-size:9px}.name-front-foot{padding:13px 15px;font-size:9px}.reveal-head{height:34px;flex-basis:34px;font-size:6.5px}.reveal-body{grid-template-rows:42% 36% 22%}.aroma-stage{grid-template-columns:minmax(0,1fr) 104px;padding:24px 10px 8px;gap:8px}.aroma-stage-copy{display:block;font-size:11px}.aroma-stage-images{height:100%}.aroma-stage-images .final-aroma-img{max-height:164px}.molecule-stage{grid-template-columns:minmax(0,1fr) 128px;padding:24px 10px 8px;gap:10px}.molecule-copy{display:flex}.molecule-copy strong{font-size:11px}.molecule-copy span{font-size:7px}.molecule-copy em{font-size:7px}.molecule-copy small{font-size:6.5px}.final-structure img{max-height:126px}.drinks-stage{padding:24px 10px 8px}.drink-ref{min-height:36px}.drink-ref span{font-size:6px}.drink-ref strong{font-size:7px}.drinks-stage .related{font-size:7px}.visual-index-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.visual-index-grid .final-aroma-img{max-height:130px}}
@media(hover:none) and (pointer:coarse){.card{perspective:none}.card-inner,.card.revealed .card-inner{transform:none!important;transition:none}.face{transform:none!important;backface-visibility:visible;-webkit-backface-visibility:visible}.card .front{display:flex}.card .back-face{display:none}.card.revealed .front{display:none}.card.revealed .back-face{display:flex}}
@media(prefers-reduced-motion:reduce){.card-inner{transition:none}.final-aroma-img{scroll-behavior:auto}}
