:root{font-family:Trebuchet MS,Noto Sans TC,Microsoft JhengHei,system-ui,sans-serif;color:#372058;background:#eee5ff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 91% 4%,#fff2bb 0,#fff2bb 7rem,transparent 7.1rem),radial-gradient(circle at 4% 66%,#dfd0fa 0,#dfd0fa 12rem,transparent 12.1rem),#eee5ff}body:has(.details-dialog[open]){overflow:hidden}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}:focus-visible{outline:4px solid #ef655b;outline-offset:3px}a{color:inherit}.page{max-width:760px;margin:auto;padding:0 clamp(16px,4vw,32px) 32px}.hero-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px 12px 25px 0}.hero-heading h1{margin:0;font-size:clamp(3.3rem,6.9vw,5.8rem);font-weight:1000;line-height:1.13;letter-spacing:-.035em}.highlight{position:relative;z-index:0;white-space:nowrap}.highlight:before{position:absolute;z-index:-1;inset:59% -2% 4% -3%;border-radius:12px 50px 14px 25px;background:#ffda70;content:"";transform:rotate(-2deg);animation:marker-swipe .55s cubic-bezier(.16,1,.3,1) both}@keyframes marker-swipe{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}.question-mark{color:#8053d0}.heading-doodle{flex:0 0 clamp(90px,12vw,146px);margin-right:clamp(0px,7vw,75px);transform:rotate(10deg)}.heading-doodle svg{width:100%;height:auto;display:block}.play-area{display:grid;grid-template-columns:minmax(0,1fr);align-items:start;gap:clamp(18px,3vw,26px)}.controls{position:relative;display:flex;flex-direction:column;min-width:0;padding:clamp(20px,3vw,30px);border:3px solid #3d206e;border-radius:34px;background:#fffaff;box-shadow:8px 10px #d5c1f4}.controls-row{display:flex;align-items:center;flex-wrap:nowrap;gap:12px}.stamp{position:absolute;top:-22px;right:-12px;color:#ef7d86;font-size:55px;line-height:1;transform:rotate(15deg)}.location-filter{flex:1 1 0;min-width:0;margin:0;padding:4px;border:0;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-padding-inline:24px;scrollbar-width:none}.location-filter::-webkit-scrollbar{display:none}.location-filter[data-fade-right=true]{-webkit-mask-image:linear-gradient(to right,black calc(100% - 24px),transparent);mask-image:linear-gradient(to right,black calc(100% - 24px),transparent)}.location-filter[data-fade-left=true]{-webkit-mask-image:linear-gradient(to right,transparent,black 24px);mask-image:linear-gradient(to right,transparent,black 24px)}.location-filter[data-fade-left=true][data-fade-right=true]{-webkit-mask-image:linear-gradient(to right,transparent,black 24px,black calc(100% - 24px),transparent);mask-image:linear-gradient(to right,transparent,black 24px,black calc(100% - 24px),transparent)}.location-options{display:flex;width:max-content;flex-wrap:nowrap;gap:9px}.location-filter[data-overflow=true] .location-options:after{flex:0 0 24px;content:""}.location-option{flex:0 0 auto;height:44px;padding:8px 14px;border:2px solid #9c80d0;border-radius:999px;background:#f8f1ff;color:#442478;font-size:14px;font-weight:800;white-space:nowrap;transition:background-color .18s,border-color .18s,transform .18s}.location-option:focus-visible{outline-offset:0}.location-option:hover:not(:disabled){background:#e4d3ff;transform:translateY(-2px)}.location-option.active{border-color:#3d206e;background:#6841b2;color:#fff;animation:place-pick .22s cubic-bezier(.16,1,.3,1)}.location-option:disabled{opacity:.55}@keyframes place-pick{0%{transform:scale(.94)}to{transform:scale(1)}}.data-state{margin-top:11px}.state-message{margin:0;line-height:1.55}.state-message{font-weight:800}.state-error{padding:14px 16px;border:2px solid #a72f53;border-radius:17px;background:#fff0f3}.state-error,.empty-hint{animation:feedback-enter .24s cubic-bezier(.16,1,.3,1) both}@keyframes feedback-enter{0%{opacity:.65;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.state-error strong{font-size:18px}.state-error p{margin:6px 0 12px;line-height:1.5}.retry-button{padding:9px 14px;border:2px solid #3d206e;border-radius:11px;background:#fff;color:#3d206e;font-weight:850}.retry-button:hover{background:#ffda70}.empty-hint{margin:14px 0 0;font-weight:800;line-height:1.6}.wheel-panel{min-width:0;padding:12px clamp(16px,3vw,34px) 27px;border:3px solid #3d206e;border-radius:39px;background:#7953c8;background-image:radial-gradient(#986fdd 1.4px,transparent 1.4px);background-size:23px 23px;box-shadow:8px 10px #cbb1ef}.wheel-scene{position:relative;padding:43px 0 5px}.pointer{position:absolute;z-index:3;top:6px;left:50%;width:59px;height:70px;transform:translate(-50%);filter:drop-shadow(2px 4px 0 #4b2780)}.pointer svg{display:block;width:100%;height:100%}.wheel-frame{position:relative;width:min(100%,438px);aspect-ratio:1;margin:0 auto;overflow:hidden;border:clamp(8px,1.2vw,12px) solid #fdf6ff;border-radius:50%;background:#d1b8f3;box-shadow:0 7px #3d206e,0 17px 23px #3d206e55}.wheel{display:block;width:100%;height:100%;transform-origin:center center}.wheel-animated,.wheel-animated .counter-rotate{transition:transform 4.8s cubic-bezier(.11,.73,.11,1)}.wheel-label{fill:#3d206e;font-family:Trebuchet MS,Noto Sans TC,Microsoft JhengHei,system-ui,sans-serif;font-size:15px;font-weight:950;paint-order:stroke;stroke:#ffffff52;stroke-width:1px}.wheel-compact .wheel-label{font-size:12px}.wheel-label-light{fill:#fff;stroke:#5133994d}.wheel-action{position:absolute;z-index:2;top:50%;left:50%;display:flex;width:36%;aspect-ratio:1;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:8px;border:4px solid #3d206e;border-radius:50%;background:#ffda70;color:#372058;box-shadow:0 5px #3d206e;font-size:clamp(14px,1.6vw,18px);font-weight:950;line-height:1.25;text-align:center;transform:translate(-50%,-50%);transition:transform .18s,box-shadow .18s,background-color .18s}.wheel-action-mark{font-size:23px;line-height:1}.wheel-action:hover:not(:disabled){background:#ffcb51;transform:translate(-50%,-53%);box-shadow:0 8px #3d206e}.wheel-action:active:not(:disabled){transform:translate(-50%,-46%);box-shadow:0 1px #3d206e}.wheel-action:disabled{cursor:wait;background:#e7d4a2;box-shadow:0 3px #3d206e}.wheel-action:focus-visible{outline:4px solid #ef655b;outline-offset:3px}.wheel-spark{position:absolute;color:#ffde75;font-size:53px;line-height:1;text-shadow:3px 4px 0 #3d206e}.wheel-spark-one{top:19%;left:0;transform:rotate(-22deg)}.wheel-spark-two{right:0;bottom:13%;font-size:37px;transform:rotate(14deg)}.wheel-stand{display:block;width:26%;height:11px;margin:6px auto 0;border-radius:50%;background:#4b28856b;filter:blur(2px)}.wheel-head{display:grid;width:min(100%,440px);min-height:112px;align-items:center;margin:3px auto 0}.wheel-head>*{grid-area:1 / 1;transition:opacity .38s cubic-bezier(.2,.8,.2,1),transform .38s cubic-bezier(.2,.8,.2,1)}.wheel-counter{min-height:64px;display:flex;align-items:center;padding:10px 14px;border:2px dashed #d9c7f6;border-radius:16px;background:#603eac;color:#fff}.wheel-head.has-result .wheel-counter{opacity:0;transform:translateY(-10px);pointer-events:none}.candidate-count{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 6px;margin:0;font-size:15px;font-weight:850;line-height:1.5}.candidate-count strong{color:#ffda70;font-size:23px}.candidate-count span{margin-left:auto;font-size:13px;font-weight:700}.wheel-placeholder{display:flex;width:100%;height:100%;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#482674;font-size:clamp(17px,3vw,24px);font-weight:900;line-height:1.6;text-align:center}.placeholder-face{display:grid;width:81px;height:81px;place-items:center;border:3px solid #4b2885;border-radius:50%;background:#ffda70;font-size:67px;line-height:.8;transform:rotate(-13deg)}.result-card{display:flex;min-height:112px;align-items:center;gap:17px;padding:16px 19px;border:3px solid #3d206e;border-radius:24px;background:#fff8e9;box-shadow:0 6px #482674;opacity:0;pointer-events:none;transform:translateY(10px)}.wheel-head.has-result .result-card{opacity:1;pointer-events:auto;transform:translateY(0)}.result-icon{display:grid;flex:0 0 55px;width:55px;height:55px;place-items:center;border:2px solid #3d206e;border-radius:17px;background:#ffc9a4;font-size:35px;transform:rotate(-9deg)}.result-copy{min-width:0;overflow-wrap:anywhere}.result-lead{margin:0 0 2px;color:#694497;font-size:13px;font-weight:900}.result-copy h2{margin:0;font-size:clamp(21px,2.4vw,29px);line-height:1.3}.result-place{margin:4px 0 0;font-size:14px;font-weight:700;line-height:1.5}.result-info{display:grid;flex:0 0 42px;width:42px;height:42px;place-items:center;margin-left:auto;border:2px solid #3d206e;border-radius:50%;background:#ffda70;color:#3d206e;font-size:23px;font-weight:950;font-style:italic;line-height:1;transition:transform .18s,background-color .18s}.result-info:hover{background:#ffcb51;transform:rotate(-10deg) scale(1.08)}.result-info:active{transform:scale(.94)}.details{padding:clamp(23px,3vw,36px);border:3px solid #3d206e;border-radius:28px;background:#fffcf5}.details-dialog{width:min(760px,calc(100vw - 32px));max-width:calc(100vw - 32px);max-height:90vh;max-height:90dvh;margin:auto;overflow-y:auto;color:#372058;box-shadow:8px 10px #241140}.details-dialog::backdrop{background:#241140b8}.details-dialog[open]{animation:dialog-enter .32s cubic-bezier(.16,1,.3,1) both}.details-dialog[open]::backdrop{animation:backdrop-enter .26s ease-out both}@keyframes dialog-enter{0%{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes backdrop-enter{0%{opacity:0}to{opacity:1}}.details-head{position:sticky;z-index:1;top:0;display:flex;align-items:center;gap:16px;padding-bottom:12px;background:#fffcf5}.details-head>span{display:grid;flex:0 0 48px;width:48px;height:48px;place-items:center;border-radius:50%;background:#ffdc70;font-size:30px}.details-close{display:grid;flex:0 0 44px;width:44px;height:44px;place-items:center;margin-left:auto;border:2px solid #3d206e;border-radius:50%;background:#eee5ff;color:#3d206e;font-size:27px;font-weight:900;line-height:1;transition:background-color .18s,transform .18s}.details-close:hover{background:#ffda70}.details-close:active{transform:scale(.92)}.details h2{margin:0;font-size:clamp(20px,2.3vw,27px);line-height:1.35}.details-head p{margin:5px 0 0;line-height:1.6}.details-layout{margin-top:27px}.details-layout.has-photo{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:start;gap:28px}.shop-image{display:grid;min-width:0;justify-items:center;margin:0}.shop-image-badge{position:relative;display:grid;width:min(100%,260px);aspect-ratio:1;place-items:center;border:4px solid #3d206e;border-radius:50%;background:#dac9fa;box-shadow:6px 8px #cbb1ef}.shop-image-badge:before{position:absolute;inset:9px;border:2px dashed #8d69c8;border-radius:50%;content:""}.shop-image-badge:after{position:absolute;top:15px;right:-9px;display:grid;width:41px;height:41px;place-items:center;border:2px solid #3d206e;border-radius:50%;background:#ffda70;color:#3d206e;content:"✦";font-size:22px;transform:rotate(13deg)}.shop-image-inner{position:relative;display:grid;width:86%;aspect-ratio:1;place-items:center;border:2px solid #3d206e;border-radius:50%;background:#fffaff}.shop-image img{display:block;width:72%;height:72%;object-fit:contain}.shop-image-fallback{max-width:9ch;color:#3d206e;font-weight:850;line-height:1.5;text-align:center}.shop-image figcaption{margin-top:15px;color:#654c7d;font-size:12px;font-weight:700;text-align:center}.details-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:20px 45px}.has-photo .details-grid{grid-template-columns:1fr;gap:18px}.details h3{margin:0 0 9px;color:#7651ae;font-size:14px}.details-grid p{margin:0;line-height:1.7;overflow-wrap:anywhere}.hours{margin:0}.hours div{display:flex;gap:13px;padding:5px 0;line-height:1.5}.hours dt{flex:0 0 36px;font-weight:900}.hours dd{margin:0;overflow-wrap:anywhere}.shop-note{grid-column:1 / -1;padding-top:18px;border-top:2px dashed #dcccee}.manage-trigger{display:flex;flex:0 0 auto;height:44px;align-items:center;justify-content:space-between;gap:12px;margin-left:auto;padding:6px 12px;border:2px solid #9c80d0;border-radius:17px;background:#f8f1ff;color:#442478;text-align:left;transition:background-color .18s,border-color .18s,transform .18s,box-shadow .18s}.manage-trigger:hover{background:#eee2ff;transform:translateY(-2px);box-shadow:0 3px #cbb1ef}.manage-trigger[aria-expanded=true]{border-color:#3d206e;background:#eee2ff}.manage-trigger-copy{display:flex;align-items:center;gap:5px;white-space:nowrap;font-size:14px;font-weight:900}.manage-star{color:#7953c8;font-size:18px;vertical-align:middle}.manage-caret{display:grid;width:22px;height:22px;place-items:center;transition:transform .22s}.manage-caret svg{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.manage-trigger[aria-expanded=true] .manage-caret{transform:rotate(180deg)}.manage{min-width:0;margin-top:17px;padding-top:15px;border-top:2px dashed #dcccee;animation:manage-unfold .3s cubic-bezier(.16,1,.3,1) both}.manage[hidden]{display:none}@keyframes manage-unfold{0%{opacity:.6;clip-path:inset(0 0 100% 0);transform:translateY(-6px)}to{opacity:1;clip-path:inset(0 0 0 0);transform:translateY(0)}}.manage-body>p{margin:0 0 16px;font-size:13px;line-height:1.6}.manage-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:9px;margin-bottom:13px}.manage-heading button{min-height:42px;padding:7px 13px;border:2px solid #7651ae;border-radius:10px;background:#eee2ff;color:#442478;font-size:13px;font-weight:850}.manage-heading button:hover:not(:disabled){background:#decaff}.manage-heading button:disabled{opacity:.5}.shop-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));max-height:min(52vh,420px);gap:8px;overflow-y:auto;overscroll-behavior:contain;padding:3px 4px 7px 0}.shop-row{display:flex;min-width:0;align-items:flex-start;gap:11px;padding:12px;border:1px solid #e0d3f2;border-radius:12px;background:#fcf8ff;cursor:pointer;transition:background-color .18s,border-color .18s,transform .18s}.shop-row:hover:not(:has(input:disabled)){border-color:#ae92db;transform:translate(2px)}.shop-row:has(input:checked){border-color:#ae92db;background:#f2eafa}.shop-row input{flex:0 0 20px;width:20px;height:20px;margin:2px 0 0;accent-color:#7445c7;cursor:pointer}.shop-row-copy{display:grid;min-width:0;gap:3px;overflow-wrap:anywhere}.shop-name{font-size:15px;font-weight:900}.shop-area{color:#654c7d;font-size:12px;line-height:1.5}.site-footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 25px;padding:32px 2px 0;font-size:12px;font-weight:700;line-height:1.6}.site-footer a{text-underline-offset:3px}.site-footer a:hover{color:#764ac8}@media(max-width:860px){.hero-heading{padding-top:24px}.controls{padding:25px}.wheel-panel{padding-right:20px;padding-left:20px}.wheel-frame{width:min(100%,440px)}.details-layout.has-photo{grid-template-columns:1fr}}@media(max-width:640px){.manage-trigger{width:44px;height:44px;justify-content:center;padding:0}.manage-label,.manage-caret{display:none}}@media(max-width:540px){.page{padding:0 16px 28px}.hero-heading{gap:0;padding:25px 0 22px}.hero-heading h1{font-size:clamp(3rem,12vw,4rem)}.heading-doodle{align-self:flex-start;flex-basis:77px;margin:11px 0 0 -19px}.controls{padding:21px;border-radius:26px;box-shadow:5px 6px #d5c1f4}.controls-row{gap:10px}.stamp{top:-14px;right:-5px;font-size:38px}.location-options{gap:7px}.location-option{padding:7px 11px;font-size:13px}.data-state{margin-top:10px}.wheel-panel{padding:10px 11px 22px;border-radius:30px;box-shadow:5px 6px #cbb1ef}.wheel-scene{padding-top:41px}.wheel-spark-one{left:-2px;font-size:31px}.wheel-spark-two{right:0;font-size:26px}.pointer{top:8px;width:51px;height:62px}.wheel-frame{width:min(100%,370px)}.wheel-label{font-size:15px}.wheel-action{border-width:3px}.wheel-action-mark{font-size:20px}.result-card{min-height:96px;gap:12px;padding:12px;border-radius:19px}.result-icon{flex-basis:48px;width:48px;height:48px;font-size:30px}.result-info{flex-basis:40px;width:40px;height:40px}.details{padding:20px}.details-head{gap:10px}.details-layout{margin-top:20px}.shop-image-badge{width:min(100%,250px)}.details-grid{grid-template-columns:1fr;gap:20px}.shop-note{grid-column:auto}.shop-list{grid-template-columns:1fr}.site-footer{padding-top:25px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}.details-dialog::backdrop{animation-duration:.01ms!important}}
