/* Results chart layout: a central square, four side buttons, eight corner fades. */
body { padding: 3rem 4vw; color: #ddc5d0; }
.page { width: min(1120px,100%); }
.draft-note { font-size: .8rem; letter-spacing: .12em; color: #ddc5d0; }
.heaven-figure { width: 100%; aspect-ratio: 1; border: 0; }
.corner-fades { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.heaven-figure .food-compass .diamond { color:#2a2626; width:50%; height:25%; gap:1.5cqw; padding:7cqw 0 0; }
.heaven-figure .food-compass .top { left:25%; top:0; background:#f2c8cd; }
.heaven-figure .food-compass .bottom { left:25%; top:75%; background:#bdddd5; padding:0 0 7cqw; }
.heaven-figure .food-compass .left, .heaven-figure .food-compass .right { top:25%; width:25%; height:50%; padding:0; gap:1.5cqw; }
.heaven-figure .food-compass .left { left:0; background:#c6cfed; padding-left:9cqw; }
.heaven-figure .food-compass .right { left:75%; background:#f3dfba; padding-right:9cqw; }
.heaven-figure .food-compass .diamond ion-icon, .heaven-figure .food-compass .diamond .material-symbols-outlined { font-size:clamp(16px,3.8cqw,42px); }
.heaven-figure .food-compass .diamond-label { position:absolute; max-width:none; width:auto; font-size:clamp(9px,1.3cqw,15px); opacity:1; }
.heaven-figure .food-compass .top .diamond-label { inset:auto 0 2cqw; }
.heaven-figure .food-compass .bottom .diamond-label { inset:2cqw 0 auto; }
.heaven-figure .food-compass .left .diamond-label { inset:auto 0 10cqw 9cqw; }
.heaven-figure .food-compass .right .diamond-label { inset:auto 9cqw 10cqw 0; }
.heaven-figure .food-compass .diamond:focus-visible { filter:brightness(1.12); }
.figure-center { inset:25%; border:1px solid #ddc5d06b; }
.figure-center .answer-card-slide { padding:2cqw; }
.figure-center .meal-title { font-size:clamp(1.4rem,3.6cqw,3rem)!important; margin:.5rem 0; }
.figure-center .meal-badge-column { width:clamp(85px,15cqw,165px); }
.figure-center .badge-glyphs { font-size:clamp(1.2rem,2.2cqw,1.8rem); }
.figure-center .card-one-extras { gap:.5rem; margin:.5rem 0; }
.figure-center #cuisine-results { font-size:clamp(.8rem,1.7cqw,1.2rem); margin:.5rem 0; }
.figure-center .cuisine-status:empty { display:none; }
.figure-center .card-number { font-size:clamp(.65rem,1.2cqw,.85rem); }
.figure-center .calculation-details { font-size:clamp(.65rem,1.15cqw,.85rem); margin-top:.5rem; }
.figure-card-controls { padding:.4rem; gap:.3rem; }
.figure-card-controls button { font-size:clamp(.6rem,1.1cqw,.8rem); padding:.3rem .5rem; }
@media(max-width:600px) {
 body { padding:1.5rem 2vw; }
 .heaven-figure { aspect-ratio:1; }
 .heaven-figure .food-compass .left .diamond-label, .heaven-figure .food-compass .right .diamond-label { clip-path:none; height:auto; overflow:visible; }
 .figure-center .answer-card-slide p { font-size:.8rem; }
 .figure-center .meal-badge-column { width:85px; }
 .figure-center .meal-badge { max-width:100%; }
 .figure-center .calculation-details { text-align:left; }
 .figure-card-controls { flex-wrap:wrap; }
 .eats-guide { margin:1rem auto; }
}
.figure-center .meal-title { color:#ddc5d0 !important; }
.heaven-figure .food-compass .left .diamond-label { inset:65% 2% auto 52%; max-width:none; }
.heaven-figure .food-compass .right .diamond-label { inset:65% 52% auto 2%; max-width:none; }
/* Retain Card 1's original yellow and burgundy throughout the center. */
.figure-center, .figure-center .answer-card-slide { background:#fbe89c; color:#3c0917; }
.figure-center { border:1px solid #3c0917; }
.figure-center .meal-title, .figure-center .answer-card-slide h2 { color:#3c0917 !important; }
.figure-center .answer-card-slide p, .figure-center .card-number,
.figure-center .result-table, .figure-center .result-table th,
.figure-center .result-table td, .figure-center .badge-glyphs { color:#3c0917; }
.figure-card-controls { border-top:1px solid #3c091744; background:#fbe89c; }
.figure-card-controls button, .figure-center .astrology-tabs button { background:#fbe89c; color:#3c0917; border-color:#3c0917; }
.figure-center .astrology-tabs button[aria-selected="true"] { background:#3c0917; color:#fbe89c; }
.figure-center .answer-carousel { scrollbar-color:#3c0917 #fbe89c; }
.figure-center .answer-carousel::-webkit-scrollbar-track { background:#fbe89c; }
.figure-center .answer-carousel::-webkit-scrollbar-thumb { background:#3c0917; }
/* Fine edges make the four outward triangles legible against the corner fades. */
.heaven-figure .food-compass .diamond { filter:drop-shadow(0 0 1px #3c0917); }
/* Larger badge above the countries; the center scrolls to keep all results accessible. */
.figure-center .card-one-extras { display:flex; flex-direction:column; align-items:center; }
.figure-center .meal-badge-column { order:-1; flex:none; width:clamp(255px,45cqw,495px); max-width:none; }
.figure-center .meal-badge { width:100%; max-width:none; height:auto; }
.figure-center .card-one-cuisines { width:100%; flex:none; }
.figure-center .badge-glyphs { font-size:clamp(1.8rem,3.5cqw,3rem); }
@media(max-width:600px) {
 .figure-center .meal-badge-column { width:255px; }
}
/* Fitted cards: navigation swaps panels; only the page itself scrolls. */
.corner-fades { overflow:visible; }
.figure-center { overflow:visible; }
.figure-center .answer-carousel-wrap { flex:1; min-height:0; }
.figure-center .answer-carousel { display:block; height:auto; overflow:visible; scroll-snap-type:none; }
.figure-center .answer-card-slide { height:auto; min-height:0; overflow:visible; padding:1.3cqw 1.6cqw; }
.figure-center .card-number { margin:0 0 .4cqw !important; }
.figure-center .meal-title { margin:.4cqw 0 0 !important; font-size:clamp(18px,3.3cqw,37px)!important; line-height:1.1; }
.figure-center .meal-title .planetary-word, .figure-center .meal-title .meal-words { display:inline; font-size:1em; line-height:inherit; margin:0; }
.figure-center .card-one-extras { margin:0; gap:0; }
.figure-center .meal-badge-column { width:28cqw; max-width:100%; margin:0 auto; text-align:center; }
.figure-center .meal-badge { width:100%; height:auto; display:block; margin:.35cqw 0 -4cqw; }
.figure-center .meal-title { position:relative; z-index:2; }
.figure-center .meal-badge-column { position:relative; z-index:1; }
/* Moon badges are JPEGs without transparency. Blend away their white square
   while preserving the hand-drawn badge art and any title beneath its box. */
.figure-center .meal-badge[src$=".jpeg"] { mix-blend-mode:multiply; }
.figure-center .badge-glyphs { position:relative; left:auto; bottom:auto; transform:none; font-size:clamp(20px,3cqw,34px); margin:0; }
.figure-center #cuisine-results { margin:.7cqw 0; font-size:clamp(11px,1.5cqw,17px); line-height:1.3; }
.figure-center .calculation-details { margin:.4cqw 0 0; }
.figure-center .calculation-details summary { font-size:clamp(11px,1.35cqw,15px); padding:.3cqw 0; }
.figure-center .result-table { font-size:clamp(10px,1.2cqw,14px); line-height:1.15; margin:.6cqw 0; table-layout:fixed; }
.figure-center .result-table th, .figure-center .result-table td { padding:.42cqw .45cqw; overflow-wrap:anywhere; }
.figure-center .result-table .table-glyph { font-size:1.15em; }
.figure-center .astrology-tabs { margin:.7cqw 0 0; gap:.5cqw; }
.figure-center .astrology-tabs button { font-size:clamp(10px,1.2cqw,14px); padding:.5cqw .8cqw; }
.figure-card-controls { padding:.6cqw; flex-wrap:nowrap; }
.figure-card-controls button { font-size:clamp(9px,1.15cqw,13px); padding:.5cqw .6cqw; }
.figure-card-controls button[aria-pressed="true"] { background:#3c0917; color:#fbe89c; }
@media(max-width:600px) {
 .figure-center .meal-badge-column { width:28cqw; }
 .figure-center .card-number { font-size:10px; }
}
/* Readable zodiac panels fill the center rather than leaving unused card space. */
.figure-center #astrology-card {
 display:flex; flex-direction:column; min-height:44cqw; gap:.7cqw;
}
.figure-center #astrology-card [role="tabpanel"] {
 display:flex; flex-direction:column; flex:1;
}
.figure-center #astrology-card .card-number {
 font-family:"Quicksand",sans-serif; font-weight:700;
 font-size:clamp(13px,1.8cqw,21px); letter-spacing:.02em;
 margin:0 0 .7cqw !important;
}
.figure-center #astrology-card .result-table {
 flex:1; width:100%; height:32cqw; margin:0;
 font-size:clamp(12px,1.65cqw,19px); line-height:1.25;
}
.figure-center #astrology-card .result-table th,
.figure-center #astrology-card .result-table td {
 padding:.65cqw .7cqw; vertical-align:middle;
}
.figure-center #astrology-card .result-table th:first-child { width:44%; }
.figure-center #astrology-card .astrology-tabs { width:100%; gap:.8cqw; margin:.4cqw 0 0; }
.figure-center #astrology-card .astrology-tabs button {
 flex:1; font-size:clamp(13px,1.7cqw,20px); font-weight:600;
 padding:.9cqw 1cqw; min-height:36px;
}
.figure-card-controls button { flex:1; font-size:clamp(11px,1.4cqw,16px); padding:.7cqw .5cqw; min-height:32px; }
/* Side actions share a horizontal icon baseline; Order Now sits above its icons. */
.heaven-figure .food-compass .left,
.heaven-figure .food-compass .right { flex-direction:row; gap:1.3cqw; }
.heaven-figure .food-compass .right .diamond-label { inset:auto 35% 64% 0; max-width:none; }
/* Identical content groups, centered at each triangle's centroid. */
.heaven-figure .food-compass .diamond { padding:0; }
.heaven-figure .food-compass .diamond .triangle-content {
 position:absolute; display:flex; flex-direction:column; align-items:center;
 justify-content:center; gap:1.2cqw; transform:translate(-50%,-50%);
 width:max-content; pointer-events:none;
}
.heaven-figure .food-compass .top .triangle-content { left:50%; top:66.6667%; }
.heaven-figure .food-compass .bottom .triangle-content { left:50%; top:33.3333%; }
.heaven-figure .food-compass .left .triangle-content { left:66.6667%; top:50%; }
.heaven-figure .food-compass .right .triangle-content { left:33.3333%; top:50%; }
.heaven-figure .food-compass .diamond .triangle-icons { display:flex; align-items:center; justify-content:center; gap:1.3cqw; line-height:1; }
.heaven-figure .food-compass .diamond .diamond-label {
 position:static; inset:auto; width:auto; height:auto; max-width:none;
 clip-path:none; overflow:visible; margin:0; font-size:clamp(9px,1.3cqw,15px);
 line-height:1.2; white-space:nowrap;
}
/* Labels face the center horizontally, and sit consistently above both side pairs. */
.heaven-figure .food-compass .bottom .diamond-label,
.heaven-figure .food-compass .left .diamond-label,
.heaven-figure .food-compass .right .diamond-label { order:-1; }
.heaven-figure .food-compass .diamond .diamond-label { font-size:clamp(11px,1.8cqw,21px); font-weight:700; }
.heaven-figure .food-compass .left .diamond-label { order:1; }
@media(max-width:600px) {
 .heaven-figure .food-compass .left .triangle-content,
 .heaven-figure .food-compass .right .triangle-content { width:62%; }
 .heaven-figure .food-compass .left .diamond-label,
 .heaven-figure .food-compass .right .diamond-label { white-space:normal; text-align:center; }
}