:root{--bg: #0e1912;--bg-raised: #17281c;--bg-raised-2: #1e3526;--border: #2f4a35;--text: #f2f6ee;--text-dim: #9ab3a0;--accent: #45c96a;--accent-2: #1f8a45;--accent-dim: #204a2b;--gold: #f0c14b;--gold-dim: #6b551f;--danger: #ef6461;--warn: #f0c14b;--radius: 14px;--radius-sm: 10px;--font-display: "Baloo 2", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%}body{margin:0;background-color:var(--bg);background-attachment:fixed;background-repeat:no-repeat,no-repeat,no-repeat,repeat;background-size:auto,auto,auto,120px 120px;background-image:radial-gradient(circle at 12% -8%,rgba(69,201,106,.28),transparent 55%),radial-gradient(circle at 112% 12%,rgba(240,193,75,.16),transparent 45%),radial-gradient(circle at 50% 125%,rgba(31,138,69,.28),transparent 55%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cg fill='white' fill-opacity='0.014'%3E%3Ccircle cx='53' cy='50' r='7'/%3E%3Ccircle cx='67' cy='50' r='7'/%3E%3Ccircle cx='53' cy='64' r='7'/%3E%3Ccircle cx='67' cy='64' r='7'/%3E%3Crect x='58' y='64' width='4' height='12' rx='2'/%3E%3C/g%3E%3C/svg%3E");color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-user-select:none;user-select:none;touch-action:manipulation}#root{min-height:100%;display:flex;flex-direction:column}button,input{font:inherit;color:inherit}.screen{flex:1;display:flex;flex-direction:column;align-items:center;gap:12px;padding:16px 16px calc(24px + env(safe-area-inset-bottom));max-width:480px;margin:0 auto;width:100%}.title{font-family:var(--font-display);font-weight:700;font-size:2rem;margin:8px 0 0;text-align:center;color:var(--accent)}@supports (background-clip: text) or (-webkit-background-clip: text){.title{background:linear-gradient(135deg,var(--text) 35%,var(--accent) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}.title:before{-webkit-text-fill-color:var(--accent)}}.title:before{content:"🍀";display:inline-block;margin-right:8px}.title-tappable:before{content:none}.title-clover{display:inline-block;margin-right:8px;color:var(--accent);cursor:pointer}@supports (background-clip: text) or (-webkit-background-clip: text){.title-clover{-webkit-text-fill-color:var(--accent)}}.form{display:flex;flex-direction:column;gap:10px;width:100%}.divider{color:var(--text-dim);font-size:.85rem;text-align:center}.input{min-height:44px;padding:0 14px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-raised);color:var(--text);transition:border-color .15s ease,box-shadow .15s ease}.input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #45c96a33}.input-code{text-align:center;letter-spacing:.3em;text-transform:uppercase}.btn{min-height:44px;padding:0 18px;border-radius:var(--radius-sm);border:1px solid var(--border);background:linear-gradient(180deg,var(--bg-raised-2),var(--bg-raised));color:var(--text);box-shadow:0 2px 6px #0000004d;transition:transform .1s ease,box-shadow .1s ease,opacity .15s ease}.btn:active{transform:translateY(1px);box-shadow:0 1px 2px #0000004d;background:var(--border)}.btn:disabled{opacity:.45}.btn-primary{background:linear-gradient(180deg,var(--accent),var(--accent-2));border-color:var(--accent);color:#08150c;font-weight:700;box-shadow:0 3px 12px #45c96a59}.btn-primary:disabled{box-shadow:none}.tile-rotate-btn{position:absolute;bottom:-10px;width:32px;height:32px;padding:0;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1rem;background:linear-gradient(180deg,var(--bg-raised-2),var(--bg-raised));border:2px solid var(--gold);color:var(--gold);box-shadow:0 2px 6px #0006;z-index:2}.tile-rotate-btn:active{background:var(--gold-dim)}.tile-rotate-btn-ccw{left:-10px}.tile-rotate-btn-cw{right:-10px}.rotate-icon-ccw{display:inline-block;transform:rotate(-75deg)}.rotate-icon-cw{display:inline-block;transform:rotate(75deg)}.banner{width:100%;padding:10px 14px;border-radius:var(--radius-sm);font-size:.9rem;text-align:center}.banner-warn{background:#f0c14b26;color:var(--gold)}.banner-error{background:#ef646126;color:var(--danger)}.banner-suggestion{display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;background:#45c96a1f;border:1px solid var(--accent-dim);color:var(--text)}.btn-suggestion{min-height:36px;padding:0 16px;flex-shrink:0}.guess-header{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:-6px}.guess-header-line{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin:0;font-size:1.05rem}.guess-author{font-weight:600}.attempt-pill{font-family:var(--font-display);font-size:.78rem;font-weight:700;padding:2px 10px;border-radius:999px;background:var(--accent-dim);color:var(--accent)}.attempt-pill-2{background:#f0c14b2e;color:var(--gold)}.scoring-rules{margin:0;font-size:.75rem;color:var(--text-dim);text-align:center}.ready-count{color:var(--text-dim);font-size:.9rem}.submit-row{display:flex;align-items:center;gap:12px}.exit-btn{position:fixed;top:calc(10px + env(safe-area-inset-top));right:10px;z-index:101;min-height:32px;padding:0 12px;font-size:.8rem;color:var(--text-dim);box-shadow:none}.toast-fixed{position:fixed;top:0;left:0;right:0;z-index:100;border-radius:0;background-color:var(--bg-raised);padding-top:calc(10px + env(safe-area-inset-top))}.room-code{font-family:var(--font-display);font-size:3rem;font-weight:700;letter-spacing:.2em;padding:6px 28px;border-radius:999px;background:linear-gradient(180deg,var(--bg-raised-2),var(--bg-raised));border:2px solid var(--gold-dim);box-shadow:0 4px 16px #00000059,inset 0 1px #ffffff0a;color:var(--gold);text-shadow:0 0 18px rgba(240,193,75,.35)}.player-list{list-style:none;margin:0;padding:0;width:100%;display:flex;flex-direction:column;gap:6px}.player-row{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 12px;border-radius:var(--radius-sm);background:var(--bg-raised);border:1px solid var(--border)}.dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.dot-on{background:var(--accent);box-shadow:0 0 #45c96a99;animation:pulse-glow 2s ease-in-out infinite}.dot-off{background:var(--text-dim)}@keyframes pulse-glow{0%,to{box-shadow:0 0 #45c96a8c}50%{box-shadow:0 0 0 4px #45c96a00}}.player-name{flex:1}.player-clover{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;font-size:1.15rem;line-height:1;cursor:pointer;filter:drop-shadow(0 0 4px rgba(69,201,106,.45))}.host-tag{font-size:.75rem;color:var(--gold);text-transform:uppercase;letter-spacing:.05em}.btn-kick{width:26px;height:26px;flex-shrink:0;border-radius:50%;border:1px solid var(--border);background:transparent;color:var(--text-dim);font-size:.7rem;line-height:1;cursor:pointer}.btn-kick:active{background:#ef64612e;border-color:var(--danger);color:var(--danger)}.card-tile{position:relative;aspect-ratio:1 / 1;width:100%;border-radius:var(--radius);border:2px solid var(--border);background:linear-gradient(160deg,var(--bg-raised-2),var(--bg-raised));box-shadow:0 3px 8px #00000059,inset 0 1px #ffffff08;overflow:hidden;transition:border-color .15s ease,box-shadow .15s ease}.card-tile-clickable{cursor:pointer}.card-tile-selected{border:3px solid var(--gold);box-shadow:0 0 0 3px #f0c14b4d,0 3px 10px #0006}.card-tile-dimmed{opacity:.35}.card-word{position:absolute;max-width:78%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.8rem}.card-word-n{top:6px;left:50%;transform:translate(-50%);text-align:center}.card-word-s{bottom:6px;left:50%;transform:translate(-50%);text-align:center}.card-word-e{right:4px;top:50%;transform:translateY(-50%);text-align:right}.card-word-w{left:4px;top:50%;transform:translateY(-50%);text-align:left}.board{display:grid;grid-template-columns:1fr minmax(44px,.6fr) 1fr;grid-template-rows:1fr minmax(44px,.6fr) 1fr;grid-template-areas:"s0 c0 s1" "c3 mid c1" "s2 c2 s3";gap:4px;width:min(92vw,420px);aspect-ratio:1 / 1;margin:0 auto}.board-s0{grid-area:s0}.board-s1{grid-area:s1}.board-s2{grid-area:s2}.board-s3{grid-area:s3}.board-c0{grid-area:c0}.board-c1{grid-area:c1}.board-c2{grid-area:c2}.board-c3{grid-area:c3}.board-mid{grid-area:mid}.board-slot{position:relative}.board-slot-clickable{cursor:pointer}.board-slot-empty{position:relative;width:100%;height:100%;border-radius:var(--radius);border:2px dashed var(--border);display:flex;align-items:center;justify-content:center}.board-slot-empty:before{content:"🍀";font-size:clamp(16px,5vw,26px);opacity:.14}.board-slot-locked .card-tile{border-color:var(--accent);border-width:3px;box-shadow:0 0 0 2px #45c96a33,0 3px 10px #0006}.board-badge{position:absolute;top:-8px;right:-8px;min-width:26px;height:26px;padding:0 4px;border-radius:50%;background:var(--bg);border:2px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:.9rem;box-shadow:0 2px 6px #0006}.board-badge-correct{color:var(--accent);border-color:var(--accent);background:#45c96a2e}.board-badge-wrong{color:var(--danger);border-color:var(--danger);background:#ef64612e}.board-clue{display:flex;align-items:center;justify-content:center}.board-mid{position:relative;display:flex;align-items:center;justify-content:center}.board-mid-glyph{font-size:clamp(20px,6vw,32px);line-height:1;cursor:pointer;filter:drop-shadow(0 0 8px rgba(69,201,106,.5))}.board-mini .board-mid-glyph{font-size:16px;filter:drop-shadow(0 0 4px rgba(69,201,106,.5))}.clue-chip{font-size:.8rem;color:var(--text-dim);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}.attempt-history{margin-top:12px;padding-top:12px;border-top:1px solid var(--border);width:100%}.attempt-history-label{text-align:center;color:var(--text-dim);font-size:.85rem;margin:0 0 8px}.board-mini .board{width:min(60vw,220px);pointer-events:none}.board-mini .card-word,.board-mini .clue-chip{font-size:.65rem}.clue-input{width:100%;min-height:44px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-raised);color:var(--text);text-align:center;padding:0 4px;font-size:16px;transition:border-color .15s ease,box-shadow .15s ease}.clue-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #45c96a33}.tray{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;width:100%;padding:4px 4px 8px}.tray-item{position:relative;flex:0 0 auto;width:clamp(64px,20vw,96px)}.tray-item .card-word{font-size:clamp(.58rem,2.2vw,.75rem)}.tray-item .tile-rotate-btn{width:26px;height:26px;bottom:-8px;font-size:.85rem}.tray-item .tile-rotate-btn-ccw{left:-8px}.tray-item .tile-rotate-btn-cw{right:-8px}.tray-empty-slot{aspect-ratio:1 / 1;width:100%;border-radius:var(--radius);border:2px dashed var(--gold-dim);background:transparent;color:var(--gold);font-size:1.4rem;cursor:pointer;transition:background .15s ease,opacity .15s ease}.tray-empty-slot:after{content:"+"}.tray-empty-slot:active:not(:disabled){background:var(--bg-raised)}.tray-empty-slot:disabled{border-color:var(--border);color:var(--text-dim);opacity:.35;cursor:default}.clover-tap-burst{position:fixed;width:0;height:0;pointer-events:none;z-index:200}.clover-tap-burst-piece{position:absolute;top:0;left:0;line-height:1;transform:translate(-50%,-50%);animation-name:clover-tap-fall;animation-timing-function:cubic-bezier(.16,.8,.3,1);animation-fill-mode:forwards;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35))}.flame-jets{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:195;overflow:hidden}.flame-jet{position:absolute;bottom:0;height:var(--jet-height);transform-origin:50% 100%;animation-name:flame-jet-rise;animation-timing-function:cubic-bezier(.2,.75,.25,1);animation-fill-mode:forwards}.flame-layer{position:absolute;bottom:0;left:50%;border-radius:50%/62% 62% 38% 38%;filter:blur(5px);mix-blend-mode:screen;animation-name:flame-flicker;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate}.flame-layer-outer{width:100%;height:100%;transform:translate(-50%);background:radial-gradient(ellipse at 50% 100%,#ff5a14e6,#d6280a8c 45%,#d6280a00 80%);animation-duration:.5s}.flame-layer-mid{width:66%;height:76%;transform:translate(-50%);background:radial-gradient(ellipse at 50% 100%,#ffaf1ef2,#ff6e0099 50%,#ff6e0000 85%);animation-duration:.4s;animation-delay:.08s}.flame-layer-inner{width:38%;height:52%;transform:translate(-50%);background:radial-gradient(ellipse at 50% 100%,#fffacd,#ffd65ae6,#ffd65a00 80%);animation-duration:.32s;animation-delay:.16s}@keyframes flame-jet-rise{0%{transform:translate(0) scaleY(.05);opacity:0}18%{opacity:1}32%{transform:translate(-3%) scaleY(1)}50%{transform:translate(4%) scaleY(1)}72%{transform:translate(-2%) scaleY(1);opacity:1}to{transform:translate(0) scaleY(1.08);opacity:0}}@keyframes flame-flicker{0%{transform:translate(-50%) scaleX(1) skew(0)}50%{transform:translate(-53%) scaleX(1.1) skew(-3deg)}to{transform:translate(-47%) scaleX(.92) skew(3deg)}}.chat-fab{position:fixed;right:14px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:140;width:52px;height:52px;padding:0;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.4rem;border:1px solid var(--accent-dim);background:linear-gradient(180deg,var(--bg-raised-2),var(--bg-raised));box-shadow:0 3px 12px #0006}.chat-fab:active{transform:translateY(1px)}.chat-badge{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;padding:0 4px;border-radius:999px;background:var(--danger);color:#2a0605;font-size:.7rem;font-weight:700;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 4px #0006}.chat-panel{position:fixed;left:0;right:0;bottom:0;z-index:140;max-width:480px;margin:0 auto;max-height:min(60vh,520px);display:flex;flex-direction:column;background:var(--bg-raised);border:1px solid var(--border);border-bottom:none;border-radius:var(--radius) var(--radius) 0 0;box-shadow:0 -6px 24px #00000073;transition:bottom .15s ease-out}.chat-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--border);font-family:var(--font-display);font-weight:700;color:var(--accent)}.chat-close{width:26px;height:26px;padding:0;border-radius:50%;border:1px solid var(--border);background:transparent;color:var(--text-dim);font-size:.7rem}.chat-messages{flex:1;min-height:120px;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:12px 14px}.chat-empty{margin:auto 0;text-align:center;color:var(--text-dim);font-size:.9rem}.chat-msg{align-self:flex-start;max-width:82%;display:flex;flex-direction:column;gap:2px;padding:6px 10px;border-radius:var(--radius-sm);background:var(--bg);border:1px solid var(--border)}.chat-msg-mine{align-self:flex-end;background:var(--accent-dim);border-color:var(--accent-dim)}.chat-msg-name{font-size:.7rem;font-weight:700;color:var(--text-dim)}.chat-msg-text{font-size:.92rem;overflow-wrap:anywhere}.chat-input-row{display:flex;gap:8px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--border)}.chat-input{flex:1}.chat-send{flex-shrink:0}@keyframes clover-tap-fall{0%{transform:translate(-50%,-50%) translate(0) rotate(0) scale(.7);opacity:1}6%{transform:translate(-50%,-50%) translate(calc(var(--dx) * .12),calc(var(--dy) * .08)) rotate(calc(var(--rot) * .12)) scale(1.05)}55%{opacity:1}to{transform:translate(-50%,-50%) translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(.8);opacity:0}}