.hr-sketch{--hr-ink:var(--text);--hr-ink-soft:var(--text-soft);--hr-stroke:2.5px solid var(--hr-ink);--hr-stroke-thick:3.5px solid var(--hr-ink);--hr-r-pill:18px 24px 16px 22px / 22px 18px 26px 14px;--hr-r-card:24px 30px 18px 28px / 28px 20px 32px 22px;--hr-r-btn:16px 20px 14px 22px / 20px 16px 24px 12px;--hr-r-bar:10px 14px 8px 16px / 14px 10px 18px 8px;--hr-ease-tap:cubic-bezier(.2, .9, .3, 1.1)}.hr-sketch .hr-ui-title{font-family:var(--font-en);color:var(--pink-dark);font-size:2.5rem;font-weight:700}.hr-sketch .sub{color:var(--text-soft);font-family:var(--font-body)}.hr-sketch .stat-pill{background:var(--mint);border:var(--hr-stroke);border-radius:var(--hr-r-pill);box-shadow:2px 2px 0 var(--sky);font-family:var(--font-kr);transition:transform .1s steps(2,end),box-shadow .1s steps(2,end);transform:rotate(-.5deg)}.hr-sketch .stat-pill:nth-child(2){background:var(--lavender);box-shadow:2px 2px 0 var(--pink);transform:rotate(.6deg)}.hr-sketch .stat-pill.hr-ui-pill-timer--warn{background:var(--yellow);box-shadow:3px 3px 0 var(--apricot-dark)}.hr-sketch .stat-pill .v{font-family:var(--font-en);color:var(--pink-dark)}.hr-sketch .stat-pill.hr-ui-pill-timer--warn .v{color:#c45a52}.hr-sketch .stat-pill:hover{box-shadow:3px 3px 0 var(--hr-ink);transform:rotate(-1deg)translate(-1px,-1px)}.hr-sketch .hr-ui-viewport{border:var(--hr-stroke-thick);border-radius:var(--hr-r-card);box-shadow:4px 4px 0 var(--pink), 7px 7px 0 var(--apricot);background:#faf8f2}.hr-sketch .hr-ui-expbar .hr-ui-expbar-label{font-size:12px;font-weight:700;font-family:var(--font-kr);color:var(--text);text-shadow:1px 1px 0 var(--card)}.hr-sketch .hr-ui-expbar .hr-ui-expbar-label--soft{color:var(--text-soft);text-shadow:1px 1px 0 var(--card);font-size:11px}.hr-sketch .hr-ui-expbar-track{border:2px solid var(--text);border-radius:var(--hr-r-bar);box-shadow:1px 1px 0 var(--pink);background:#3d2b1f1f}.hr-sketch .hr-ui-expbar-fill{background:var(--pink-dark);border-radius:var(--hr-r-bar);transition:width .25s steps(4,end)}.hr-sketch .hr-ui-overlay--idle{background:#fff9f0e6}.hr-sketch .hr-ui-overlay--gameover{background:#fff9f0f7}.hr-sketch .hr-ui-start-emoji{filter:drop-shadow(2px 2px 0 var(--apricot))}.hr-sketch .hr-ui-start-desc{color:var(--text-soft);font-family:var(--font-body)}.hr-sketch .hr-ui-gameover-title{font-family:var(--font-kr);color:var(--text);transform:rotate(-.6deg)}.hr-sketch .hr-ui-score-label{color:var(--text-soft);font-family:var(--font-body)}.hr-sketch .hr-ui-score-value{color:var(--pink-dark);font-family:var(--font-en)}.hr-sketch .hr-ui-overlay--gameover .hr-ui-score-value{font-size:clamp(48px,13vw,64px)}.hr-sketch .hr-ui-gameover{z-index:10;box-sizing:border-box;flex-direction:column;align-items:center;padding:14px 12px 12px;display:flex;position:absolute;inset:0;overflow:hidden}.hr-sketch .hr-ui-gameover-head{flex-direction:column;flex-shrink:0;align-items:center;gap:8px;margin-bottom:8px;display:flex}.hr-sketch .hr-ui-rank-panel{flex-direction:column;flex:auto;width:100%;max-width:340px;min-height:0;display:flex}.hr-sketch .hr-ui-rank-panel .hr-ui-rank-box{border:var(--hr-stroke);border-radius:var(--hr-r-card);width:100%;min-height:0;box-shadow:3px 3px 0 var(--pink);box-sizing:border-box;background:#fffffff5;flex-direction:column;flex:auto;padding:12px 14px 14px;display:flex;overflow:hidden}.hr-sketch .hr-ui-gameover-actions{flex-wrap:wrap;flex-shrink:0;justify-content:center;gap:10px;width:100%;padding-top:10px;display:flex}.hr-sketch .hr-ui-rank-list-scroll{-webkit-overflow-scrolling:touch;flex:auto;min-height:0;margin-bottom:8px;padding:2px 4px 4px 2px;overflow:hidden auto}.hr-sketch .hr-ui-rank-footer{flex-shrink:0}.hr-sketch .hr-ui-rank-box{border-top:2px dashed var(--yellow)}.hr-sketch .hr-ui-rank-list{flex-direction:column;gap:6px;display:flex}.hr-sketch .hr-ui-rank-title{font-family:var(--font-kr);color:var(--text);flex-shrink:0;align-items:center;gap:6px;margin:0 0 8px;font-size:17px;font-weight:700;display:flex}.hr-sketch .hr-ui-rank-row{border-radius:var(--hr-r-pill);background:#ffffff80;border:1.5px solid #3d2b1f1a;align-items:center;gap:8px;padding:6px 8px;font-size:16px;display:flex}.hr-sketch .hr-ui-rank-num{color:var(--text-soft);text-align:right;flex-shrink:0;width:24px}.hr-sketch .hr-ui-rank-name{text-align:left;color:var(--text);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.hr-sketch .hr-ui-rank-score{color:var(--text);flex-shrink:0;font-weight:700}.hr-sketch .hr-ui-rank-submit{flex-wrap:wrap;gap:8px;display:flex}.hr-sketch .hr-ui-rank-submit .hr-ui-input{flex:1;min-width:0;padding:10px 14px;font-size:16px}.hr-sketch .hr-ui-rank-submit .btn{flex-shrink:0}.hr-sketch .hr-ui-rank-empty{color:var(--text-soft);font-family:var(--font-body);margin:0;font-size:15px}.hr-sketch .hr-ui-rank-score--gold{color:#c9a227}.hr-sketch .hr-ui-submitted{color:#5a9e72;font-family:var(--font-kr);margin:4px 0 0;font-weight:700}.hr-sketch .btn{font-family:var(--font-kr);border:var(--hr-stroke);border-radius:var(--hr-r-btn);box-shadow:2px 2px 0 var(--pink);transition:transform .1s steps(2,end),box-shadow .1s steps(2,end)}.hr-sketch .btn:hover{box-shadow:4px 4px 0 var(--text);transform:translate(-2px,-2px)rotate(-1deg)}.hr-sketch .btn:active{box-shadow:1px 1px 0 var(--text);transform:translate(1px,1px)}.hr-sketch .btn.cream{background:var(--card)}.hr-sketch .hr-ui-input{font-family:var(--font-body);color:var(--text);background:var(--bg);border:var(--hr-stroke);border-radius:var(--hr-r-btn);box-shadow:1px 1px 0 var(--pink);outline:none}.hr-sketch .hr-ui-input:focus{box-shadow:2px 2px 0 var(--apricot)}.hr-sketch .hr-ui-overlay--pause{background:#fff9f0eb}.hr-sketch .hr-ui-combo{background:var(--pink);border:var(--hr-stroke);border-radius:var(--hr-r-pill);box-shadow:2px 2px 0 var(--pink-dark);font-family:var(--font-en);transform:rotate(1deg)}.hr-sketch .hr-ui-pop-layer{z-index:6;pointer-events:none;position:absolute;inset:0;overflow:hidden}@keyframes hr-pop-rise{0%{opacity:0;transform:translate(-50%,-40%)scale(.65)}18%{opacity:1;transform:translate(-50%,-58%)scale(1.12)}to{opacity:0;transform:translate(-50%,-115%)scale(1)}}.hr-sketch .hr-ui-pop{font-family:var(--font-en);pointer-events:none;white-space:nowrap;text-shadow:1px 1px 0 var(--card), -1px 0 0 var(--card), 0 1px 0 var(--card);font-size:22px;font-weight:700;animation:.85s ease-out forwards hr-pop-rise;position:absolute;transform:translate(-50%,-50%)}.hr-sketch .hr-ui-pop--score{color:var(--pink-dark)}.hr-sketch .hr-ui-pop--time{color:#4a8f62;font-size:20px}