@import "https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@400;500;700;800&display=swap";:root{--text:#6b6375;--text-h:#08060d;--bg:#fff;--border:#e5e4e7;--code-bg:#f4f3ec;--accent:#aa3bff;--accent-bg:#aa3bff1a;--accent-border:#aa3bff80;--social-bg:#f4f3ec80;--shadow:#0000001a 0 10px 15px -3px, #0000000d 0 4px 6px -2px;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--heading:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, Consolas, monospace;font:18px/145% var(--sans);letter-spacing:.18px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}@media (width<=1024px){:root{font-size:16px}}@media (prefers-color-scheme:dark){:root{--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--border:#2e303a;--code-bg:#1f2028;--accent:#c084fc;--accent-bg:#c084fc26;--accent-border:#c084fc80;--social-bg:#2f303a80;--shadow:#0006 0 10px 15px -3px, #00000040 0 4px 6px -2px}#social .button-icon{filter:invert()brightness(2)}}#root{text-align:center;border-inline:1px solid var(--border);box-sizing:border-box;flex-direction:column;width:1126px;max-width:100%;min-height:100svh;margin:0 auto;display:flex}body{margin:0}h1,h2{font-family:var(--heading);color:var(--text-h);font-weight:500}h1{letter-spacing:-1.68px;margin:32px 0;font-size:56px}@media (width<=1024px){h1{margin:20px 0;font-size:36px}}h2{letter-spacing:-.24px;margin:0 0 8px;font-size:24px;line-height:118%}@media (width<=1024px){h2{font-size:20px}}p{margin:0}code,.counter{font-family:var(--mono);color:var(--text-h);border-radius:4px;display:inline-flex}code{background:var(--code-bg);padding:4px 8px;font-size:15px;line-height:135%}:root{--bg:#fff8f3;--bg-soft:#fff0f5;--panel:#fff;--panel-border:#ffd6e8;--shadow:0 10px 28px #ff6b8a1f;--shadow-hover:0 14px 32px #ff6b8a2e;--coral:#ff6b8a;--coral-bright:#ff85a0;--peach:#ffb347;--lavender:#c9b6ff;--mint:#7ed9b6;--sky:#8ecfff;--ink:#4a3f55;--muted:#9a8aa8;--white:#fff;--font-display:"M PLUS Rounded 1c", sans-serif;--font-body:"M PLUS Rounded 1c", sans-serif;--font-mono:"M PLUS Rounded 1c", sans-serif;--radius-sm:12px;--radius-md:16px;--radius-lg:24px;--radius-pill:999px}*{box-sizing:border-box}html,body,#root{height:100%}body{background:radial-gradient(circle at 12% 8%, #ffd6e8b3, transparent 28%), radial-gradient(circle at 88% 12%, #c9b6ff73, transparent 24%), linear-gradient(180deg, var(--bg-soft) 0%, var(--bg) 45%, #fff5eb 100%);color:var(--ink);font-family:var(--font-body);margin:0}.app{max-width:760px;margin:0 auto;padding:28px 20px 64px}.app-header{text-align:center;margin-bottom:28px}.app-title{font-family:var(--font-display);letter-spacing:.02em;color:var(--coral);text-shadow:0 2px #ffffffe6;margin:0 0 8px;font-size:1.85rem;font-weight:800}.app-title:before{content:"🐱 "}.app-subtitle{color:var(--muted);margin:0;font-size:.92rem;font-weight:500}.panel{background:var(--panel);border:2px solid var(--panel-border);border-radius:var(--radius-md);box-shadow:var(--shadow);padding:28px}.home-panel{flex-direction:column;align-items:center;gap:18px;display:flex}.divider{color:var(--muted);font-size:.82rem;font-weight:700}.join-row{gap:10px;width:100%;display:flex}.text-input{border:2px solid var(--panel-border);color:var(--ink);border-radius:var(--radius-sm);font-family:var(--font-mono);background:#fffafc;flex:1;padding:12px 14px;font-size:.88rem;font-weight:500}.text-input:focus{border-color:var(--coral);outline:3px solid #ff6b8a40}.btn{background:var(--white);border:2px solid var(--lavender);color:var(--ink);border-radius:var(--radius-pill);font-family:var(--font-body);cursor:pointer;padding:10px 18px;font-weight:700;transition:transform .15s,box-shadow .15s,background .15s;box-shadow:0 4px #c9b6ff59}.btn:hover:not(:disabled){box-shadow:var(--shadow-hover);background:#faf6ff;transform:translateY(-2px)}.btn:active:not(:disabled){transform:translateY(1px)}.btn:focus-visible{outline-offset:2px;outline:3px solid #ff6b8a59}.btn--primary{background:linear-gradient(180deg, var(--coral-bright), var(--coral));border-color:var(--coral);color:var(--white);padding:14px 28px;font-size:1rem;box-shadow:0 5px #e85a78}.btn--primary:hover:not(:disabled){background:linear-gradient(180deg, #ff95ad, var(--coral-bright));color:var(--white)}.btn--small{padding:8px 14px;font-size:.82rem}.error-text{color:#e84d6f;font-size:.88rem;font-weight:700}.status-line{text-align:center;color:var(--ink);margin:16px 0;font-size:1rem;font-weight:700}.status-sub{text-align:center;color:var(--muted);margin:4px 0 0;font-size:.88rem;font-weight:500}.share-box{text-align:center;border-top:2px dashed var(--panel-border);width:100%;margin-top:16px;padding-top:16px}.share-label{color:var(--muted);margin:0 0 8px;font-size:.82rem;font-weight:700}.share-url{border-radius:var(--radius-sm);border:2px solid var(--panel-border);font-family:var(--font-mono);word-break:break-all;background:#fffafc;margin-bottom:10px;padding:10px 12px;font-size:.75rem;display:block}.game-board{flex-direction:column;gap:16px;display:flex}.hp-row{align-items:center;gap:12px;display:flex}.hp-bar{background:var(--panel);border:2px solid var(--panel-border);border-radius:var(--radius-sm);box-shadow:var(--shadow);flex:1;padding:10px 14px}.hp-bar--mine{border-color:var(--coral);background:linear-gradient(#fff,#fff7fa)}.hp-bar-label{color:var(--muted);margin-bottom:4px;font-size:.78rem;font-weight:700}.hp-bar-type{color:var(--coral)}.hp-bar-track{border-radius:var(--radius-pill);background:#ffe8f0;height:10px;overflow:hidden}.hp-bar-fill{background:linear-gradient(90deg, var(--coral), var(--peach));border-radius:var(--radius-pill);height:100%;transition:width .4s}.hp-bar-value{font-family:var(--font-mono);color:var(--ink);margin-top:4px;font-size:.78rem;font-weight:700}.phase-indicator{font-family:var(--font-mono);color:var(--muted);white-space:nowrap;background:var(--white);border:2px solid var(--panel-border);border-radius:var(--radius-pill);box-shadow:var(--shadow);padding:8px 12px;font-size:.82rem;font-weight:700}.phase-indicator span{color:var(--coral);font-size:1.05rem}.notice{text-align:center;border-radius:var(--radius-sm);padding:12px 16px;font-size:.88rem;font-weight:700}.notice--warn{color:#d97706;background:#fff3e8;border:2px solid #ffd4a8}.notice--event{border:2px solid var(--lavender);color:var(--ink);background:linear-gradient(#fff7fb,#fff0f8);font-size:.95rem;animation:1s ease-in-out 2 event-bounce}@keyframes event-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.debug-panel{border:2px dashed var(--peach);border-radius:var(--radius-sm);background:#fffaf3;flex-direction:column;align-items:center;gap:8px;padding:16px;display:flex}.card-face{border-radius:var(--radius-sm);width:76px;height:108px;font-family:var(--font-display);pointer-events:none;flex-direction:column;justify-content:center;align-items:center;gap:6px;display:flex}.card-face--sm{width:64px;height:90px}.card-face--md{width:76px;height:108px}.card-face--lg{width:92px;height:130px}.card-face--front{border:2px solid var(--panel-border);color:var(--ink);background:linear-gradient(#fff,#fff7fb);box-shadow:0 6px #ffd6e8cc}.card-face--back{background:linear-gradient(145deg,#ffd6e8,#ffc4dd 55%,#ffb8d4);border:2px solid #ff9ec0;box-shadow:0 6px #f48fb5}.card-back-pattern{filter:drop-shadow(0 2px #fff9);font-size:2.2rem;line-height:1}.card-glyph{font-size:1.9rem;line-height:1}.card-face--lg .card-glyph{font-size:2.4rem}.card-sub{font-family:var(--font-mono);color:var(--muted);text-align:center;padding:0 4px;font-size:.62rem;font-weight:700}.card-face--lg .card-sub{font-size:.7rem}.card--normal .card-glyph{border:2px solid var(--panel-border);background:#fff5f8;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.card--special1 .card-face--front,.card--special2 .card-face--front{background:linear-gradient(#fff9e8,#fff3d6);border-color:#ffd27a;box-shadow:0 6px #ffcc80}.play-arena{border:2px solid var(--panel-border);border-radius:var(--radius-md);min-height:280px;box-shadow:var(--shadow);background:radial-gradient(circle at 20% 20%,#ffd6e88c,#0000 22%),radial-gradient(circle at 80% 75%,#c9b6ff59,#0000 24%),linear-gradient(#fffafd,#fff5f8);grid-template-columns:1fr;gap:8px;margin:4px 0;padding:20px 16px;display:grid;position:relative}.play-arena__opponent,.play-arena__player{justify-content:center;align-items:center;min-height:130px;display:flex}.play-arena__center{flex-direction:column;justify-content:center;align-items:center;min-height:52px;display:flex;position:relative}.play-arena__slot--empty{border-radius:var(--radius-sm);background:#ffffff73;border:2px dashed #ff9ec08c;width:92px;height:130px}.play-arena__card{transform-origin:50%}.play-arena__card--enter{animation:.45s cubic-bezier(.22,1,.36,1) both card-enter-arena}.play-arena__card--opponent-back{animation:.5s cubic-bezier(.22,1,.36,1) both card-opponent-arrive}.play-arena__card--reveal{animation:.55s cubic-bezier(.22,1,.36,1) both card-flip-reveal}.play-arena__card--win{animation:.7s ease-out both card-win-glow;border-color:var(--peach)!important;box-shadow:0 0 0 3px #ffb34773,0 8px #ffb347!important}.play-arena__card--lose{opacity:.72;filter:saturate(.65);transition:opacity .35s,transform .35s,filter .35s;transform:scale(.94)}.play-arena__clash{border:2px solid var(--coral);background:var(--white);min-width:52px;height:52px;color:var(--coral);font-family:var(--font-display);opacity:0;box-shadow:var(--shadow);border-radius:50%;justify-content:center;align-items:center;font-size:.95rem;font-weight:800;display:flex;transform:scale(.4)}.play-arena__clash--hit{animation:.65s ease-out both clash-burst}.play-arena__hint{color:var(--muted);margin:0;font-size:.86rem;font-weight:700}.play-arena__hint--pulse{animation:1.2s ease-in-out infinite hint-pulse}.play-arena__verdict{font-family:var(--font-display);margin:6px 0 0;font-size:1.1rem;font-weight:800;animation:.45s cubic-bezier(.22,1,.36,1) both verdict-pop}.play-arena__verdict--win{color:#ff8f3f}.play-arena__verdict--lose{color:#8b7f9e}.play-arena__verdict--draw{color:var(--muted)}.play-arena__result-detail{text-align:center;color:var(--muted);margin:4px 0 0;font-size:.8rem;font-weight:700;animation:.4s both fade-in}@keyframes card-enter-arena{0%{opacity:0;transform:translateY(72px)scale(.72)rotate(-6deg)}70%{opacity:1;transform:translateY(-6px)scale(1.04)rotate(1deg)}to{opacity:1;transform:translateY(0)scale(1)rotate(0)}}@keyframes card-opponent-arrive{0%{opacity:0;transform:translateY(-56px)scale(.75)rotate(8deg)}to{opacity:1;transform:translateY(0)scale(1)rotate(0)}}@keyframes card-flip-reveal{0%{opacity:0;transform:perspective(600px)rotateY(-90deg)scale(.9)}to{opacity:1;transform:perspective(600px)rotateY(0)scale(1)}}@keyframes card-win-glow{0%{transform:scale(1);box-shadow:0 0 #ffb34700}40%{transform:scale(1.06);box-shadow:0 0 24px #ffb347a6}to{transform:scale(1);box-shadow:0 0 12px #ffb34759}}@keyframes clash-burst{0%{opacity:0;transform:scale(.3)}45%{opacity:1;transform:scale(1.15)}to{opacity:1;transform:scale(1)}}@keyframes verdict-pop{0%{opacity:0;transform:translateY(8px)scale(.9)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes hint-pulse{0%,to{opacity:.55}50%{opacity:1}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.hand-row{flex-wrap:wrap;justify-content:center;gap:10px;padding:12px 0;display:flex}.card{border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:none;padding:0;transition:transform .15s}.card--hand .card-face{transition:transform .15s,box-shadow .15s}.card:hover:not(:disabled) .card-face{box-shadow:var(--shadow-hover);transform:translateY(-6px)rotate(-1deg)}.card:disabled:not(.card--played-out) .card-face{opacity:.45}.card--played-out{visibility:hidden;pointer-events:none}.card--played-out .card-face{opacity:0}.discard-row{gap:16px;display:flex}.discard-pile{background:var(--panel);border:2px solid var(--panel-border);border-radius:var(--radius-sm);box-shadow:var(--shadow);flex:1;padding:12px 14px}.discard-label{color:var(--muted);margin:0 0 8px;font-size:.78rem;font-weight:700}.discard-cards{flex-wrap:wrap;gap:6px;display:flex}.discard-chip{border-radius:var(--radius-pill);border:2px solid var(--panel-border);min-width:28px;height:28px;font-family:var(--font-display);color:var(--ink);background:#fffafc;justify-content:center;align-items:center;padding:0 6px;font-size:.82rem;font-weight:700;display:inline-flex}.discard-chip.card--special1,.discard-chip.card--special2{background:#fff9e8;border-color:#ffd27a}.discard-empty{color:var(--muted);font-size:.78rem;font-weight:500}.game-over-panel{text-align:center;flex-direction:column;align-items:center;gap:12px;display:flex}.game-over-title{font-family:var(--font-display);color:var(--coral);margin:0;font-size:1.7rem;font-weight:800}@media (prefers-reduced-motion:reduce){.card,.card-face,.hp-bar-fill,.btn,.notice--event,.play-arena__card,.play-arena__clash,.play-arena__verdict,.play-arena__hint--pulse{transition:none;animation:none}.card--played-out{visibility:visible}.card--played-out .card-face{opacity:.35}}