@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap');
:root{--ink:#183e36;--muted:#6e8078;--paper:#f5f7f3;--line:#dce5dd;--green:#246b54;--lime:#d9efb1;--orange:#f17650}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Noto Sans KR',system-ui,sans-serif;word-break:keep-all}button,a,input{font:inherit}button{cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--orange);outline-offset:4px}button{border:0;background:none}a{color:inherit}header{max-width:1400px;margin:auto;height:94px;padding:0 48px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}#brand{text-decoration:none;display:flex;gap:12px;align-items:center;font-size:17px;letter-spacing:.5px}.brand-icon{font-size:35px;color:var(--green)}#brand strong span{display:block;font-size:9px;letter-spacing:2.5px;margin-top:2px}nav{display:flex;gap:22px;align-items:center}nav button{font-size:13px;font-weight:600}#helpBtn{border:1px solid var(--line);border-radius:50%;width:30px;height:30px}main{max-width:1304px;margin:auto;padding:42px 0 30px;min-height:calc(100vh - 160px)}footer{max-width:1304px;margin:0 auto;padding:20px 0;display:flex;justify-content:space-between;gap:15px;color:#829088;font-size:11px}footer button{font-size:11px;color:#6a7c72}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:700;display:flex;align-items:center;gap:10px}.eyebrow:before{content:'';width:7px;height:7px;background:var(--orange);border-radius:50%}.hero{display:grid;grid-template-columns:.95fr 1.05fr;gap:60px;align-items:center;padding:25px 0 34px}.hero h1{font-size:clamp(44px,4.7vw,68px);line-height:1.27;letter-spacing:-3px;margin:26px 0 22px;font-weight:900}.hero h1 em{font-style:normal;color:var(--green);position:relative}.hero p{font-size:17px;line-height:1.9;color:var(--muted);margin:0 0 30px}.primary{padding:18px 28px;background:var(--green);color:white;border-radius:14px;font-weight:700;display:inline-flex;align-items:center;gap:35px;box-shadow:0 8px 20px #246b5416}.primary:hover{background:#18543f;transform:translateY(-1px)}.secondary{padding:13px 22px;border:1px solid var(--line);border-radius:12px;background:white;font-size:14px;font-weight:600}.hero-meta{display:flex;gap:18px;font-size:12px;color:var(--muted);margin-top:20px}.collage{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:14px;transform:rotate(2deg);padding:12px}.photo-tile{position:relative;border-radius:22px;overflow:hidden;height:215px;background:#d7e3db}.photo-tile:nth-child(2){margin-top:32px}.photo-tile:nth-child(3){margin-top:-32px}.photo-tile img{width:100%;height:100%;object-fit:cover}.photo-tile:after{content:'';position:absolute;inset:40% 0 0;background:linear-gradient(transparent,#08271ab0)}.photo-tile span{position:absolute;bottom:17px;left:18px;color:white;z-index:1;font-size:14px;font-weight:600}.travel-stamp{position:absolute;z-index:2;left:37%;top:38%;background:var(--lime);border:7px solid var(--paper);border-radius:50%;width:116px;height:116px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:11px;transform:rotate(-13deg)}.travel-stamp strong{font-size:32px;line-height:1.2}.intro-strip{background:#eaf0e6;border-radius:18px;display:flex;justify-content:space-between;align-items:center;padding:22px 28px;gap:25px;margin-top:15px}.intro-strip strong{font-size:16px}.intro-strip p{font-size:13px;color:var(--muted);margin:6px 0 0;line-height:1.7}.steps{font-size:12px;color:var(--green);white-space:nowrap}.game-top{display:flex;justify-content:space-between;align-items:center}.badge{display:inline-block;background:var(--lime);border-radius:30px;padding:7px 15px;font-size:12px;font-weight:700}.round-label{font-size:12px;letter-spacing:1px;color:var(--muted)}.game-title{text-align:center;margin:22px 0 26px}.game-title h1{font-size:30px;letter-spacing:-1px;margin:0 0 9px}.game-title p{color:var(--muted);font-size:14px;margin:0}.progress{height:4px;background:#e3e9df;border-radius:9px;margin:17px 0 0;overflow:hidden}.progress i{display:block;height:100%;background:var(--green);transition:width .3s}.arena{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:30px;max-width:1100px;margin:auto}.choice{text-align:left;border:1px solid var(--line);padding:0;background:white;border-radius:22px;overflow:hidden;transition:transform .2s,box-shadow .2s;box-shadow:0 5px 20px #1c3d3405}.choice:hover{transform:translateY(-5px);box-shadow:0 14px 35px #1c3d3414;border-color:#79a187}.choice img{width:100%;height:285px;object-fit:cover;display:block}.photo-wrap{position:relative}.region-pill{position:absolute;top:17px;left:17px;border-radius:30px;padding:7px 13px;background:#ffffffeb;color:#284f40;font-size:11px}.choice-body{padding:23px 27px 25px}.city-line{display:flex;align-items:baseline;gap:10px}.city-line h2{font-size:24px;letter-spacing:-.8px;margin:0}.city-line span{font-size:12px;color:var(--muted)}.experience{font-size:17px;font-weight:600;margin:13px 0 14px;line-height:1.6;min-height:54px}.tag{font-size:11px;color:var(--green)}.pick-label{float:right;font-size:12px;color:var(--green);font-weight:700}.vs{position:absolute;top:39%;left:50%;transform:translate(-50%,-50%) rotate(-8deg);border-radius:50%;height:52px;width:52px;display:grid;place-items:center;background:var(--orange);color:white;border:5px solid var(--paper);font-size:13px;font-weight:800;pointer-events:none}.game-bottom{display:flex;justify-content:space-between;max-width:1100px;margin:20px auto 0;font-size:12px;color:var(--muted)}.game-bottom button{font-size:12px;text-decoration:underline}.game-bottom button:disabled{opacity:.3;cursor:default}.result-head{text-align:center;margin-bottom:25px}.result-head .eyebrow{justify-content:center}.result-head h1{font-size:34px;margin:12px 0}.result-head p{color:var(--muted);font-size:14px}.result-layout{max-width:1100px;display:grid;grid-template-columns:1.1fr .9fr;gap:34px;margin:auto;align-items:start}.ticket{background:white;border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:0 12px 35px #173e360b}.ticket-top{background:var(--green);color:white;padding:16px 23px;display:flex;justify-content:space-between;font-size:10px;letter-spacing:2px}.ticket-photo{width:100%;height:220px;object-fit:cover;display:block}.ticket-info{padding:25px}.ticket-city{display:flex;align-items:center;justify-content:space-between}.ticket-city h2{font-size:32px;margin:0;letter-spacing:-1px}.ticket-city p{font-size:12px;color:var(--muted);margin:5px 0}.ticket-city .plane{font-size:32px;color:var(--green)}.ticket-info>p{font-size:14px;line-height:1.7}.ticket-stub{border-top:2px dashed var(--line);padding:18px 25px;display:flex;justify-content:space-between;font-size:11px}.ticket-stub b{display:block;font-size:14px;margin-top:5px}.side-panel{background:#eaf0e6;border-radius:20px;padding:24px}.side-panel h3{margin:0;font-size:17px}.map{width:100%;height:230px;display:block}.facts{padding-left:18px;margin:0;color:#4f685a;font-size:13px;line-height:1.9}.map-note{font-size:10px;color:var(--muted);line-height:1.7;margin:5px 0 13px}.reflection{padding:21px 4px}.reflection h3{font-size:16px;margin:0 0 10px}.reflection p{font-size:13px;line-height:1.8;color:var(--muted);margin:0}.result-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.result-actions .primary{padding:15px 22px;font-size:14px;gap:15px}.name-input{display:flex;align-items:center;gap:12px;font-size:12px;margin-top:15px}.name-input input{border:1px solid var(--line);background:#fff;border-radius:8px;padding:9px;max-width:180px;color:var(--ink)}dialog{border:1px solid var(--line);border-radius:24px;padding:36px;max-width:1050px;width:calc(100% - 36px);max-height:87vh;color:var(--ink);background:var(--paper)}dialog::backdrop{background:#102b2566;backdrop-filter:blur(8px)}.close{position:absolute;right:15px;top:12px;font-size:28px;width:35px;height:35px}.dialog-intro{color:var(--muted);font-size:14px;line-height:1.8}.filter-row{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}.filter-row button{border:1px solid var(--line);border-radius:20px;padding:8px 15px;font-size:12px}.filter-row button.active{background:var(--green);color:white}.atlas-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.atlas-card{padding:0;text-align:left;background:white;border:1px solid var(--line);border-radius:14px;overflow:hidden}.atlas-card img{width:100%;height:125px;object-fit:cover;display:block}.atlas-card div{padding:12px}.atlas-card strong{font-size:15px}.atlas-card p{font-size:11px;color:var(--muted);margin:7px 0 0}.detail-photo{width:100%;max-height:350px;object-fit:cover;border-radius:15px}.credit{padding:12px 0;border-bottom:1px solid var(--line);font-size:12px;line-height:1.8;overflow-wrap:anywhere}.credit a{color:var(--green)}.toast-show{opacity:1!important;transform:translate(-50%,0)!important}#toast{position:fixed;bottom:30px;left:50%;transform:translate(-50%,15px);background:var(--ink);color:white;border-radius:12px;padding:12px 22px;opacity:0;transition:.2s;pointer-events:none;z-index:9;font-size:13px;max-width:90vw}.resume{margin-left:10px}.small{font-size:12px;color:var(--muted);line-height:1.9}.fadein{animation:enter .3s ease-out}@keyframes enter{from{opacity:.5;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}@media(min-width:1500px){.choice img{height:330px}.hero{padding-top:50px;padding-bottom:50px}}@media(max-width:1399px){main{padding:30px 40px}footer{padding:20px 40px}.hero{gap:35px}.photo-tile{height:190px}}@media(max-width:800px){header{padding:0 24px;height:76px}main{padding:24px}.hero{gap:20px;grid-template-columns:1fr 1fr}.hero h1{font-size:42px}.hero p{font-size:14px}.photo-tile{height:160px}.collage{gap:8px;padding:0}.travel-stamp{width:90px;height:90px;font-size:9px}.travel-stamp strong{font-size:25px}.hero-meta{gap:9px;font-size:10px}.intro-strip{padding:20px}.steps{display:none}.choice img{height:230px}.choice-body{padding:18px}.city-line{display:block}.city-line h2{font-size:22px}.city-line span{display:block;margin-top:5px}.experience{font-size:15px;min-height:72px}.arena{gap:20px}.result-layout{gap:20px}.ticket-city h2{font-size:26px}.atlas-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:560px){header{padding:0 20px;height:70px}#brand{font-size:14px}.brand-icon{font-size:27px}#brand strong span{font-size:7px}nav{gap:10px}nav button{font-size:11px}main{padding:20px 16px}.hero{display:flex;flex-direction:column;gap:30px;padding:12px 5px}.hero-copy{width:100%}.hero h1{font-size:46px;margin:20px 0 16px}.hero p{font-size:15px;margin-bottom:22px}.hero-meta{font-size:11px}.collage{width:100%;max-width:400px;margin-top:10px}.photo-tile{height:140px}.travel-stamp{left:39%;top:35%}.intro-strip{margin-top:25px;padding:20px}.intro-strip strong{font-size:14px}.intro-strip p{font-size:12px}footer{padding:22px 16px;font-size:9px;align-items:center}footer button{font-size:10px}.game-title{margin:22px 0}.game-title h1{font-size:22px}.game-title p{font-size:12px}.arena{gap:12px}.choice{border-radius:15px}.choice img{height:185px}.choice-body{padding:14px 12px}.city-line h2{font-size:18px;line-height:1.4}.city-line span{font-size:10px}.experience{font-size:13px;line-height:1.7;min-height:88px;margin:12px 0}.region-pill{top:10px;left:9px;font-size:9px;padding:5px 8px}.tag{font-size:9px}.pick-label{float:none;display:block;margin-top:13px;font-size:11px}.vs{width:37px;height:37px;font-size:10px;border-width:3px;top:27%}.game-bottom{font-size:10px;gap:10px}.result-layout{grid-template-columns:1fr}.result-head h1{font-size:27px}.result-head p{font-size:12px}.ticket-photo{height:210px}.result-actions .primary{flex:1;justify-content:center}.atlas-grid{grid-template-columns:repeat(2,1fr);gap:10px}dialog{padding:28px 18px}.atlas-card img{height:115px}.atlas-card strong{font-size:13px}.map{height:240px}.resume{margin:10px 0 0}.primary{padding:16px 25px}.eyebrow{font-size:10px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.travel-stamp strong{font-size:25px}.travel-stamp>span:last-child{font-size:8px;white-space:nowrap}@media(max-width:800px){.travel-stamp strong{font-size:20px}.travel-stamp>span:last-child{font-size:6px}}
/* Round introduction screens */
.round-intro{max-width:1120px;margin:0 auto}.round-steps{display:flex;justify-content:center;align-items:center;gap:15px;font-size:12px;color:#8c9b91}.round-steps span{padding:7px 16px;border-radius:30px;border:1px solid var(--line)}.round-steps .current{background:var(--green);color:white;border-color:var(--green)}.round-steps .done{background:#e5eddc;color:var(--green)}.round-steps i{font-style:normal;color:#a8b5a9}.round-heading{text-align:center;margin:28px 0}.round-heading .eyebrow{justify-content:center}.round-heading h1{font-size:58px;letter-spacing:-2px;line-height:1.2;margin:12px 0}.round-heading h1 span{display:block;font-size:21px;letter-spacing:-.5px;margin-top:13px}.round-heading p{font-size:13px;color:var(--muted);margin:12px 0 0}.contenders{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.contender{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:white;animation:enter .35s ease-out both;animation-delay:calc(var(--order)*20ms)}.contender-photo{position:relative}.contender img{width:100%;height:116px;object-fit:cover;display:block}.contender-photo>span{position:absolute;top:9px;left:9px;font-size:10px;padding:4px 7px;border-radius:6px;color:white;background:#183e36b3}.contender-caption{padding:12px 14px}.contender h2{font-size:15px;margin:0;line-height:1.4}.contender-caption p{font-size:11px;color:var(--muted);margin:4px 0 0}.contenders-8 img{height:160px}.contenders-4 img{height:205px}.contenders-2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:820px;margin:auto}.contenders-2 img{height:245px}.contenders-2 h2{font-size:23px}.contender-experience{font-size:13px;line-height:1.7;color:var(--green);margin-top:12px}.round-controls{text-align:center;margin:27px 0 5px}.round-controls>p{font-size:12px;color:var(--muted);margin-bottom:17px}.round-controls .primary{min-width:220px;justify-content:space-between}.round-undo{display:block;margin:16px auto 0;font-size:12px;color:var(--muted);text-decoration:underline}@media(max-width:800px){.contenders{gap:12px}.contender img{height:105px}.contenders-8 img{height:130px}.contenders-4{grid-template-columns:repeat(2,minmax(0,1fr))}.contenders-4 img,.contenders-2 img{height:180px}.contender h2{font-size:14px}.contenders-2 h2{font-size:20px}}@media(max-width:560px){.round-steps{gap:7px;font-size:11px}.round-steps span{padding:6px 12px}.round-heading{margin:24px 0}.round-heading h1{font-size:46px}.round-heading h1 span{font-size:18px}.round-heading p{font-size:12px;line-height:1.7}.contenders{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.contender img{height:92px}.contender-caption{padding:10px}.contender h2{font-size:14px}.contender-caption p{font-size:10px}.contenders-4 img,.contenders-2 img{height:145px}.contenders-2 h2{font-size:18px}.contender-experience{font-size:12px}.round-controls{position:sticky;bottom:0;z-index:2;background:#f5f7f3f5;border-top:1px solid var(--line);padding:14px 0 12px;backdrop-filter:blur(12px);margin-bottom:0}.round-controls>p{font-size:10px;margin:0 0 12px}.round-controls .primary{padding:13px 25px}.round-undo{margin-top:12px}}
/* Stable button spacing, including iOS Safari */
.home-actions,.dialog-actions{display:flex;flex-wrap:wrap;align-items:stretch;gap:12px}.home-actions>button,.dialog-actions>button{margin:0;min-height:52px;max-width:100%;white-space:normal}.home-actions .primary{justify-content:space-between}.home-actions .resume{margin:0;display:flex;justify-content:center;align-items:center}.reset-link{display:flex;align-items:center;gap:6px;min-height:44px;margin:10px 0 0;padding:8px 3px;font-size:12px;color:var(--muted);text-decoration:underline;text-underline-offset:3px}.reset-link:hover{color:var(--green)}.dialog-actions{margin-top:24px}.dialog-actions .primary{justify-content:center}@media(max-width:560px){.home-actions{flex-direction:column;gap:12px;align-items:stretch}.home-actions>button{width:100%;margin:0}.home-actions .resume{min-height:50px}.reset-link{margin-top:8px}.dialog-actions{flex-direction:column}.dialog-actions>button{width:100%}}
