@font-face{font-family:Jua;src:url('/assets/Jua-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
:root{color-scheme:light;--paper:#fff0d4;--ink:#482717;--muted:#755c49;--focus:#176e70;font-family:Jua,"Apple SD Gothic Neo","Noto Sans KR",sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-width:280px;overflow-x:clip;background:var(--paper) url('/assets/scene.png') center top/cover no-repeat;min-height:100svh}main{width:min(calc(100% - 32px),470px);margin:0 auto;padding:65px 0 28px}button,a,summary{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:5px}[hidden]{display:none!important}
.intro{text-align:center;padding:0 0 29px}h1{font-size:clamp(29px,8vw,38px);line-height:1.25;font-weight:400;letter-spacing:-.6px;margin:0}.lead{font-size:15px;line-height:1.5;margin:10px 0 0;color:var(--muted);word-break:keep-all}
.canvas-wrap{position:relative;aspect-ratio:1;isolation:isolate;margin-bottom:68px}.mat{position:absolute;inset:-7%;width:114%;height:114%;object-fit:contain;pointer-events:none;user-select:none}.canvas-wrap canvas{position:absolute;inset:2.5%;display:block;width:95%;height:95%;touch-action:none;user-select:none;cursor:crosshair}.canvas-hint{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#765288;pointer-events:none;font-size:21px}.friend{position:absolute;right:-12px;bottom:-69px;width:50%;height:50%;object-fit:contain;object-position:right bottom;z-index:3;pointer-events:none;user-select:none}.score-chip{position:absolute;right:-6px;top:-13px;width:160px;height:110px;background:url('/assets/score-badge.png') center/contain no-repeat;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:14px 12px 17px;transform:rotate(8deg);z-index:2;pointer-events:none}.score-value{display:flex;align-items:baseline;gap:3px}#score{font-size:49px;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-2px}.score-unit{font-size:19px}#score-caption{font-size:13px;line-height:1.4;margin-top:4px;white-space:nowrap}
.outcome{text-align:center}#status{font-size:14px;line-height:1.55;word-break:keep-all;margin:0 auto 13px;max-width:330px;color:var(--muted);min-height:22px}button,#try-link{border:0;background:transparent url('/assets/retry-button.png') center/100% auto no-repeat;color:var(--ink);min-height:80px;width:min(100%,285px);font:inherit;font-size:23px;padding:16px 20px 18px;cursor:pointer;text-decoration:none;display:flex;align-items:center;justify-content:center;margin:0 auto}button:hover,#try-link:hover{filter:brightness(1.04)}button:active,#try-link:active{transform:translateY(2px)}footer{text-align:center;margin-top:10px}summary{font-size:15px;min-height:44px;display:block;align-content:center;cursor:pointer;color:var(--muted);text-decoration:underline;text-underline-offset:5px}summary::-webkit-details-marker{display:none}details[open]{background:#fff5e5;padding:0 16px 12px;border-radius:12px}details p{font-family:"Apple SD Gothic Neo","Noto Sans KR",sans-serif;text-align:left;font-size:12px;line-height:1.8;word-break:keep-all;color:#644d3e;margin:8px 0 12px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);padding:10px 0 14px;gap:8px}.metrics div{display:flex;flex-direction:column;gap:6px}.metrics span{font-size:13px;color:var(--muted)}.metrics strong{font-size:22px;font-weight:400;font-variant-numeric:tabular-nums}.privacy{font-family:"Apple SD Gothic Neo","Noto Sans KR",sans-serif;font-size:10px;color:var(--muted);margin:12px 0 0}.teaser-label{text-align:center;font-family:"Apple SD Gothic Neo","Noto Sans KR",sans-serif;font-size:11px;line-height:1.5;color:#644d3e;background:#fff5e5;padding:7px 10px;border-radius:8px;margin:0 0 20px}.teaser main{padding-top:25px}.teaser #retry{background:none;font-size:14px;min-height:44px;padding:10px;text-decoration:underline;text-underline-offset:4px}.teaser .intro{padding-bottom:22px}.noscript{color:#9d331f}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(min-width:700px){body{background-size:auto max(100%,1000px)}main{padding-top:50px}.canvas-wrap{margin-bottom:76px}.friend{bottom:-76px}.intro{padding-bottom:31px}h1{font-size:38px}}
@media(max-width:359px){main{padding-top:40px}.intro{padding-bottom:24px}h1{font-size:28px}.lead{font-size:14px}.score-chip{width:140px;height:98px}#score{font-size:42px}#score-caption{font-size:11px}.canvas-hint{font-size:19px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}button:active,#try-link:active{transform:none}}

/* Compact explicit choices, independent of the large clay retry button. */
.shape-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:-8px 0 30px;padding:5px;border-radius:18px;background:#f2e4d6;border:1px solid #d9c4af}
.shape-picker button{display:flex;flex-direction:column;gap:3px;width:100%;min-height:64px;margin:0;padding:7px 2px;background:transparent;border:2px solid transparent;border-radius:13px;font-size:14px;line-height:1.2;transition:background-color 120ms,border-color 120ms}
.shape-picker button span{font-size:25px;line-height:1}
.shape-picker button[aria-pressed="true"]{background:#e3d5ee;border-color:#87619d;color:#482b60;box-shadow:0 2px 0 #c8afd9}
.shape-picker button:hover{background-color:#f8ede2;filter:none}
.shape-picker button[aria-pressed="true"]:hover{background-color:#e3d5ee}
.friend{transform-origin:65% 88%}
main[data-state="drawing"][data-reaction="focus"] .friend{animation:friend-focus 1800ms ease-in-out 2}
main[data-state="result"][data-reaction="happy"] .friend{animation:friend-happy 520ms ease-out 1}
main[data-state="result"][data-reaction="curious"] .friend{animation:friend-curious 480ms ease-out 1}
@keyframes friend-focus{0%,100%{transform:rotate(0deg)}50%{transform:rotate(-1.2deg)}}
@keyframes friend-happy{0%,100%{transform:rotate(0deg)}45%{transform:rotate(-2deg)}}
@keyframes friend-curious{0%,100%{transform:rotate(0deg)}50%{transform:rotate(1.5deg)}}
@media(max-width:359px){.shape-picker{gap:3px;padding:4px}.shape-picker button{font-size:12px}}
@media(prefers-reduced-motion:reduce){.friend{animation:none!important;transform:none!important}.shape-picker button{transition:none}}

/* Party uses the existing cream/lavender/clay palette and the supplied friend. */
.mode-picker{display:flex;gap:8px;margin:-12px 0 6px}
.room-entry{display:block;text-align:center;color:var(--focus);font-size:14px;min-height:44px;padding:12px 4px;margin-bottom:10px;text-underline-offset:4px}
.mode-picker button{width:50%;min-height:46px;margin:0;padding:10px 8px;font-size:17px;line-height:1.3;background:#fff5e5;border:2px solid #cfb99d;border-radius:15px}
.mode-picker button[aria-pressed="true"]{background:#e3d5ee;border-color:#87619d;color:#482b60}
.mode-picker #party-mode{border-color:#b66040;background:#f7d1a8}
.mode-picker #party-mode[aria-pressed="true"]{background:#f5ba91;border-color:#91442b}
.party-panel{text-align:center;background:#fff5e5;border:1px solid #dbc4aa;border-radius:22px;padding:20px 16px;margin:0 0 24px;overflow-wrap:anywhere}
.party-panel h2{font-weight:400;font-size:clamp(23px,6.5vw,29px);line-height:1.4;margin:6px 0 12px;word-break:keep-all}
.party-panel h3{font-weight:400;font-size:17px;line-height:1.4;margin:22px 0 10px;text-align:left}
.party-rules{font-size:20px;line-height:1.6;margin:0 0 8px;word-break:keep-all}
.party-copy{font-size:15px;line-height:1.6;color:#644d3e;margin:8px 0 16px;word-break:keep-all}
.count-label{display:block;font-size:17px;line-height:1.5;margin:20px 0 8px}
#party-count,#party-shape{font:inherit;font-size:22px;min-height:48px;min-width:120px;max-width:100%;color:var(--ink);background:#fff;border:2px solid #87619d;border-radius:12px;padding:8px 16px;margin-bottom:14px}
#party-count:focus-visible,#party-shape:focus-visible,.party-panel [tabindex="-1"]:focus-visible{outline:3px solid var(--focus);outline-offset:4px}
.party-panel button{font-size:20px;line-height:1.35}
.party-panel .quiet-button{background:none;width:auto;min-height:44px;font-size:15px;padding:10px 14px;text-decoration:underline;text-underline-offset:4px}
.party-memory{font-family:"Apple SD Gothic Neo","Noto Sans KR",sans-serif;font-size:12px;line-height:1.6;color:var(--muted);margin:14px 0 0}
.party-progress{font-size:21px;line-height:1.45;margin:0 0 6px;word-break:keep-all}
.party-friend{width:112px;height:112px;object-fit:contain;display:block;margin:0 auto;pointer-events:none}
.party-scores{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.party-scores li{display:flex;justify-content:space-between;align-items:center;gap:5px;padding:10px;border-radius:12px;background:#eee3f3;font-size:17px}
.party-scores strong{font-weight:400;font-variant-numeric:tabular-nums;white-space:nowrap}
main[data-mode="party"] .intro{padding-bottom:25px}
main[data-mode="party"] .canvas-wrap{margin-top:24px}
.party-turn-hint{display:none}
.party-panel[data-phase="drawing"]{padding:12px 10px;margin-bottom:12px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 6px}
.party-panel[data-phase="drawing"] .party-progress{font-size:18px;margin:0;text-align:left}
.party-panel[data-phase="drawing"] .party-turn-hint{display:block;grid-column:1/-1;grid-row:2;font-size:13px;line-height:1.5;color:var(--muted);margin:2px 0 0}
.party-panel[data-phase="drawing"] #party-settings{grid-column:2;grid-row:1;font-size:12px;padding:6px;min-height:44px}
.party-panel[data-phase="drawing"] .party-memory{display:none}
html{overflow-x:clip}
#party-confirm{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:min(calc(100% - 32px),430px);max-height:calc(100svh - 32px);overflow-y:auto;z-index:20;box-shadow:0 0 0 100vmax #48271780,0 8px 30px #48271740}
@media(max-width:359px){.party-panel{padding:16px 12px}.party-rules{font-size:18px}.party-scores li{font-size:16px;padding:9px}.party-progress{font-size:19px}.mode-picker button{font-size:16px}}