/* "What are you looking for?" (shared/mood.js) */
.md{max-width:560px}
.md-head{display:flex;align-items:center;gap:14px;margin:0 0 18px}.md-head h2{margin:0;font:400 1.6rem var(--au-serif,Georgia,serif);color:var(--da2,#ecd39b)}
.md-lens{display:inline-block;width:54px;height:54px;flex:none;filter:drop-shadow(0 4px 14px #dcbc7840)}.md-lens svg{width:100%;height:100%}
.md-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.md-sq{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:6px;border-radius:20px;border:1px solid var(--dl,#3b3121);background:#0e0c09;color:var(--dt,#f2e8d2);cursor:pointer;transition:transform .18s ease,border-color .18s,background .18s,box-shadow .18s;position:relative}
.md-sq:hover,.md-sq:focus-visible{transform:translateY(-3px);border-color:var(--da,#dcbc78);background:linear-gradient(160deg,#2a2010,#120e07);box-shadow:0 10px 24px #dcbc7826;outline:0}
.md-ic{width:34px;height:34px;color:var(--da,#dcbc78)}.md-ic svg{width:100%;height:100%}
.md-sq b{font:700 .74rem/1.15 var(--au-sans,system-ui,sans-serif);text-align:center}.md-sq small{position:absolute;top:7px;right:9px;color:var(--dm,#9d8f74);font:600 .66rem var(--au-sans,system-ui,sans-serif)}
.md-go{background:linear-gradient(160deg,#f0d58f,#b8892a);border-color:transparent;color:#17120a}.md-go .md-ic{color:#17120a}.md-go:hover{background:linear-gradient(160deg,#f6e0a0,#c9a04a)}
.md-bar{display:flex;align-items:center;gap:10px;margin:0 0 12px}.md-bar h2{margin:0;font:400 1.4rem var(--au-serif,Georgia,serif);color:var(--da2,#ecd39b);flex:1}
.md-back{width:38px;height:38px;border-radius:50%;border:1px solid var(--dl,#3b3121);background:none;color:var(--dt,#f2e8d2);font-size:1.4rem;cursor:pointer}
.md-pick{width:auto;display:inline-flex;gap:8px;align-items:center}.md-pick svg{width:18px;height:18px}
.md-list{max-height:min(60vh,520px);overflow:auto;display:grid;gap:6px}
.md-row{display:grid;grid-template-columns:22px 42px 1fr auto;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;border:1px solid var(--dl,#3b3121);background:#0e0c09;color:var(--dt,#f2e8d2);text-align:left;cursor:pointer}
.md-row:hover{border-color:var(--da,#dcbc78)}.md-n{color:var(--dm,#9d8f74);font:700 .78rem var(--au-sans,system-ui,sans-serif);text-align:center}
.md-t b{display:block;font:600 .9rem var(--au-sans,system-ui,sans-serif)}.md-t small{color:var(--dm,#9d8f74);font:500 .72rem var(--au-sans,system-ui,sans-serif)}.md-s{font:700 .9rem var(--au-sans,system-ui,sans-serif);color:var(--da2,#ecd39b)}
.md-more{display:block;margin-top:8px;text-align:center;color:var(--dm,#9d8f74)}
.md-spin,.md-result{text-align:center;padding:18px 6px 10px}.md-spin .md-lens,.md-result .md-lens{width:76px;height:76px}
.md-lens.spin{animation:mdSpin 1.1s ease-in-out infinite}@keyframes mdSpin{0%,100%{transform:rotate(-12deg) scale(1)}50%{transform:rotate(12deg) scale(1.12)}}
.md-slot{margin:14px 0 0;font:400 1.5rem var(--au-serif,Georgia,serif);color:var(--da2,#ecd39b);min-height:2.2rem}.md-slot.pop{animation:mdPop .12s ease-out}@keyframes mdPop{from{opacity:.3;transform:translateY(8px)}to{opacity:1;transform:none}}
.md-result h2{margin:10px 0 4px;font:400 1.8rem var(--au-serif,Georgia,serif);color:var(--da2,#ecd39b)}.md-result .mp-b.big{width:84px;height:84px;font-size:1.6rem;margin:6px auto 0;animation:mdBack .6s cubic-bezier(.2,1.4,.4,1) both}@keyframes mdBack{from{transform:scale(.3)}to{transform:scale(1)}}
.md-acts{display:flex;gap:10px;justify-content:center;margin-top:16px;flex-wrap:wrap}.md-acts .d-cta{width:auto;padding:0 22px;height:46px}
/* the magnifying glass in the middle of the phone bar */
.d-tabs .md-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:none;border:0;color:var(--da2,#ecd39b);font:600 .62rem var(--au-sans,system-ui,sans-serif);letter-spacing:.04em;cursor:pointer;padding:0}
.d-tabs .md-tab svg{width:30px;height:30px;filter:drop-shadow(0 2px 8px #dcbc7855)}
html[data-device=phone] .d-tabs .md-tab{flex:1 1 0;min-width:0}
.md-rail svg{width:22px;height:22px;vertical-align:-5px}.md-rail{display:inline-grid;place-items:center;margin-right:12px}
@media (max-width:480px){.md-grid{gap:8px}.md-sq{border-radius:16px}.md-ic{width:28px;height:28px}.md-sq b{font-size:.66rem}.md-head h2{font-size:1.3rem}}
.md-kick{margin:0 0 10px;font:700 .8rem var(--au-sans,system-ui,sans-serif);letter-spacing:.18em;text-transform:uppercase;color:var(--da,#dcbc78)}
.md-reel{position:relative;height:162px;overflow:hidden;border:2px solid var(--da,#dcbc78);border-radius:20px;background:#0b0a09;box-shadow:inset 0 0 30px #000,0 0 24px #dcbc7826;-webkit-mask-image:linear-gradient(#0000,#000 30%,#000 70%,#0000);mask-image:linear-gradient(#0000,#000 30%,#000 70%,#0000)}
.md-strip{will-change:transform;padding-top:54px}.md-strip>div{display:flex;align-items:center;gap:14px;padding:0 18px;color:var(--dt,#f2e8d2);overflow:hidden}.md-strip>div b{font:400 1.3rem var(--au-serif,Georgia,serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.md-strip .mp-b{flex:none;width:44px;height:44px;font-size:.95rem}
.md-hl{position:absolute;left:0;right:0;border-top:2px solid var(--da,#dcbc78);border-bottom:2px solid var(--da,#dcbc78);background:#dcbc7818;pointer-events:none}.md-reel.won .md-hl{background:#f0d58f55;animation:mdFlash .5s ease 3}@keyframes mdFlash{50%{background:#f0d58faa}}
.md-result{position:relative;overflow:hidden}.md-trophy{font-size:3rem;animation:mdBack .6s cubic-bezier(.2,1.4,.4,1) both}
.md-cf{position:absolute;top:-12px;left:var(--x);width:8px;height:14px;background:var(--c);border-radius:2px;animation:mdFall 2.2s var(--d) ease-in both;pointer-events:none}@keyframes mdFall{to{transform:translateY(420px) rotate(var(--r));opacity:0}}
@media (prefers-reduced-motion:reduce){.md-lens.spin,.md-slot.pop,.md-result .mp-b.big,.md-cf,.md-trophy{animation:none}.md-cf{display:none}}
.md-find{margin:0 0 14px}.md-find input{width:100%;height:50px;padding:0 18px;border-radius:99px;border:1px solid var(--dl,#3b3121);background:#0b0a09;color:var(--dt,#f2e8d2);font:500 1rem var(--au-sans,system-ui,sans-serif)}.md-find input:focus{outline:2px solid var(--da,#dcbc78);outline-offset:1px}