/* Shared typography for every zodiac. NeoDGM v1.601 / SIL OFL-1.1. */
@font-face{font-family:FortunePixel;src:url(pixel-korean.woff2) format('woff2');font-style:normal;font-weight:400;font-display:swap}
:root{--fortune-font-pixel:FortunePixel,monospace;--fortune-font-body:Round,sans-serif;--fortune-navy:#081241;--fortune-blue:#2387ff;--fortune-yellow:#ffdf2d;--fortune-paper:#fffdf5;--fortune-ui-size:16px;--fortune-title-size:32px}
.main-date,.result-date,.result-hero h1,.result-zodiac-label,.ticket-heading,.year-ticket,.choose-hint,.pixel-button,.text-button,.return-note,.commute-copy,.commute-status,#share-preview h2,.main-cta-label,.machine-selection-label{font-family:var(--fortune-font-pixel);font-weight:400;font-style:normal;font-synthesis:none;letter-spacing:0}
.main-date,.result-date{font-size:16px}
.result-hero h1{font-size:32px;line-height:1.25}
.result-zodiac-label{position:absolute;left:26%;top:35.5%;width:48%;height:7%;background:var(--fortune-paper);display:flex;align-items:center;justify-content:center;font-size:16px;white-space:nowrap}
.ticket-heading{font-size:24px;line-height:1.4}.ticket-heading span{font-size:16px;margin:0 5px}
.year-ticket strong{font-family:var(--fortune-font-pixel);font-size:16px;font-weight:400;letter-spacing:0;line-height:1.25;padding:5px 9px}
.year-ticket span{font-size:16px;line-height:1.6}.year-ticket{padding-left:15px;padding-right:15px;min-height:128px}
.pixel-button,.text-button{font-size:16px;line-height:1.4}.choose-hint,.return-note{font-size:16px;line-height:1.5}
.dog-summary{font-family:var(--fortune-font-pixel);font-size:16px;line-height:1.6;letter-spacing:0;font-weight:400}
.commute-brand{font-size:32px;font-weight:400;letter-spacing:0}.commute-copy h1{font-size:24px;line-height:1.4;font-weight:400}.commute-copy p{font-size:16px}
#share-preview h2{font-size:24px;line-height:1.4;letter-spacing:0;font-weight:400}
.main-cta-label{position:absolute;left:8%;right:7%;top:20%;bottom:18%;background:#ffe65a;display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--fortune-navy);pointer-events:none}
.machine-selection-label{position:absolute;left:32%;top:77.5%;width:39%;height:3.3%;background:var(--fortune-paper);display:flex;align-items:center;justify-content:center;font-size:16px;pointer-events:none;line-height:1}
@media(max-width:359px){.main-cta-label{font-size:16px}.result-hero h1{font-size:24px}.ticket-heading{font-size:16px}.year-ticket{padding:15px 13px 25px}.commute-copy h1{font-size:16px}}
/* Fixed masks fully cover the original bitmap date before drawing the live date. */
.main-date{right:5.5%;top:2.5%;width:27%;height:4.5%;display:flex;align-items:center;justify-content:flex-end;padding:0 4px;background:var(--fortune-paper)}
.result-date{width:25%;height:6%;display:flex;align-items:center;justify-content:flex-end;background:var(--fortune-paper)}
.result-zodiac-label{left:32%;width:36%}
@media(max-width:359px){.result-zodiac-label{left:31%;width:38%;font-size:14px}}

/* Review comments: one 0.9× change for the same headline, +0.2em left inset on every ticket body. */
.result-hero h1{font-size:28.8px}.year-ticket span{padding-left:.2em;box-sizing:border-box}@media(max-width:359px){.result-hero h1{font-size:21.6px}}
/* Match the printed label to the true center of the paper, not its right edge. */
.machine-selection-label{left:29.5%;width:40.5%;top:77.4%;height:3.5%;text-align:center;padding:0;justify-content:center;align-items:center}
.zodiac-choice{position:absolute;left:calc((74 + var(--col)*83)/484*100%);top:calc((342 + var(--row)*112)/982*100%);width:calc(83/484*100%);height:calc(112/982*100%);border:3px solid transparent;border-radius:12px;background:transparent;text-decoration:none}
.zodiac-choice:hover{background:#ffe34420}.zodiac-choice.selected{border-color:#ffda22;box-shadow:0 0 0 1px #fff8ae inset}
.zodiac-choice.selected:after{content:'';position:absolute;top:-12px;left:50%;transform:translateX(-50%);width:32px;height:19px;background:url(fortune-selection-crown.webp) center/contain no-repeat;image-rendering:pixelated}

/* One discrete step per 450ms, left-to-right, then the next row. */
.main-art[data-scanning=true] .zodiac-choice.selected{border-color:transparent;box-shadow:none}
.main-art[data-scanning=true] .zodiac-choice.selected:after{display:none}
.main-art[data-scanning=true] .zodiac-choice.is-preview{border-color:#ffda22;box-shadow:0 0 0 1px #fff8ae inset}
.main-art[data-scanning=true] .zodiac-choice.is-preview:after{content:'';display:block;position:absolute;top:-12px;left:50%;transform:translateX(-50%);width:32px;height:19px;background:url(fortune-selection-crown.webp) center/contain no-repeat;image-rendering:pixelated}

/* Approved "번개 톡톡": keep the selected border still and spark only at its edges. */
.zodiac-sparks{display:none;position:absolute;inset:-3px;pointer-events:none;z-index:1}
.main-art[data-scanning=false] .zodiac-choice.selected{z-index:2}
.main-art[data-scanning=false] .zodiac-choice.selected .zodiac-sparks{display:block}
.main-art[data-scanning=false] .zodiac-choice.selected:before{content:'';position:absolute;inset:-3px;border-radius:9px;pointer-events:none;animation:zodiac-corner-glint 2.6s steps(1,end) infinite}
.zodiac-spark{position:absolute;width:13px;height:21px;background:#ffdf2d;clip-path:polygon(43% 0,85% 0,61% 34%,100% 34%,28% 100%,43% 58%,0 58%);filter:drop-shadow(2px 1px 0 #ffcd14);opacity:0;animation:zodiac-spark-pop 2.6s steps(1,end) infinite}
.zodiac-spark.one{left:-8px;top:10%;--spark-turn:-32deg}
.zodiac-spark.two{right:-9px;top:20%;--spark-turn:32deg;animation-delay:-.65s;background:#37cfff}
.zodiac-spark.three{right:-8px;bottom:5%;--spark-turn:125deg;animation-delay:-1.3s}
.zodiac-spark.four{left:-8px;bottom:11%;--spark-turn:-128deg;animation-delay:-1.95s;background:#37cfff}
@keyframes zodiac-spark-pop{0%,2%,32%,100%{opacity:0;transform:rotate(var(--spark-turn)) scale(.7)}3%,12%,23%{opacity:1;transform:rotate(var(--spark-turn)) scale(1)}9%,18%,28%{opacity:.65;transform:rotate(var(--spark-turn)) scale(.85)}}
@keyframes zodiac-corner-glint{0%,25%,50%,75%,100%{box-shadow:none}3%,28%,53%,78%{box-shadow:inset 2px 0 #fffbe4,inset -2px 0 #fffbe4}}
@media(prefers-reduced-motion:reduce){.zodiac-spark{animation:none;opacity:1;transform:rotate(var(--spark-turn))}.main-art[data-scanning=false] .zodiac-choice.selected:before{animation:none;box-shadow:none}}

/* Preserve the intentionally stepped pixel edges in the saved ticket preview. */
#share-preview #share-image{image-rendering:pixelated;border-radius:0}
/* The selector art ends at its rounded edge, with no viewport-height paper tail. */
.dog-app:has([data-fortune-screen=main]:not([hidden])){min-height:0;padding-bottom:0;background:transparent}
/* Official live-site wordmark; the mask covers the old baked illustration lettering. */
.brand-home{position:absolute;z-index:8;display:flex;align-items:center;background:var(--fortune-paper);text-decoration:none;cursor:pointer}
.brand-home img{display:block;width:100%;height:auto;max-height:100%;object-fit:contain;object-position:left center;image-rendering:auto}
.brand-home-main{left:5.6%;top:1.4%;width:33%;height:5.4%;padding:4px}
.brand-home-result{left:14%;top:2%;width:30%;height:10%;padding:4px 5px}
.machine-home{position:absolute;z-index:8;display:block;cursor:pointer;border-radius:4px}
.machine-home-main{left:28%;top:27.2%;width:49%;height:4.6%}
.machine-home-result{left:26%;top:16.6%;width:48%;height:8.3%}
.machine-home:hover{background:#fff4;box-shadow:inset 0 0 0 2px #ffd536}
/* Click the character, rather than navigating away with the whole machine. */
.mascot-poke{position:absolute;left:32%;top:44%;width:36%;height:28%;z-index:5;pointer-events:auto;border:0;background:transparent;padding:0;cursor:pointer;border-radius:12px}
[data-printer-state=printing] .mascot-poke{visibility:hidden}
.receipt-character{transform-origin:50% 61%}
.receipt-strip:has(.mascot-poke:hover) .receipt-character{filter:drop-shadow(0 0 3px #ffe05d)}
.mascot-reaction{position:absolute;z-index:6;left:65%;top:49%;transform:translateY(-100%);max-width:32%;padding:6px 7px;border:2px solid #081241;background:#fff3a3;box-shadow:2px 3px 0 #d9e1e8;color:#081241;font-family:var(--fortune-font-pixel);font-size:12px;line-height:1.4;white-space:nowrap;pointer-events:none}
/* Pixel-cut frames, physical press depth and compact action icons. */
.action-button{--action-fill:linear-gradient(#fffef8,#edf5ff);position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;gap:9px;min-height:58px;padding:12px 10px;border:0;border-radius:0;background:transparent;box-shadow:none;filter:drop-shadow(0 4px 0 #c7d5e4);color:#081241;transition:transform .12s ease,filter .12s ease;text-decoration:none}
.action-button:before,.action-button:after{content:'';position:absolute;pointer-events:none;clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 9px,100% calc(100% - 9px),calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px),0 9px)}
.action-button:before{inset:0;z-index:-2;background:#081241}
.action-button:after{inset:2px;z-index:-1;background:var(--action-fill);box-shadow:inset 0 2px 0 #fffc,inset 0 -3px 0 #b8cbe966}
.action-button .action-icon{display:grid;place-items:center;flex:none;width:27px;height:30px;color:#1465c6}
.action-icon svg{display:block;width:23px;height:23px}
.action-button .action-label{font-family:var(--fortune-font-pixel);font-weight:400;font-size:clamp(14px,3.8vw,16px);line-height:1.5;word-break:keep-all}
.action-button.action-share{--action-fill:linear-gradient(100deg,#fff095,#ffde32 70%);min-height:64px;filter:drop-shadow(0 4px 0 #c7a83e)}
.action-share .action-icon{width:33px;height:33px;background:#fff6b0;color:#081241;border:1px solid #ebc52d;box-shadow:inset 0 1px 0 #fff}
.action-button.action-copy{--action-fill:linear-gradient(#fffefc,#f0f2ff)}
.action-button.action-back{--action-fill:linear-gradient(#fffef9,#f2f6fc);min-height:56px}
.action-back .action-icon{color:#647ea6}
.action-button:hover:not(:disabled){transform:translateY(-2px);filter:drop-shadow(0 6px 0 #becfe2)}
.action-button:active:not(:disabled){transform:translateY(3px);filter:drop-shadow(0 1px 0 #becfe2)}
.action-button:disabled{opacity:.62;cursor:wait}
@media(prefers-reduced-motion:reduce){.action-button{transition:none}}

/* Native 16px font grid: fractional scaling blurs the bitmap glyphs. */
.result-hero h1{font-size:32px;line-height:1.25}
.commute-copy h1{font-size:32px;line-height:1.25;white-space:normal;overflow-wrap:normal}
.commute-copy p,.action-button .action-label{font-size:16px;line-height:1.5}
.result-zodiac-label{background:transparent}
.receipt-character{z-index:2}
.result-zodiac-label{z-index:3}
.action-button{--action-fill:#edf5ff;gap:8px}
.action-button:before,.action-button:after{clip-path:polygon(8px 0,calc(100% - 8px) 0,calc(100% - 8px) 4px,calc(100% - 4px) 4px,calc(100% - 4px) 8px,100% 8px,100% calc(100% - 8px),calc(100% - 4px) calc(100% - 8px),calc(100% - 4px) calc(100% - 4px),calc(100% - 8px) calc(100% - 4px),calc(100% - 8px) 100%,8px 100%,8px calc(100% - 4px),4px calc(100% - 4px),4px calc(100% - 8px),0 calc(100% - 8px),0 8px,4px 8px,4px 4px,8px 4px)}
.action-button.action-share{--action-fill:#ffe34a}
.action-button.action-copy,.action-button.action-back{--action-fill:#f2f6ff}
.action-button .action-icon{width:32px;height:32px}
.action-button .action-icon svg{display:block;width:32px;height:32px;shape-rendering:crispEdges}
.action-button.action-share .action-icon{width:32px;height:32px;border:0;background:transparent;box-shadow:none}
@media(max-width:359px){.commute-copy h1{font-size:32px}.result-hero h1{font-size:32px}.action-button{gap:6px}.action-button .action-label{font-size:16px}}
/* Status uses the native pixel grid as well, instead of a 12px reduction. */
.dog-app .printer-controls{font-size:16px;line-height:1.5}

.share-hook{text-align:center;font-family:var(--fortune-font-pixel);font-size:16px;line-height:1.5;color:var(--fortune-navy);padding:12px 20px 0;margin:16px 0 0;word-break:keep-all}
.commute-scene>.commute-skip{top:auto;bottom:max(28px,env(safe-area-inset-bottom));left:20%;width:60%;min-height:48px;font-family:var(--fortune-font-pixel);font-size:16px;background:#fffdf5;border:2px solid #081241;border-radius:0;box-shadow:3px 3px 0 #081241}

/* Return visit and ticket reactions: the same small pixel vocabulary. */
.remembered-choice{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0;padding:11px 16px;border-bottom:2px solid #d9e9f2;background:#fff8d5;font-family:var(--fortune-font-pixel);font-size:12px;line-height:1.6;word-break:keep-all}
.remembered-choice a{color:#1465c6;white-space:nowrap;text-underline-offset:3px}.remembered-choice[hidden]{display:none}
.selected-ticket-panel{position:relative;margin:25px 20px 0;padding:20px 18px 0;border:2px solid var(--fortune-navy);background:#fff8cb;box-shadow:4px 5px 0 #dce5ee;font-family:var(--fortune-font-pixel);color:var(--fortune-navy)}
.selected-ticket-panel[hidden]{display:none}.selected-ticket-top{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}.selected-ticket-kicker{font-size:12px;color:#517393;letter-spacing:1px}.selected-ticket-top strong{font-size:16px;line-height:1.5;font-weight:400;background:#ffe34a;padding:4px 8px}
#selected-ticket-copy{font-size:16px;line-height:1.7;text-align:left;word-break:keep-all;overflow-wrap:anywhere;margin:17px 0 12px}.selected-ticket-panel .share-hook{font-size:12px;line-height:1.7;color:#547390;padding:0;margin:0 0 17px;text-align:left}
.ticket-reaction{margin:0 -18px;padding:16px 18px;background:#fffdf5;border-top:2px dashed #c3ddec}.ticket-reaction h3{font-size:16px;line-height:1.5;font-weight:400;margin:0 0 12px}.reaction-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.reaction-options button{font-family:var(--fortune-font-pixel);font-size:16px;line-height:1.5;min-height:46px;border:2px solid var(--fortune-navy);background:#edf5ff;color:var(--fortune-navy);box-shadow:2px 3px 0 #c7d5e4;cursor:pointer}.reaction-options button[aria-pressed=true]{background:#ffe34a;box-shadow:inset 2px 2px 0 #e4b91f}.reaction-options button:active{transform:translateY(2px)}
#yesterday-reaction{font-size:12px;line-height:1.7;color:#577695;margin:12px 0 0;word-break:keep-all}#yesterday-reaction{color:var(--fortune-navy)}
.remember-setting{padding:21px 20px 3px;font-family:var(--fortune-font-pixel)}.remember-setting label{display:flex;align-items:center;gap:10px;font-size:16px;line-height:1.6;cursor:pointer}.remember-setting input{appearance:none;flex:none;width:20px;height:20px;margin:0;border:2px solid var(--fortune-navy);border-radius:0;background:#fffdf5;display:grid;place-items:center;cursor:pointer}.remember-setting input:checked{background:#ffe34a}.remember-setting input:checked:after{content:'✓';color:#081241;font-family:var(--fortune-font-pixel);font-size:16px;line-height:1}.remember-setting input:disabled{opacity:.4;cursor:default}.remember-setting p{font-size:12px;line-height:1.7;color:#577695;margin:6px 0 0 30px;word-break:keep-all}
.result-body .choose-hint{font-size:12px;color:#577695;margin-top:14px;margin-bottom:10px}.reaction-options button:focus-visible,.remember-setting input:focus-visible{outline:3px solid #2387ff;outline-offset:3px}
@media(max-width:359px){.selected-ticket-panel{padding:16px 13px 0}.ticket-reaction{margin:0 -13px;padding:14px 13px}.remember-setting label{font-size:14px}.selected-ticket-top strong{font-size:14px}}