.usage-guide-overlay{position:fixed;inset:0;z-index:1100;display:grid;place-items:center;padding:20px;background:#173f3c99;backdrop-filter:blur(5px);box-sizing:border-box}.usage-guide-dialog{width:min(100%,520px);max-height:calc(100dvh - 40px);overflow:auto;overscroll-behavior:contain;background:#fffdf6;color:#253638;padding:22px 26px 24px;border-radius:26px;box-shadow:0 20px 70px #153c3c50;box-sizing:border-box;font-family:inherit}.usage-guide-head{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#07565b;font-size:13px;font-weight:700}.usage-guide-close{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;min-height:40px;padding:8px 12px;margin:0;border:0;border-radius:10px;background:transparent;color:#365b54;font:600 13px/1.4 system-ui;cursor:pointer;box-sizing:border-box}.usage-guide-progress{display:flex;gap:8px;margin:4px 0 14px}.usage-guide-progress button{display:grid;place-items:center;flex:0 0 38px;box-sizing:border-box;padding:0;margin:0;appearance:none;width:38px;height:38px;border:1px solid #c9dad2;border-radius:50%;background:white;color:#527168;font:700 13px/1 system-ui;cursor:pointer}.usage-guide-progress button[aria-current]{background:#07565b;color:white;border-color:#07565b}.usage-guide-demo{position:relative;min-height:190px;border:1px solid #f2d6c3;border-radius:18px;background:#fff0e4;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;overflow:hidden;padding:32px 18px 14px;box-sizing:border-box}.ug-demo-label{position:absolute;top:10px;left:12px;color:#8b6049;font-size:10px;letter-spacing:.05em}.usage-guide-demo .visit-stamp{width:94px;height:94px;flex-shrink:0}.ug-stamp-pair{display:flex;align-items:center;gap:8px}.ug-stamp-pair .onsen{animation:ug-bob 3s ease-in-out infinite;transform:rotate(-12deg)}.ug-stamp-pair .gourmet{animation:ug-bob 3s 1.2s ease-in-out infinite;transform:rotate(9deg)}.ug-heart{font-size:25px;color:#e18c65;animation:ug-heart 3s ease-in-out infinite}.ug-demo-caption{font-size:12px;color:#785541;font-weight:600;text-align:center}.usage-guide-dialog h2{font-size:clamp(19px,4.8vw,24px);line-height:1.55;margin:18px 0 10px;color:#07565b;letter-spacing:.01em}.usage-guide-text{font-size:14px;line-height:1.9;margin:0 0 10px}.usage-guide-note{font-size:12px;line-height:1.7;color:#65786d;margin:0}.usage-guide-controls{display:flex;justify-content:flex-end;margin:6px 0}.usage-guide-motion{border:0;background:transparent;color:#527466;padding:8px;font-family:inherit;font-size:12px;text-decoration:underline;cursor:pointer;min-height:36px}.usage-guide-preference{display:flex;align-items:center;gap:9px;font-size:14px;margin:14px 0 4px;min-height:38px;cursor:pointer}.usage-guide-preference input{width:20px;height:20px;accent-color:#07565b}.usage-guide-storage-note{font-size:11px;line-height:1.6;color:#65786d;margin:0}.usage-guide-footer{display:flex;gap:10px;margin-top:18px}.usage-guide-footer button{min-height:46px;border-radius:999px;font-family:inherit;font-size:14px;font-weight:700;padding:12px 20px;cursor:pointer}.usage-guide-back{border:1px solid #c7d9ce;background:white;color:#436f5e}.usage-guide-next{border:0;background:#07565b;color:white;flex:1}.usage-guide-footer button:disabled{opacity:.4;cursor:default}.usage-guide-dialog button:focus-visible,.usage-guide-preference input:focus-visible{outline:3px solid #e8ae46;outline-offset:3px}.ug-register-flow{display:grid;grid-template-columns:1fr 1fr;gap:9px;width:100%}.ug-flow-step{display:flex;align-items:center;gap:6px;padding:10px 8px;border:1px solid #efd2bc;border-radius:12px;background:#fffdf6;font-size:11px;line-height:1.5;animation:ug-flow 6s ease-in-out infinite}.ug-flow-step b{box-sizing:border-box;padding:0;margin:0;font:700 12px/1 system-ui;display:grid;place-items:center;flex-shrink:0;width:22px;height:22px;background:#ffe0c8;border-radius:50%;color:#07565b}.ug-flow-step:nth-child(2){animation-delay:1.5s}.ug-flow-step:nth-child(3){animation-delay:3s}.ug-flow-step:nth-child(4){animation-delay:4.5s}.ug-flow-complete{background:#07565b;color:white}.ug-demo-search{display:flex;align-items:center;gap:10px;background:white;border:1px solid #edcdb5;width:88%;padding:9px 12px;border-radius:99px;font-size:13px;box-sizing:border-box}.ug-search-typing{display:inline-block;white-space:nowrap;overflow:hidden;animation:ug-type 6s steps(7,end) infinite;max-width:180px}.ug-demo-chips{display:flex;gap:7px;font-size:10px}.ug-demo-chips span{background:#07565b;color:white;border-radius:99px;padding:4px 10px}.ug-demo-map{position:relative;width:95%;height:77px;border-radius:10px;background:repeating-linear-gradient(25deg,#f5d6bc 0 22px,#fffaf3 23px 30px,#f5d6bc 31px 60px);overflow:hidden}.ug-demo-map i{position:absolute;width:140%;height:9px;top:30px;left:-20px;background:#fffdf6;transform:rotate(-18deg)}.ug-demo-pin{position:absolute;top:6px;left:22%;width:34px;height:40px;animation:ug-pin 6s ease-in-out infinite}.ug-pin-two{left:56%;top:30px;animation-delay:.8s}.ug-pin-three{left:77%;top:5px;animation-delay:1.6s}.ug-demo-book{width:95%;background:#fffdf6;border:1px solid #edcdb5;box-shadow:5px 4px 0 #efccb1;border-radius:5px 14px 14px 5px;padding:12px;box-sizing:border-box;text-align:center;color:#526c5f;font-size:11px}.ug-book-cells{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:8px}.ug-book-cells .visit-stamp{width:62px;height:62px;animation:ug-stamp 5s ease-in-out infinite}.ug-book-cells .gourmet{animation-delay:1.1s}.ug-empty-stamp{display:grid;place-items:center;border:1px dashed #debda5;border-radius:50%;width:54px;height:54px;color:#debda5;font-size:32px}.usage-guide-paused .usage-guide-demo *{animation-play-state:paused!important}@keyframes ug-bob{0%,100%{translate:0 2px}50%{translate:0 -7px}}@keyframes ug-heart{0%,100%{scale:1}50%{scale:1.17}}@keyframes ug-flow{0%,18%{box-shadow:0 0 0 2px #e7b354;translate:0 -2px}25%,100%{box-shadow:none;translate:0 0}}@keyframes ug-type{0%,12%{width:0}45%,100%{width:150px}}@keyframes ug-pin{0%,20%{scale:.6;opacity:.6}35%,100%{scale:1;opacity:1}}@keyframes ug-stamp{0%,12%{scale:1.2;rotate:-14deg;opacity:.5}25%,100%{scale:1;rotate:-7deg;opacity:1}}@media(max-width:480px){.usage-guide-overlay{padding:12px}.usage-guide-dialog{padding:16px 18px 20px;border-radius:22px;max-height:calc(100dvh - 24px)}.usage-guide-demo{min-height:165px;padding:30px 12px 12px}.usage-guide-demo .ug-stamp-pair .visit-stamp{width:80px;height:80px}.usage-guide-dialog h2{margin-top:14px}.usage-guide-text{font-size:13px;line-height:1.85}.ug-flow-step{font-size:10px;padding:9px 6px}}@media(prefers-reduced-motion:reduce){.usage-guide-demo *{animation:none!important;transition:none!important}}

#usage-guide-title:focus{outline:none}