@import "https://fonts.googleapis.com/css2?family=DM+Mono&family=Playfair+Display:wght@500;600&family=Source+Sans+3:wght@400;600;700&display=swap";html{background:#180f1c}body{min-width:320px}:root{color:#f5eee4;background:#180f1c;font-family:"Source Sans 3",sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 80% -10%,#4e294b 0,#0000 38%),#180f1c;min-height:100vh;margin:0}button{font:inherit;cursor:pointer;min-height:44px}main{max-width:760px;margin:auto;padding:20px}header{justify-content:space-between;align-items:center;display:flex}.brand{color:#f5d28a;letter-spacing:-.5px;font-family:Playfair Display,serif;font-size:24px;text-decoration:none}.language,.toggle,.secondary{color:#f5eee4;background:0 0;border:1px solid #785f72;border-radius:999px;padding:9px 14px}.intro{padding:64px 0 36px}.eyebrow{text-transform:uppercase;letter-spacing:.12em;color:#d7ab77;font-size:11px;font-weight:700}.intro h1{color:#fff8ed;margin:10px 0;font:600 clamp(42px,10vw,70px)/.96 Playfair Display,serif}.intro p:not(.eyebrow){color:#c9b8c0;max-width:400px;font-size:18px}.chooser,.patterns{background:#2f1c2db8;border:1px solid #5e425a;border-radius:24px;padding:20px}.spread-row{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.spread{color:#eee3dd;background:#251725;border:1px solid #684c64;border-radius:16px;min-height:94px;padding:10px;font-weight:700}.spread small{color:#ae96a5;margin-top:4px;font-weight:400;display:block}.spread.selected{color:#fff4d9;background:#3d253a;border-color:#efc676}.toggle{margin:18px 0 10px}.cadence{color:#e5bd80;font-size:14px}.primary{color:#241321;background:#e7b761;border:0;border-radius:999px;justify-content:center;align-items:center;gap:8px;width:100%;margin-top:16px;padding:12px 20px;font-weight:700;display:flex}.picker{background:#2f1c2db8;border:1px solid #5e425a;border-radius:24px;margin-top:14px;padding:14px}.picker .draw-prompt{flex-direction:column;align-items:flex-start;gap:7px;min-height:76px;display:flex}.picker .draw-prompt>span:first-child{white-space:nowrap}.picker .position-callout{color:#2d162d;white-space:nowrap;background:linear-gradient(135deg,#f7d78b,#e7a95c);border-radius:9px;padding:3px 9px;display:inline-block;box-shadow:0 0 18px #e7b76180}.picker p:not(.eyebrow){color:#d9c9cf;margin:6px 0;font-size:14px}.pick-grid{zoom:.55;grid-template-columns:repeat(6,1fr);gap:6px;width:330px;margin:12px auto 0;display:grid}.pick-card{aspect-ratio:2/3;color:#f5d28a;background:repeating-linear-gradient(45deg,#2f1b31,#2f1b31 8px,#422646 8px 16px);border:1px solid #805b7d;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:6px;min-height:0;font-size:12px;display:flex}.pick-card.picked{opacity:.18;pointer-events:none;background:0 0;border-style:dashed}.pick-card:hover,.pick-card:focus-visible{outline-offset:2px;background:#4a2b4a;outline:2px solid #f0c873}.cards{gap:16px;display:grid}.cards-three{grid-template-columns:repeat(3,1fr)}.cards-celtic{grid-template-columns:repeat(4,74px);justify-content:center;align-items:start;gap:8px;padding:8px 0 18px}.celtic-0{grid-area:2/2}.celtic-1{z-index:1;grid-area:2/2;transform:translate(36%)rotate(90deg)}.celtic-2{grid-area:1/2}.celtic-3{grid-area:3/2}.celtic-4{grid-area:2/1}.celtic-5{grid-area:2/3}.celtic-6{grid-area:4/4}.celtic-7{grid-area:3/4}.celtic-8{grid-area:2/4}.celtic-9{grid-area:1/4}.cards-celtic .card{background:0 0;border-radius:12px;padding:6px}.cards-celtic .card>:not(.position):not(img){display:none}.cards-celtic .position{text-align:center;place-items:end center;min-height:2.4em;font-size:10px;line-height:1.2;display:grid}.cards-celtic .card img{border-radius:7px}.celtic-details{margin-top:24px}.celtic-details h2{font:600 28px Playfair Display,serif}.celtic-details details{background:#2c1a2a;border:1px solid #5e425a;border-radius:14px;margin:9px 0;padding:13px}.celtic-details summary{cursor:pointer;color:#f5d28a;font-weight:700}.celtic-detail-image{aspect-ratio:3/5;object-fit:cover;border-radius:8px;width:112px;margin:16px auto 10px;display:block}.celtic-detail-image.reversed{transform:rotate(180deg)}.celtic-details h3{margin:16px 0 3px;font:600 17px Playfair Display,serif}.celtic-details p{color:#d9c9cf;line-height:1.5}.card{background:#2c1a2a;border-radius:18px;min-width:0;padding:10px}.position{color:#d8b37a;margin-bottom:8px;font-size:12px}.card img{aspect-ratio:3/5;object-fit:cover;border-radius:10px;width:100%;display:block}.card img.reversed{transform:rotate(180deg)}.card h2{margin:10px 0 2px;font:600 18px Playfair Display,serif}.card span{color:#d8b37a;text-transform:uppercase;font-size:12px}.card p{color:#d9c9cf;font-size:14px;line-height:1.4}.card-back{aspect-ratio:3/5;text-align:center;color:#f5d28a;background:repeating-linear-gradient(45deg,#2f1b31,#2f1b31 8px,#422646 8px 16px);border-radius:10px;place-items:center;padding:10px;display:grid}.actions{gap:10px;margin:24px 0;display:flex}.actions button{flex:1}.secondary{background:#2c1a2a;margin-top:16px}.reading{margin-top:12px}.reading summary{color:#f5d28a;cursor:pointer;font-weight:700}.lens-tabs{scrollbar-width:none;gap:7px;padding:14px 0 4px;display:flex;overflow-x:auto}.lens-tabs button{white-space:nowrap;color:#e9dce0;background:#251725;border:1px solid #785f72;border-radius:999px;min-height:36px;padding:6px 11px;font-size:12px}.lens-tabs button.active{color:#241321;background:#e7b761;border-color:#e7b761}.reading h3{margin:16px 0 2px;font:600 16px Playfair Display,serif}.reading p{white-space:pre-line}.patterns h2{margin:6px 0;font:600 24px Playfair Display,serif}.patterns p{color:#d9c9cf}.sheet{z-index:2;background:#120a13cc;place-items:end center;padding:18px;display:grid;position:fixed;inset:0}.sheet>div{background:#352035;border:1px solid #795477;border-radius:24px;width:min(600px,100%);padding:24px}.sheet h2{margin:6px 0;font:600 28px Playfair Display,serif}.sheet p{color:#dacbd1}footer{color:#9e8998;text-align:center;padding:42px 8px 10px;font-size:12px}@media (width<=430px){main{padding:16px}.cards-three{grid-template-columns:1fr}.cards-three .card{grid-template-columns:110px 1fr;gap:8px;display:grid}.cards-three .position{grid-column:1/-1}.cards-three img,.cards-three .card-back{grid-row:2/5}.cards-celtic{gap:10px}.card{padding:8px}.card h2{font-size:15px}.card p{font-size:13px}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
