@layer theme,base;@layer components{.dy{--dy-c:var(--ok);--dy-w:var(--danger-rule);--dy-e:var(--warn);grid-template-columns:minmax(0,1fr);align-items:start;gap:12px;display:grid}@media (min-width:600px){.dy{gap:16px}}@media (min-width:1024px){.dy{grid-template-columns:minmax(0,1fr) 340px}.dy-side{top:calc(var(--nav-offset,74px) + 16px);position:sticky}}.dy-main,.dy-side{flex-direction:column;gap:12px;min-width:0;display:flex}@media (min-width:600px){.dy-main,.dy-side{gap:16px}}.dy-card{border:1px solid var(--rule);background:var(--surface);border-radius:12px;min-width:0;padding:16px}@media (min-width:600px){.dy-card{padding:20px}}.dy-game{flex-direction:column;gap:20px;display:flex}.dy-h2{font:600 16px/22px var(--font-sans);color:var(--ink);margin:0 0 16px}.dy-h3{font:500 13px/18px var(--font-sans);color:var(--ink-3);margin:20px 0 10px}.dy-secs-wrap{padding-bottom:20px}.dy-secs{background:var(--surface-2);border-radius:4px;height:12px;position:relative;overflow:hidden}.dy-secs-open,.dy-secs-fill{transform-origin:0;position:absolute;inset:0}.dy-secs-open{transition:transform var(--dur-move) var(--ease-out);background:#ffffff29}.dy-secs-fill{background:var(--accent);transform:scaleX(var(--at,0))}.dy-secs-tick{background:var(--bg);width:2px;margin-left:-1px;position:absolute;top:0;bottom:0}.dy-secs-labels{height:0;font:500 12px/16px var(--font-sans);font-variant-numeric:tabular-nums;color:var(--ink-3);position:relative}.dy-secs-labels span{transition:color var(--dur-base) var(--ease-out);padding-right:3px;position:absolute;top:6px;translate:-100%}.dy-secs-labels .dy-on{color:var(--ink)}.dy-controls{align-items:center;gap:14px;display:flex}.dy-play{background:var(--ink);width:56px;height:56px;color:var(--bg);transition:background-color var(--dur-fast) var(--ease-out), transform var(--dur-press) var(--ease-out);border-radius:999px;flex:none;place-items:center;display:grid}.dy-play:hover{background:#fff}.dy-play svg{width:22px;height:22px}.dy-play--sm{width:36px;height:36px}.dy-play--sm svg{width:16px;height:16px}.dy-play-text{flex:1;min-width:0}.dy-play-label{font:600 16px/22px var(--font-sans);font-variant-numeric:tabular-nums;color:var(--ink);margin:0}.dy-play-sub{font:400 13px/18px var(--font-sans);color:var(--ink-3);margin:2px 0 0}.dy-blanks{flex-wrap:wrap;gap:8px 14px;margin:0;display:flex}.dy-word{gap:4px;display:inline-flex}.dy-blank{border-bottom:2px solid var(--rule-strong);width:22px;height:30px;font:600 18px/1 var(--font-sans);font-variant-numeric:tabular-nums;color:var(--ink);text-transform:uppercase;place-items:center;display:grid}.dy-blank--mark{width:auto;min-width:8px;color:var(--ink-2);border-bottom-color:#0000}.dy-blank--hint{border-bottom-color:var(--ink-3);animation:dy-pop var(--dur-slow) var(--ease-out) backwards}.dy-blank--end{border-bottom-color:var(--accent);color:var(--accent)}.dy-blanks--fresh .dy-blank--end{animation:dy-pop var(--dur-slow) var(--ease-out) backwards;animation-delay:calc(var(--i) * 40ms + .2s)}@media (max-width:599.98px){.dy-blank{width:18px;height:26px;font-size:16px}}.dy-hintbar{flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:-8px;display:flex}.dy-hint-note{font:400 13px/18px var(--font-sans);color:var(--ink-3)}.dy-hints-used{color:var(--ink-2);align-items:center;gap:4px;font-size:13px;display:inline-flex}.dy-hints-used svg{width:14px;height:14px;color:var(--gold-2)}.dy-guess{flex-wrap:wrap;gap:8px;display:flex}.dy-guess-field{flex:1;min-width:0;position:relative}.dy-input{border:1px solid var(--field-edge);background:var(--surface);width:100%;height:40px;font:400 15px/22px var(--font-sans);color:var(--ink);transition:border-color var(--dur-fast) var(--ease-out);border-radius:8px;padding:0 12px}.dy-input::placeholder{color:var(--ink-3)}.dy-input:hover{border-color:var(--field-edge-hover)}.dy-input:focus-visible{outline:2px solid var(--focus);outline-offset:2px}@media (pointer:coarse){.dy-input{font-size:16px}}.dy-options{z-index:30;border:1px solid var(--rule-strong);-webkit-backdrop-filter:blur(24px)saturate(150%);backdrop-filter:blur(24px)saturate(150%);max-height:min(360px,52vh);animation:dy-menu var(--dur-base) var(--ease-out);transform-origin:top;background:#121216f0;border-radius:12px;margin:0;padding:6px;list-style:none;position:absolute;top:calc(100% + 6px);left:0;right:0;overflow:auto;box-shadow:0 8px 32px #00000073}.dy-option{cursor:pointer;border-radius:8px;align-items:center;gap:10px;min-height:44px;padding:6px 8px;display:flex}.dy-option--on{background:var(--surface-2)}.dy-option-title{min-width:0;font:500 14px/20px var(--font-sans);color:var(--ink);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.dy-option-era{flex:none}.dy-hint,.dy-notice{font:400 13px/18px var(--font-sans);color:var(--ink-2);flex-basis:100%;margin:0}.dy-notice{color:var(--danger)}.dy-rows{gap:6px;margin:0;padding:0;list-style:none;display:grid}.dy-row{min-height:44px;font:500 14px/20px var(--font-sans);border-radius:8px;align-items:center;gap:10px;padding:0 12px;display:flex}.dy-row--empty{border:1px dashed var(--rule-strong);color:var(--ink-3)}.dy-row--wait{border-style:solid;border-color:var(--rule-hover);animation:1.6s ease-in-out infinite shimmer}.dy-row-n{font-variant-numeric:tabular-nums;width:16px}.dy-row-secs{font-variant-numeric:tabular-nums;margin-left:auto;font-size:12px}.dy-row--s,.dy-row--w,.dy-row--e,.dy-row--c{--m:var(--ink-3);background:color-mix(in oklab, var(--m) 14%, transparent);color:var(--ink);animation:dy-fill var(--dur-slow) var(--ease-out) backwards}.dy-row--s{--m:#f4f4f68c;color:var(--ink-2)}.dy-row--w{--m:var(--dy-w);animation:dy-fill var(--dur-slow) var(--ease-out) backwards, dy-shake .32s var(--ease-out) .12s}.dy-row--e{--m:var(--dy-e)}.dy-row--c{--m:var(--dy-c)}.dy-row-mark{color:var(--m);animation:dy-pop var(--dur-slow) var(--ease-out) 80ms backwards;flex:none;place-items:center;display:grid}.dy-row-mark svg{stroke-width:2.25px;width:18px;height:18px}.dy-row-label{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.dy-row-tag{background:color-mix(in oklab, var(--dy-e) 18%, transparent);color:var(--dy-e);border-radius:4px;flex:none;padding:1px 6px;font-size:12px;font-weight:600}.dy-result{flex-direction:column;gap:20px;display:flex}.dy-verdict-title{font:600 30px/34px var(--font-display);letter-spacing:-.025em;color:var(--ink);margin:0}.dy-result--won .dy-verdict-title{color:var(--dy-c)}.dy-verdict-sub{font:400 15px/22px var(--font-sans);color:var(--ink-2);flex-wrap:wrap;align-items:center;gap:8px;margin:4px 0 14px;display:flex}.dy-xp{background:color-mix(in oklab, var(--accent) 16%, transparent);font-variant-numeric:tabular-nums;color:var(--accent);border-radius:4px;padding:1px 6px;font-size:12px;font-weight:600}.dy-squares{gap:6px;display:flex}.dy-square{background:var(--surface-2);border-radius:4px;width:22px;height:22px}.dy-square--s{background:#f4f4f647}.dy-square--w{background:var(--dy-w)}.dy-square--e{background:var(--dy-e)}.dy-square--c{background:var(--dy-c)}.dy-squares--fresh .dy-square{animation:dy-pop var(--dur-slow) var(--ease-out) backwards;animation-delay:calc(var(--i) * 60ms + .12s)}.dy-result--fresh .dy-verdict{animation:rise var(--dur-move) var(--ease-out) backwards}.dy-result--fresh .dy-answer{animation:rise var(--dur-move) var(--ease-out) .24s backwards}.dy-result--fresh .dy-actions,.dy-result--fresh .dy-intro,.dy-result--fresh .dy-next{animation:fade-in var(--dur-slow) var(--ease-out) .42s backwards}.dy-answer{align-items:center;gap:16px;display:flex}.dy-answer .cover{box-shadow:0 12px 32px #00000080}.dy-answer-text{min-width:0}.dy-answer-title{font:600 22px/28px var(--font-display);letter-spacing:-.015em;overflow-wrap:anywhere;margin:0}.dy-answer-title a{color:var(--ink);text-decoration:none}.dy-answer-title a:hover{text-underline-offset:4px;text-decoration:underline}.dy-answer-by{font:400 14px/20px var(--font-sans);color:var(--ink-2);text-overflow:ellipsis;white-space:nowrap;margin:2px 0 0;overflow:hidden}.dy-answer-meta{flex-wrap:wrap;align-items:center;gap:8px;margin:8px 0 0;display:flex}.dy-answer-album{font:500 13px/18px var(--font-sans);color:var(--ink-2);text-decoration:none}.dy-answer-album:hover{color:var(--ink)}.dy-actions{flex-wrap:wrap;gap:8px;display:flex}.dy-intro{align-items:center;gap:12px;display:flex}.dy-intro-bar{background:var(--surface-2);border-radius:4px;flex:1;height:4px;position:relative;overflow:hidden}.dy-intro-label,.dy-next{font:400 13px/18px var(--font-sans);color:var(--ink-3);margin:0}.dy-next{color:var(--ink-2)}.dy-banner{border:1px solid var(--rule-strong);background:var(--surface-2);font:500 14px/20px var(--font-sans);animation:rise var(--dur-move) var(--ease-out) backwards;border-radius:12px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px;padding:12px 16px;display:flex}.dy-empty{font:400 15px/22px var(--font-sans);color:var(--ink-2);flex-wrap:wrap;align-items:center;gap:12px 16px;display:flex}.dy-empty p{margin:0}.dy-skeleton{flex-direction:column;gap:20px;display:flex}.dy-skeleton span{background:var(--surface-2);border-radius:8px;animation:1.6s ease-in-out infinite shimmer;display:block}.dy-nums{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0;display:grid}.dy-nums div{flex-direction:column-reverse;gap:2px;min-width:0;display:flex}.dy-nums dt{font:500 12px/16px var(--font-sans);color:var(--ink-3)}.dy-nums dd{font:600 26px/32px var(--font-display);font-variant-numeric:tabular-nums;color:var(--ink);align-items:center;gap:4px;margin:0;display:flex}.dy-streak svg{width:18px;height:18px;color:var(--gold-2)}.dy-dist{gap:6px;margin:0;padding:0;list-style:none;display:grid}.dy-dist li{font:500 13px/18px var(--font-sans);font-variant-numeric:tabular-nums;color:var(--ink-2);grid-template-columns:16px minmax(0,1fr) 28px;align-items:center;gap:8px;display:grid}.dy-dist-n{place-items:center;display:grid}.dy-dist-n svg{width:14px;height:14px}.dy-dist-bar{background:var(--surface);border-radius:4px;height:16px;overflow:hidden}.dy-dist-bar span{height:100%;transform:scaleX(max(var(--w), .02));transform-origin:0;animation:dy-grow var(--dur-move) var(--ease-out) backwards;animation-delay:calc(var(--i) * 40ms);background:#ffffff2e;border-radius:4px;display:block}.dy-dist--today .dy-dist-bar span{background:var(--dy-c)}.dy-dist--today{color:var(--ink)}.dy-dist-count{text-align:right}.dy-nudge{font:400 13px/18px var(--font-sans);color:var(--ink-3);margin:0;padding:0 4px}.dy-link{color:var(--ink);text-underline-offset:3px;font-weight:500;text-decoration:underline}.dy-link:hover{color:var(--accent-hover)}.dy-how ul{font:400 14px/20px var(--font-sans);color:var(--ink-2);gap:8px;margin:0;padding-left:18px;display:grid}@keyframes dy-fill{0%{opacity:0;transform:translateY(4px)}}@keyframes dy-pop{0%{opacity:0;transform:scale(.6)}}@keyframes dy-shake{25%{transform:translate(-4px)}50%{transform:translate(4px)}75%{transform:translate(-2px)}}@keyframes dy-grow{0%{transform:scaleX(0)}}@keyframes dy-menu{0%{opacity:0;transform:scale(.98)}}@media (prefers-reduced-motion:reduce){@keyframes dy-fill{0%{opacity:0}}@keyframes dy-pop{0%{opacity:0}}@keyframes dy-shake{}@keyframes dy-grow{0%{opacity:0}}@keyframes dy-menu{0%{opacity:0}}.dy-secs-open{transition:none}}}@layer utilities;
