#emote-wheel-panel{position:fixed;inset:0;z-index:2100;display:grid;place-items:center;background:#07150dc9;backdrop-filter:blur(3px);padding:8px;overflow:auto}
#emote-wheel-panel.hidden,#emote-notice.hidden{display:none}
.emote-wheel-card{position:relative;width:min(510px,98vw);padding:18px 10px 12px;border:1px solid #a3aa6d;border-radius:20px;background:radial-gradient(ellipse at 50% 40%,#2c4e3a,#10271e 75%);box-shadow:0 20px 80px #000a,inset 0 0 0 4px #0c1f17;color:#f5e5ab;text-align:center}
.emote-wheel-card header{padding:0 36px}.emote-wheel-card h2{margin:0;font-size:23px}.emote-wheel-card header small{color:#b8cbb2;font-size:11px}
#emote-wheel-close{position:absolute;right:14px;top:12px;width:32px;height:32px;padding:0;border:1px solid #9ca66f;border-radius:8px;background:#263d2d;color:#f7e2a3;font-size:22px;cursor:pointer}
#emote-wheel-options{--radius:155px;position:relative;width:100%;height:430px;background:radial-gradient(circle at center,transparent 26%,#8daa5220 27%,#8daa5210 60%,transparent 61%)}
.emote-wheel-option{position:absolute;left:calc(50% + var(--x) * var(--radius));top:calc(50% + var(--y) * var(--radius));transform:translate(-50%,-50%);width:100px;height:108px;padding:3px;border:1px solid #6f895d;border-radius:16px;background:#122b20;color:#eee5bb;box-shadow:0 4px 0 #091a12;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:2}
.emote-wheel-option canvas{width:56px;height:70px;image-rendering:pixelated;pointer-events:none}.emote-wheel-option b{font-size:11px;white-space:nowrap}.emote-wheel-option small{position:absolute;top:6px;left:8px;color:#9ec78e;font-size:10px}
.emote-wheel-option.is-selected,.emote-wheel-option:focus-visible{outline:2px solid #f7dc80;outline-offset:2px;background:#3c5834;border-color:#f0d27b;color:#fff4c9}
.emote-wheel-center{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:154px;display:grid;justify-items:center;gap:3px;pointer-events:none}
#emote-selected-preview{width:112px;height:126px;image-rendering:pixelated}#emote-selected-name{font-size:16px;color:#ffe39a}#emote-selected-hint{width:150px;font-size:10px;color:#b2c6a3}
#emote-stop{padding:8px 24px;border:1px solid #8c9b6c;border-radius:8px;background:#263b2b;color:#eedfb4;font-weight:700;cursor:pointer}.emote-wheel-card footer small{display:block;color:#95b49a;margin-top:8px;font-size:10px}
#emote-notice{position:fixed;bottom:138px;left:50%;transform:translateX(-50%);z-index:2110;max-width:90vw;padding:9px 15px;border:1px solid #b4bd78;border-radius:9px;background:#10291fec;color:#f3e3af;text-align:center;font-size:12px;pointer-events:none}
#emote-wheel-open .emote-action-symbol{display:inline-grid;place-items:center;width:30px;font-size:22px;color:#f3d987}#emote-wheel-open kbd{margin-left:auto;font:10px monospace;color:#e7d49d;border:1px solid #8c9362;padding:1px 4px}
@media(max-width:600px){.emote-wheel-card{padding:14px 3px 10px}#emote-wheel-options{--radius:min(31vw,138px);height:min(104vw,390px)}.emote-wheel-option{width:78px;height:94px;border-radius:12px}.emote-wheel-option canvas{width:48px;height:60px}.emote-wheel-option b{font-size:10px}.emote-wheel-center{width:130px}#emote-selected-preview{width:90px;height:102px}#emote-selected-name{font-size:14px}#emote-selected-hint{font-size:9px;width:115px}.emote-wheel-card header small{font-size:10px}}
@media(prefers-reduced-motion:reduce){#emote-wheel-panel{backdrop-filter:none}}
