@charset "UTF-8";
@font-face{font-family:"Gatchi Title";src:url("fonts/jua-regular.woff2") format("woff2");font-display:swap}
:root{--bg:#fffbf5;--bg2:#fffdf9;--bg3:#fff0e9;--card:#fffdf9;--line:#eee2d7;--ink:#30231d;--sub:#84776d;--dim:#9a887c;--gold:#f66b59;--gold-d:#ba4939;--red:#e25c60;--blue:#8972bb;--green:#3e927e}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:'Pretendard Variable',Pretendard,'Malgun Gothic',system-ui,sans-serif;line-height:1.6;min-height:100vh}
button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #bd6451;outline-offset:4px}
.hidden{display:none!important}.wrap{max-width:560px;margin:auto;padding:0 22px 116px;background:var(--bg);min-height:100vh}
.rps-header{height:78px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.rps-header>span{font-size:16px;font-weight:800}.back-link{font-size:38px;line-height:1;width:38px;min-height:44px;display:grid;place-items:center}
.brand{font-family:'Gatchi Title',sans-serif;font-size:21px;white-space:nowrap}.brand b{color:var(--gold);margin-left:3px;font-size:17px}
.screen{animation:arrive .3s ease}@keyframes arrive{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
h1,h2{font-family:'Gatchi Title','Malgun Gothic',sans-serif;font-weight:400;letter-spacing:-.5px}
h1{font-size:clamp(32px,8vw,42px);line-height:1.3}h1 b{color:var(--gold);font-weight:400}
.rps-hero{position:relative;isolation:isolate;min-height:247px;padding:24px 20px;margin:4px 0 20px;border:1px solid #ffebbb;border-radius:26px;background:radial-gradient(ellipse at 82% 28%,#fffbea,#fff0c6);overflow:hidden}
.rps-hero h1{position:relative;z-index:1;max-width:76%;margin:4px 0 10px}
.tag{display:inline-block;font-size:12px;font-weight:750;background:#fff7df;color:#a87435;border:1px solid #f2dbaa;border-radius:999px;padding:4px 11px;margin-bottom:9px}
.hero-copy{font-size:14px;line-height:1.7;color:#927352;position:relative;z-index:1;width:55%}
.rps-rabbit{background-image:url('art/game-characters.png');background-size:300% 100%;background-position:0 50%;background-repeat:no-repeat;aspect-ratio:2/3;mix-blend-mode:multiply}
.rps-hero>.rps-rabbit{position:absolute;width:42%;max-width:182px;right:5px;bottom:-12px;z-index:0}
.hero-spark{position:absolute;right:20px;top:18px;font-size:27px;color:#f3b442;transform:rotate(14deg)}
.rps-steps{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:8px;margin:20px 0 15px;padding:0 3px}
.rps-steps li{display:flex;align-items:center;gap:5px;font-size:12px;color:#978d84;white-space:nowrap}
.rps-steps li:not(:last-child):after{content:'›';font-size:18px;color:#cabdb0;margin-left:7px}
.rps-steps span{display:grid;place-items:center;width:23px;height:23px;background:#f0eae3;border-radius:50%;font-weight:800}
.rps-steps [aria-current=step]{color:#d55a49;font-weight:750}.rps-steps [aria-current=step] span{color:#fff;background:var(--gold)}
.lead{font-size:13px;color:var(--sub);line-height:1.7;margin:0 0 22px;word-break:keep-all}
.choice-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:20px 0 12px}
.choice-heading h2{font-size:24px}.choice-heading>span{font-size:12px;color:var(--dim)}
.hands{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.hand{position:relative;background:#fff0e9;border:2px solid #f5d3c9;border-radius:21px;padding:23px 5px 16px;color:var(--ink);transition:transform .15s,border-color .15s,box-shadow .15s;min-height:134px}
.hand:nth-child(2){background:#f0eafa;border-color:#e0d4ed}.hand:nth-child(3){background:#fff5d9;border-color:#f2e0b4}
.hand .e{display:block;font-size:48px;line-height:1.2;margin-bottom:8px;filter:drop-shadow(0 4px 2px #8e5d3010)}
.hand .e{transform-origin:50% 90%;will-change:transform;animation-duration:1.45s;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-delay:var(--hand-delay,0s)}
.hand-motion-0 .e{animation-name:scissors-idle}.hand-motion-1 .e{animation-name:rock-idle}.hand-motion-2 .e{animation-name:paper-idle}
.hand.is-throwing .e{animation:hand-throw .56s cubic-bezier(.2,.8,.25,1)}
@keyframes scissors-idle{0%,100%{transform:translateY(0) rotate(-5deg)}45%{transform:translateY(-7px) rotate(5deg) scale(.96,1.04)}70%{transform:translateY(-2px) rotate(-2deg)}}
@keyframes rock-idle{0%,100%{transform:translateY(1px) rotate(0)}45%{transform:translateY(-9px) rotate(-7deg)}68%{transform:translateY(2px) rotate(4deg)}}
@keyframes paper-idle{0%,100%{transform:translateY(0) rotate(-4deg)}35%{transform:translateY(-6px) rotate(7deg)}65%{transform:translateY(-3px) rotate(-8deg)}}
@keyframes hand-throw{0%{transform:translateY(0) rotate(0) scale(1)}28%{transform:translateY(12px) rotate(-10deg) scale(.82)}62%{transform:translateY(-14px) rotate(7deg) scale(1.18)}100%{transform:translateY(0) rotate(0) scale(1)}}
.hand .l{font-size:17px;font-weight:750;color:#c67458}.hand:nth-child(2) .l{color:#8c71b4}.hand:nth-child(3) .l{color:#bd8e37}
.hand:hover{transform:translateY(-3px)}.hand:active{transform:scale(.97)}
.hand[aria-pressed=true]{border-color:var(--gold);box-shadow:0 0 0 3px #ff69591b;background:#ffe4da}
.hand[aria-pressed=true]:after{content:'✓';position:absolute;right:8px;top:7px;width:22px;height:22px;display:grid;place-items:center;background:var(--gold);color:white;font-size:13px;border-radius:50%;font-weight:800}
.hand.locked{cursor:default;opacity:.5}.hand.locked[aria-pressed=true]{opacity:1}
.selection-note{font-size:12px;color:#9c7464;min-height:20px;text-align:center;margin:12px 0 18px}
.rps-options{background:#fffdf9;border:1px solid var(--line);border-radius:17px;margin:4px 0 16px}
.rps-options summary{padding:15px 14px;cursor:pointer;font-size:14px;font-weight:700;color:#796a5f;list-style:none}
.rps-options summary::-webkit-details-marker{display:none}.rps-options summary:after{content:'+';float:right;font-size:20px;line-height:1.1}.rps-options[open] summary:after{content:'−'}
.rps-options summary span{font-size:11px;color:var(--dim);font-weight:400;margin-left:5px}.options-content{padding:0 15px 17px}
.q{display:block;font-size:14px;font-weight:700;color:#75665c;margin:18px 0 9px}.q em{font-size:12px;color:var(--dim);font-style:normal;font-weight:400}
input[type=text]{width:100%;min-width:0;background:#fff9f3;border:1px solid var(--line);border-radius:12px;padding:12px 14px;color:var(--ink);font-size:16px}
input::placeholder{color:#b09b8b}input:focus{outline:2px solid #edaa98;outline-offset:1px}
.chips{display:flex;flex-wrap:wrap;gap:7px}.chip{border:1px solid var(--line);border-radius:12px;background:#fffaf5;color:#8b776b;font-size:12px;padding:9px 10px;min-height:40px}
.chip[aria-pressed=true]{background:#ffede7;color:#ba5343;border-color:#eda28f;font-weight:750}
.rps-options .bet{margin-top:20px}.rps-options .bet-q{font-size:14px;color:#75665c}.rps-options .bet-chip{padding:8px 10px;font-size:12px;border-width:1px;min-height:40px}
.rps-options .bet-chip[aria-pressed=true]{background:#ffede7;border-color:#eda28f;color:#b55240}.option-hint{font-size:12px;color:#aa8e79;margin-top:10px}
.btn{display:block;width:100%;border:0;border-radius:18px;padding:15px 16px;min-height:54px;font-size:16px;font-weight:750;margin-top:10px;text-align:center;transition:transform .15s}
.btn:active{transform:scale(.985)}.btn:disabled{background:#efe4da;color:#b8a694;cursor:default;box-shadow:none}
.btn-main,.btn-red{background:linear-gradient(110deg,#ff765e,#ff6459);color:#fff;box-shadow:0 5px 13px #ea77511a}
.btn-sub{background:white;color:#9a6e5d;border:1px solid #ead8ca}.btn-ghost{background:transparent;color:#9c8273;font-size:14px;font-weight:500}
.challenge-ready #makeBtn{background:transparent;color:#a7816d;border:1px solid #ead8ca;box-shadow:none;font-size:14px}
.share-panel{padding:18px;background:#fff3d5;border:1px solid #f7dfaa;border-radius:22px;margin-top:18px;scroll-margin:20px}
.share-intro{display:flex;align-items:center;gap:13px;margin-bottom:12px}.share-intro>span{font-size:34px}.share-intro h2{font-size:24px}.share-intro p{color:#9b7e5b;font-size:12px}
.linkbox{padding:12px;background:#fffdf7;border:1px solid var(--line);border-radius:12px;font-family:ui-monospace,monospace;font-size:12px;line-height:1.6;overflow-wrap:anywhere;max-height:90px;overflow:auto;color:var(--sub);margin-top:10px}
.hint{font-size:12px;line-height:1.8;color:var(--dim);margin-top:14px;text-align:center;word-break:keep-all}.homelink{display:block;text-align:center;font-size:13px;color:#a47c68;margin-top:18px;padding:8px}
.invitation-hero{background:radial-gradient(ellipse at 80% 50%,#fff4ef,#ffe4dc);border-color:#f5d6cc}.invitation-hero h1{max-width:68%;font-size:clamp(29px,7.5vw,39px);overflow-wrap:anywhere;word-break:keep-all}.invitation-hero .tag{background:#fff8f3;border-color:#f1cdbd;color:#b3745a}
.card{border:1px solid #eedfcf;background:#fffdf9;border-radius:20px;padding:18px;margin:16px 0}.who{font-size:13px;color:var(--sub)}.who b{color:var(--ink)}
.bubble{background:#fff0e9;border-radius:16px 16px 16px 4px;padding:13px 15px;font-size:16px;color:#9a604b;margin-top:11px}.bubble:before{content:'💬';margin-right:7px}
.locked:not(.hand){display:flex;align-items:center;gap:9px;padding:12px;border:1px dashed #e7d9ca;border-radius:12px;color:#9a8b7e;font-size:12px;line-height:1.6;margin-top:14px}.locked:not(.hand) .e{font-size:20px}.rounds{font-size:12px;color:var(--dim);margin-top:9px}
.invitation-hero .bet-open{position:relative;z-index:1;font-size:12px;max-width:65%;padding:4px 10px;overflow-wrap:anywhere}
.result-intro{text-align:center;padding:2px 0 8px}.result-intro .rps-rabbit{width:90px;margin:0 auto -9px}.result-intro .tag{margin:0}.result-intro p{font-size:14px;color:var(--sub);margin-top:10px}
.versus{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:10px;margin:15px 0 22px}.side{background:#fff0e9;border:2px solid #f1ddd1;border-radius:23px;text-align:center;padding:24px 8px 18px}.side:nth-child(3){background:#f1ebf8;border-color:#e1d8ed}.side .e{display:block;font-size:58px;line-height:1.2;margin-bottom:14px}.side .n{font-size:13px;font-weight:700;color:#8e7d70;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.side.win{border-color:var(--gold);box-shadow:0 0 0 4px #ff695919}.side.lose{opacity:.6}.vs{font-size:14px;font-weight:850;color:#b79f8a}
.verdict{text-align:center;font-size:36px;margin:10px 0 5px}.verdict.win{color:#e6674e}.verdict.lose{color:#9874ad}.verdict.tie{color:#688da0}.sub-verdict{text-align:center;font-size:14px;color:var(--sub);line-height:1.7}.title-badge{display:table;margin:15px auto 0;border:1px solid #f1d6aa;background:#fff1d3;color:#a17a43;padding:8px 15px;border-radius:30px;font-size:13px;font-weight:750}
.lie{background:#fffdf9;border:1px solid var(--line);border-radius:18px;padding:16px;margin-top:18px;font-size:13px;color:var(--sub);line-height:1.9}.lie b{color:var(--ink)}.flag{padding:3px 7px;margin-left:6px;border-radius:8px;font-size:11px;font-weight:750}.flag.t{color:#358874;background:#e4f3eb}.flag.f{color:#c26c60;background:#ffeae5}
#notYet{background:#fff3dc!important;border:1px solid #efdbb7!important;border-radius:17px!important;color:#886945!important;padding:15px!important;font-size:13px!important}
.count{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fffbf5f7;backdrop-filter:blur(8px);font-family:'Gatchi Title',sans-serif;color:var(--gold);font-size:clamp(52px,16vw,82px)}
.count:before{content:'';display:block;width:145px;aspect-ratio:2/3;background:url('art/game-characters.png') 0 50%/300% 100%;mix-blend-mode:multiply;margin-bottom:12px}.count span{animation:pop .4s ease-out}@keyframes pop{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}
.toast{position:fixed;left:50%;bottom:95px;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#47392c;color:white;border-radius:24px;padding:12px 18px;max-width:90vw;width:max-content;font-size:13px;z-index:60;transition:opacity .2s,transform .2s;box-shadow:0 4px 15px #33221120}
.rps-footer{text-align:center;color:#b09b8c;font-size:12px;line-height:1.8;margin-top:32px}
.rps-nav{position:fixed;left:50%;bottom:0;transform:translateX(-50%);width:min(560px,100%);display:flex;justify-content:space-around;z-index:20;background:#fffdf9f5;backdrop-filter:blur(12px);border:1px solid #f1e7dc;border-radius:27px 27px 0 0;padding:11px 15px calc(10px + env(safe-area-inset-bottom));box-shadow:0 -3px 18px #816d4a08}
.rps-nav a{display:grid;justify-items:center;gap:4px;font-size:12px;color:#94867b;min-width:65px}.rps-nav [aria-current]{color:var(--gold);font-weight:750}.rps-nav svg{width:25px;height:25px;display:block}
@media(min-width:700px){body{background:#f6f1e9}.wrap{box-shadow:0 0 60px #78542d05;padding-left:30px;padding-right:30px}.rps-hero{min-height:264px}.rps-hero h1{font-size:43px}.rps-hero>.rps-rabbit{right:19px}.hero-copy{font-size:15px}}
@media(max-width:360px){.wrap{padding-left:16px;padding-right:16px}.rps-header>span{font-size:14px}.brand{font-size:18px}.rps-hero{padding:21px 17px;min-height:238px}.rps-hero h1{font-size:32px}.rps-steps{gap:4px}.rps-steps li{font-size:11px;gap:4px}.rps-steps li:not(:last-child):after{margin-left:3px}.hands{gap:7px}.hand{padding:21px 4px 15px}.hand .e{font-size:41px}.rps-options summary{font-size:13px;padding:14px 12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}