.gartic-root,.gartic-page{width:100%;max-width:100%;overflow-x:hidden;overscroll-behavior-x:none}.gartic-page{--uno-bg:#121923;--uno-surface:#1a2432;--uno-surface-2:#222f41;--uno-ink:#f6f1e5;--uno-muted:#aeb9c8;--uno-accent:var(--game-accent);--uno-border:#34445a;min-height:100dvh;color:var(--uno-ink);background-color:var(--uno-bg);background-image:var(--game-texture)}@supports(overflow:clip){.gartic-root,.gartic-page{overflow-x:clip}}
.gartic-page [hidden]{display:none!important}
.gartic-shell{width:min(1180px,calc(100% - 40px));margin:auto;padding:16px 0 40px}
/* Mesma composição, tipografia, ritmo e componentes usados pelo UNO. */
.game-header{position:relative;display:flex;align-items:center;justify-content:space-between;min-height:64px;border-bottom:1px solid var(--uno-border)}.game-header .game-back{color:var(--uno-muted)}.game-header .game-back:hover{color:var(--uno-ink)}
.game-brand{position:absolute;left:50%;top:50%;z-index:1;translate:-50% -50%;display:flex;align-items:baseline;gap:9px;color:var(--uno-ink);text-decoration:none}.game-brand strong{font:italic 1.65rem/1 var(--font-display);letter-spacing:-.08em;transform:skew(-8deg)}.game-brand small{color:var(--uno-muted);font-size:.7rem;white-space:nowrap}
.game-lobby{padding:48px 0}.game-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(270px,.62fr);align-items:center;gap:50px;padding-bottom:40px;border-bottom:1px solid var(--uno-border)}.game-hero__copy{max-width:650px}.game-hero .eyebrow{margin:0 0 12px;color:var(--game-accent)}.game-hero h1{margin:0;font:italic clamp(3.1rem,6vw,5.7rem)/.88 var(--font-display);letter-spacing:-.07em;text-transform:uppercase;transform:skew(-5deg);transform-origin:left}.game-hero h1+p{max-width:590px;margin:20px 0 0;color:var(--uno-muted);font-size:1.05rem;line-height:1.55}.game-facts{color:var(--uno-ink)!important}.game-facts span:before{background:var(--game-accent)}
.gartic-hero-art{position:relative;height:250px;animation:sketch-in .55s var(--ease-spring) both}.sketch-sheet{position:absolute;right:22px;top:16px;width:220px;height:182px;border:7px solid #e9e3d6;border-radius:12px;background:#fffdf6;box-shadow:9px 12px 0 rgba(4,16,34,.3);transform:rotate(4deg)}.sketch-sheet i{position:absolute;display:block;border:7px solid #e85d57;border-radius:50%}.sketch-sheet i:first-child{left:77px;top:24px;width:66px;height:66px;background:var(--game-accent)}.sketch-sheet i:nth-child(2){left:25px;bottom:17px;width:88px;height:42px;border-color:#53a96b;border-radius:50% 50% 9px 9px}.sketch-sheet i:nth-child(3){right:20px;bottom:16px;width:54px;height:54px;border-color:#4f8ee8;transform:rotate(45deg)}.hero-pencil{position:absolute;right:2px;bottom:31px;width:205px;height:22px;border:4px solid #5a4128;border-radius:5px;background:var(--game-accent);box-shadow:5px 6px 0 rgba(4,16,34,.24);transform:rotate(-24deg)}.hero-pencil:after{content:"";position:absolute;right:-27px;top:-4px;border-left:27px solid #ead1a6;border-top:11px solid transparent;border-bottom:11px solid transparent}
.gartic-hero-art .sketch-sheet{right:6px;top:7px;width:310px;height:218px;overflow:visible;border:0;border-radius:8px 13px 11px 7px;background:#fffdf6;box-shadow:0 2px 0 #d8d0c0,10px 14px 0 rgba(4,16,34,.2),18px 24px 34px rgba(4,16,34,.3);transform:rotate(2.2deg)}.gartic-hero-art .sketch-sheet:before{content:"";position:absolute;inset:0;z-index:2;border-radius:inherit;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(42,85,126,.045) 0 1px,transparent 1px 22px),linear-gradient(90deg,transparent 0 30px,rgba(231,95,91,.15) 30px 31px,transparent 31px);mix-blend-mode:multiply}.paper-tape{position:absolute;z-index:5;left:50%;top:-14px;width:72px;height:27px;background:rgba(238,220,169,.78);box-shadow:0 2px 4px rgba(70,48,18,.12);transform:translateX(-50%) rotate(-3deg);clip-path:polygon(3% 10%,97% 0,94% 92%,5% 100%)}.paper-spiral{position:absolute;z-index:6;left:-11px;top:15px;bottom:15px;display:flex;flex-direction:column;justify-content:space-around}.gartic-hero-art .paper-spiral i{position:relative;display:block;left:0;top:0;width:25px;height:9px;border:3px solid #9da8b3;border-left-color:#54616f;border-radius:999px;background:transparent;box-shadow:1px 2px 2px rgba(0,0,0,.13);transform:none}.sketch-scene{position:absolute;inset:8px 5px 4px 17px;width:calc(100% - 22px);height:calc(100% - 12px);overflow:visible}.paper-wash{opacity:.7}.sketch-color{opacity:0;animation:sketch-color-in .55s ease-out 1.1s forwards}.sketch-sun{animation-delay:1.35s}.sketch-line{fill:none;stroke:#223047;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:520;stroke-dashoffset:520;filter:drop-shadow(0 1px rgba(255,255,255,.8));animation:sketch-draw 1.15s cubic-bezier(.35,.1,.2,1) forwards}.line-2{animation-delay:.2s}.line-3{animation-delay:.35s}.line-4{animation-delay:.55s}.line-5{animation-delay:.72s}.line-6{animation-delay:.88s}.sun-rays{stroke:#eaa92c;stroke-width:3;animation-delay:1.05s}.artist-sign{position:absolute;z-index:4;right:13px;bottom:8px;color:#526276;font:italic 10px/1 cursive;transform:rotate(-5deg)}.gartic-hero-art .hero-pencil{right:-10px;bottom:14px;width:235px;height:24px;border:2px solid #6f4b22;border-radius:3px 7px 7px 3px;background:linear-gradient(180deg,#fff0a0 0 17%,#f2bd32 18% 72%,#d99a16 73% 100%);box-shadow:0 2px 0 #8e651f,7px 10px 16px rgba(4,16,34,.28);transform:rotate(-17deg);animation:pencil-float 3.2s ease-in-out 1.5s infinite}.gartic-hero-art .hero-pencil:before{content:"";position:absolute;left:-25px;top:-2px;width:26px;height:24px;border:2px solid #6f4b22;border-right:0;border-radius:8px 0 0 8px;background:linear-gradient(180deg,#f7a7a7 0 52%,#d86f76 53%);box-shadow:inset -6px 0 #c7b6a1}.gartic-hero-art .hero-pencil:after{right:-35px;top:-2px;border-left:35px solid #e7c58e;border-top:12px solid transparent;border-bottom:12px solid transparent}.gartic-hero-art .hero-pencil i{position:absolute;z-index:2;right:-35px;top:9px;width:11px;height:6px;border:0;border-radius:0;background:#26313d;clip-path:polygon(100% 50%,0 0,0 100%);transform:none}
.lobby-layout{grid-template-columns:minmax(280px,.72fr) minmax(460px,1.28fr);gap:54px;padding-top:40px}.lobby-entry h2,.rooms-section h2{font-family:var(--font-display);font-weight:400}.section-kicker{color:var(--game-accent)}
.gartic-page .primary{min-height:48px;border:1px solid var(--game-secondary);border-radius:var(--radius-sm);background:var(--game-secondary);color:#fff;font-weight:700}.gartic-page .primary:hover{background:#65a1ef}.gartic-page .secondary{min-height:48px;border:1px solid #61738a;border-radius:var(--radius-sm);background:transparent;color:var(--uno-ink);font-weight:700}.gartic-page .secondary:hover{border-color:var(--game-accent);color:var(--game-accent)}.game-lobby input,.gartic-page dialog input,.gartic-page dialog select{border-radius:var(--radius-sm)}.room-seats{color:var(--game-accent);font-size:.88rem;letter-spacing:.1em}.room-row>button{border-color:var(--game-accent);color:var(--game-accent)}.room-row>button:hover{background:var(--game-accent);color:var(--game-accent-ink)}
.gartic-page dialog{max-height:calc(100dvh - 20px);overflow:auto;border-radius:var(--radius-lg);background:var(--uno-surface);animation:dialog-in var(--duration-medium) var(--ease-spring)}.gartic-page dialog::backdrop{background:rgba(5,10,17,.8)}.gartic-page dialog form{padding:28px}.gartic-page dialog h2{font-family:var(--font-display);font-weight:400;letter-spacing:-.03em}.gartic-page dialog .primary{width:100%}.dialog-close{display:grid;place-items:center;width:44px;height:44px;right:8px;top:8px}
.segmented-field{padding:0;border:0}.segmented-field legend{margin-bottom:8px;font-weight:700}.segmented-control{display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden;border:1px solid var(--uno-border);border-radius:var(--radius-sm)}.segmented-control--six{grid-template-columns:repeat(6,1fr)}.segmented-control label{position:relative;min-width:0}.segmented-control input{position:absolute;opacity:0;pointer-events:none}.segmented-control span{display:grid;place-items:center;min-height:46px;border-left:1px solid var(--uno-border);color:var(--uno-muted);font-weight:700;cursor:pointer}.segmented-control label:first-child span{border-left:0}.segmented-control input:checked+span{background:var(--game-accent);color:var(--game-accent-ink)}.segmented-control input:focus-visible+span{outline:3px solid var(--focus-ring);outline-offset:-3px}
.category-select{display:grid!important;gap:8px!important}.select-shell{position:relative;display:block}.category-select select{width:100%;height:48px;padding:0 48px 0 15px;border:1px solid var(--uno-border);border-radius:var(--radius-sm);appearance:none;background:linear-gradient(180deg,#182536,#111a27);color:var(--uno-ink);font:700 .92rem var(--font);cursor:pointer;outline:none;transition:border-color .2s,box-shadow .2s}.category-select select:hover{border-color:#55708f}.category-select select:focus{border-color:var(--game-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--game-accent) 16%,transparent)}.category-select option{background:#182536;color:var(--uno-ink)}.select-shell svg{position:absolute;right:15px;top:50%;width:21px;height:21px;translate:0 -50%;fill:none;stroke:var(--game-accent);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
/* A mesa mantém os tokens do sistema; só o canvas é específico do Gartic. */
.gartic-header-controls{display:flex;align-items:center;justify-content:flex-end;gap:8px}.gartic-header-controls .live-audience{display:flex;align-items:center;justify-content:center;min-width:54px;height:36px;padding:0 11px;border:1px solid var(--uno-border);border-radius:99px;background:var(--uno-surface);color:var(--uno-muted);font-size:.75rem;font-weight:800;transition:border-color .2s,background .2s,color .2s,box-shadow .2s}.gartic-header-controls .live-audience.has-viewers{border-color:rgba(61,224,125,.72);background:rgba(19,91,51,.72);color:#eafff1;box-shadow:0 0 0 1px rgba(61,224,125,.12),0 0 16px rgba(61,224,125,.22)}.gartic-header-controls .live-audience.audience-pop{animation:audience-arrival .7s ease-in-out 2}.gartic-header-controls .sound-toggle{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--uno-border);border-radius:50%;background:var(--uno-surface);color:var(--uno-ink)}.gartic-header-controls .sound-toggle:hover,.gartic-header-controls .sound-toggle[aria-pressed=true]{border-color:var(--game-accent)}.gartic-header-controls .sound-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.gartic-game{padding-top:18px}.game-topbar{display:grid;grid-template-columns:minmax(110px,1fr) auto minmax(110px,1fr);align-items:center;gap:15px;margin-bottom:14px}.game-topbar>#leaveRoom{justify-self:start;width:auto;min-width:104px}.game-topbar span{color:var(--uno-muted);font-size:.75rem}.game-live{justify-self:end;display:flex;align-items:center;gap:9px}.draw-timer{display:grid;place-items:center;width:58px;height:48px;border-radius:var(--radius-sm);background:var(--game-accent);color:var(--game-accent-ink);font:1.35rem var(--font-display)}
.game-topbar>.gartic-room-info{display:grid;grid-template-columns:auto auto;align-items:center;justify-content:center;gap:3px 7px;text-align:center}.gartic-room-info>strong{grid-column:1/-1}.gartic-room-info #copyInvite{display:inline-flex;align-items:center;gap:4px;min-height:20px;padding:0 0 0 7px;border:0;border-left:1px solid var(--uno-border);background:transparent;color:var(--game-accent);font-size:.67rem;font-weight:800;line-height:1;cursor:pointer;transition:color .18s,transform .18s}.gartic-room-info #copyInvite:before{content:"↗";font-size:.76rem}.gartic-room-info #copyInvite:hover{color:#fff0b2;transform:translateY(-1px)}
.gartic-layout{display:grid;grid-template-columns:210px minmax(0,1fr) 260px;gap:14px}.gartic-layout>aside,.drawing-stage{border:1px solid var(--uno-border);border-radius:var(--radius-md);background:var(--uno-surface)}.gartic-layout>aside{padding:16px}.gartic-layout h2{margin:0 0 14px;font:1rem var(--font-display);text-transform:uppercase}.gartic-players{display:grid;gap:8px;margin-bottom:14px}.gartic-player{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:8px;padding:9px;border-radius:var(--radius-sm);background:var(--uno-surface-2)}.gartic-player.is-drawer{outline:2px solid var(--game-accent)}.gartic-player.is-guessed{color:#79d596}.player-avatar{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--game-secondary);font-weight:900}.player-score{color:var(--uno-muted);font-size:.76rem}
.drawing-stage{min-width:0;padding:12px}.word-display{min-height:42px;text-align:center;font:clamp(1.1rem,3vw,1.8rem) var(--font-display);letter-spacing:.1em}.canvas-wrap{position:relative;overflow:hidden;border-radius:var(--radius-sm);background:#fffdf6}#canvas{display:block;width:100%;height:auto;aspect-ratio:3/2;touch-action:none;cursor:crosshair}.word-choices,.round-overlay{position:absolute;inset:0;display:grid;place-content:center;padding:20px;text-align:center;background:rgba(18,25,35,.92)}.word-choices>div{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.word-choices button{min-height:48px;padding:12px 18px;border:1px solid var(--game-accent);border-radius:var(--radius-sm);background:var(--game-accent);color:var(--game-accent-ink);font-weight:900}.round-overlay{font:1.35rem var(--font-display)}
.draw-tools{display:grid;grid-template-columns:minmax(150px,1fr) minmax(130px,.8fr) auto;align-items:center;gap:14px;margin-top:12px;padding:10px;border:1px solid var(--uno-border);border-radius:var(--radius-sm);background:#151e2a}.draw-tools label{display:flex;align-items:center;gap:7px;color:var(--uno-muted);font-size:.72rem}.color-tools{display:flex;align-items:center;gap:9px;min-width:0}.quick-colors{display:grid;grid-template-columns:repeat(5,25px);gap:5px}.draw-tools .color-swatch{position:relative;width:25px;height:25px;min-height:0;padding:0;border:2px solid rgba(255,255,255,.18);border-radius:7px;background:var(--swatch)}.draw-tools .color-swatch.is-selected:after{content:"";position:absolute;inset:-4px;border:2px solid var(--game-accent);border-radius:9px}.custom-color{display:grid;justify-items:center;gap:3px;color:var(--uno-muted);font-size:.68rem}.custom-color>button{position:relative;display:grid;place-items:center;width:42px;height:36px;min-height:0;padding:0;border:1px solid var(--uno-border);border-radius:9px;background:#111925;color:#fff}.custom-color>button:hover,.custom-color>button[aria-expanded=true]{border-color:var(--game-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--game-accent) 15%,transparent)}.custom-color i{position:absolute;inset:5px 19px 5px 5px;border-radius:5px;background:var(--current-color);box-shadow:inset 0 0 0 1px rgba(255,255,255,.28)}.custom-color svg{position:absolute;right:3px;width:14px;height:14px;filter:drop-shadow(0 1px 2px #000)}.width-tool{min-width:0}.width-tool input{min-width:70px;width:100%}.tool-actions{display:grid;grid-template-columns:repeat(5,42px);gap:6px}.draw-tools .tool-icon{display:grid;place-items:center;width:42px;height:42px;min-height:42px;padding:0;border:1px solid var(--uno-border);border-radius:10px;background:linear-gradient(180deg,#1b293a,#111a27);color:var(--uno-ink);box-shadow:inset 0 1px rgba(255,255,255,.04),0 3px 8px rgba(0,0,0,.16)}.draw-tools .tool-icon svg{width:22px;height:22px}.draw-tools .tool-icon:hover{border-color:var(--game-accent);color:var(--game-accent);transform:translateY(-1px)}.draw-tools .tool-icon[aria-pressed=true]{border-color:var(--game-accent);background:linear-gradient(180deg,#ffd969,var(--game-accent));color:var(--game-accent-ink);box-shadow:0 0 0 2px color-mix(in srgb,var(--game-accent) 18%,transparent),0 5px 12px rgba(0,0,0,.25)}.draw-tools .tool-icon:disabled{opacity:.35;cursor:not-allowed;transform:none}.draw-tools .tool-icon:disabled:hover{border-color:var(--uno-border);color:var(--uno-ink)}
#canvas.is-filling{cursor:cell}#canvas.is-shaping{cursor:crosshair}
.color-popover{position:fixed;z-index:100;left:50%;top:50%;transform:translate(-50%,-50%);width:min(calc(100vw - 28px),360px);padding:17px;border:1px solid color-mix(in srgb,var(--game-accent) 38%,var(--uno-border));border-radius:18px;background:rgba(18,25,35,.97);box-shadow:0 30px 100px rgba(0,0,0,.72),0 0 0 100vmax rgba(0,0,0,.62);backdrop-filter:blur(18px)}.color-pop-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.color-pop-head strong{font-family:var(--font-display);font-size:1.05rem}.color-pop-head button{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--uno-border);border-radius:50%;background:transparent;color:var(--uno-ink);font-size:1.25rem}.sv-area{--picker-hue:#2878ff;position:relative;width:100%;aspect-ratio:1.7;border-radius:13px;cursor:crosshair;touch-action:none;background:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,transparent),var(--picker-hue);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}#svCursor{position:absolute;width:18px;height:18px;border:3px solid #fff;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 2px 9px #000;pointer-events:none}.hue-label{display:grid;gap:7px;margin:14px 0;color:var(--uno-muted);font-size:.75rem}#hueRange{width:100%;height:12px;padding:0;border:0;border-radius:99px;appearance:none;background:linear-gradient(90deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00)}#hueRange::-webkit-slider-thumb{width:22px;height:22px;border:3px solid #fff;border-radius:50%;appearance:none;background:transparent;box-shadow:0 2px 8px #000}#hueRange::-moz-range-thumb{width:16px;height:16px;border:3px solid #fff;border-radius:50%;background:transparent;box-shadow:0 2px 8px #000}.color-pop-value{display:grid;grid-template-columns:40px 1fr auto;gap:9px;align-items:center}.color-pop-value>span{width:40px;height:40px;border:1px solid rgba(255,255,255,.22);border-radius:10px}.color-pop-value input{min-width:0;height:42px;padding:9px 11px;border:1px solid var(--uno-border);border-radius:9px;background:#0f1722;color:var(--uno-ink);font:inherit;text-transform:uppercase}.color-pop-value button{height:42px;padding:0 15px;border:0;border-radius:9px;background:var(--game-accent);color:var(--game-accent-ink);font-weight:800}
.chat-panel{display:flex;min-height:0;flex-direction:column}.messages{min-height:260px;max-height:520px;overflow:auto;flex:1}.message{margin:0 -5px;padding:8px 5px;border-bottom:1px solid var(--uno-border);font-size:.84rem;overflow-wrap:anywhere}.message.correct{color:#79d596}.message strong{margin-right:5px}.chat-panel form{display:flex;gap:6px;margin-top:10px}.chat-panel input{min-width:0;min-height:44px;flex:1;padding:10px;border:1px solid var(--uno-border);border-radius:var(--radius-sm);background:#121923;color:var(--uno-ink)}.chat-panel button{min-height:44px;padding:8px 11px;border:0;border-radius:var(--radius-sm);background:var(--game-secondary);color:#fff;font-weight:700}.toast:empty{display:none}
@keyframes sketch-in{from{opacity:0;transform:translateX(38px) rotate(5deg)}to{opacity:1;transform:none}}@keyframes dialog-in{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:none}}
@keyframes sketch-draw{to{stroke-dashoffset:0}}@keyframes sketch-color-in{from{opacity:0;transform:translateY(5px)}to{opacity:.9;transform:none}}@keyframes pencil-float{0%,100%{translate:0 0}50%{translate:-4px -5px}}
@keyframes audience-arrival{0%,100%{transform:scale(1)}45%{transform:scale(1.18);box-shadow:0 0 0 7px rgba(61,224,125,.16),0 0 26px rgba(61,224,125,.55)}}
@media(prefers-reduced-motion:reduce){.gartic-header-controls .live-audience.audience-pop,.sketch-color,.sketch-line,.gartic-hero-art .hero-pencil{animation:none}.sketch-color{opacity:.9}.sketch-line{stroke-dashoffset:0}}
@media(max-width:980px){.gartic-layout{grid-template-columns:170px minmax(0,1fr)}.chat-panel{grid-column:1/-1;min-height:260px}.messages{max-height:220px}.draw-tools{grid-template-columns:1fr auto}.width-tool{grid-column:1/-1}.tool-actions{grid-column:2;grid-row:1/3}}
@media(max-width:760px){.gartic-shell{width:min(100% - 24px,620px);padding-top:8px}.game-header{min-height:58px}.game-brand small{display:none}.game-brand strong{font-size:1.4rem}.gartic-header-controls .header-copy{width:36px;padding:0;font-size:0}.gartic-header-controls .header-copy:before{content:"↗";font-size:1rem}.game-lobby{padding:32px 0 38px}.game-hero{grid-template-columns:1fr;gap:20px;padding-bottom:30px}.game-hero h1{font-size:clamp(2.8rem,13vw,4.3rem)}.game-hero h1+p{font-size:1rem}.gartic-hero-art{height:205px;margin-top:-8px;overflow:visible;transform:scale(.78);transform-origin:50% 0}.sketch-sheet{left:50%;right:auto;translate:-50% 0}.hero-pencil{left:50%;right:auto;translate:-34% 0}.lobby-layout{grid-template-columns:1fr;gap:34px;padding-top:30px}.lobby-entry{padding:0 0 34px}.sheet-dialog{width:100%;max-width:none;margin:auto 0 0;border-width:1px 0 0;border-radius:var(--radius-lg) var(--radius-lg) 0 0!important;animation-name:sheet-in!important}.gartic-page .sheet-dialog form{padding:28px 20px calc(24px + env(safe-area-inset-bottom))}.gartic-layout{grid-template-columns:1fr}.gartic-layout>aside:first-child{order:2}.drawing-stage{order:1}.chat-panel{order:3;grid-column:auto}.game-topbar{grid-template-columns:auto 1fr auto}.draw-tools{grid-template-columns:1fr}.width-tool,.tool-actions{grid-column:auto;grid-row:auto}.tool-actions{grid-template-columns:repeat(5,42px);justify-content:center}.color-tools{justify-content:center}@keyframes sheet-in{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:none}}}
@media(max-width:380px){.gartic-shell{width:calc(100% - 20px)}.game-brand{left:54%}.game-header .game-back{font-size:.82rem}.game-hero h1{font-size:2.75rem}.gartic-hero-art{height:185px;transform:scale(.68)}}
@media(max-width:760px){.game-topbar>#leaveRoom{min-width:0}.game-topbar>.gartic-room-info{gap:2px 6px}.gartic-room-info #copyInvite{padding-left:6px}}

/* O modal rola somente na vertical e os tempos não extrapolam no celular. */
.gartic-page dialog{max-width:calc(100vw - 20px);overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}.gartic-page dialog form{min-width:0}
.segmented-control input{width:1px;height:1px;padding:0;border:0;clip-path:inset(50%)}
@media(max-width:760px){.gartic-page .sheet-dialog{width:calc(100% - 8px);max-width:calc(100% - 8px);margin:auto 4px 0}.segmented-control--six{grid-template-columns:repeat(3,minmax(0,1fr))}.segmented-control--six label:nth-child(4) span{border-left:0}.segmented-control--six label:nth-child(n+4) span{border-top:1px solid var(--uno-border)}}

/* Alguns navegadores Android deslocam dialogs percentuais para fora da tela. */
@media(max-width:760px){.gartic-page dialog.sheet-dialog{position:fixed;inset:auto 0 0 0;width:auto;min-width:0;max-width:none;max-height:calc(100dvh - 8px);margin:0;overflow-x:hidden;overflow-y:auto;border-inline:0}.gartic-page dialog.sheet-dialog form{width:100%;min-width:0;max-width:100%;overflow:hidden}.gartic-page dialog.sheet-dialog fieldset,.gartic-page dialog.sheet-dialog label,.gartic-page dialog.sheet-dialog input,.gartic-page dialog.sheet-dialog select{min-width:0;max-width:100%}}

.player-avatar{position:relative;overflow:visible;background:transparent}.player-avatar img{width:28px;height:28px;border:2px solid var(--game-secondary);border-radius:50%;object-fit:cover;pointer-events:none;-webkit-user-drag:none;-webkit-touch-callout:none;user-select:none}.player-avatar b{position:absolute;top:1px;right:0;z-index:4;display:grid;width:14px;height:14px;place-items:center;border:2px solid var(--uno-surface-2);border-radius:50%;background:var(--game-secondary);color:#fff;font-size:.52rem;line-height:1}
.player-avatar:has(.game-avatar-frame){width:40px;height:31px}
.player-avatar:has(.game-avatar-frame){width:48px;height:48px}
.gartic-player:has(.game-avatar-frame){grid-template-columns:64px minmax(0,1fr) auto;min-height:62px}.gartic-player:has(.game-avatar-frame) .player-avatar{justify-self:center}.gartic-player>strong{min-width:0;overflow-wrap:anywhere;position:relative;z-index:3}.gartic-player .player-score{position:relative;z-index:3;white-space:nowrap}
.gartic-player{grid-template-columns:64px minmax(0,1fr) auto;min-height:62px}.gartic-player .player-avatar{justify-self:center;width:48px;height:48px}.gartic-player .player-avatar>img:first-child{width:44px;height:44px}