:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5;--bg: #0b1a0b;--felt: #145a14;--felt-dark: #0e3d0e;--gold: #f0c040;--gold-dim: #c49a20;--card-bg: #fffef5;--card-border: #d0c8a0;--card-red: #d42020;--card-black: #1a1a1a;--card-back: #1a3a8a;--win: #4ade80;--lose: #f87171;--tie: #fbbf24;--zone-front: #2a1a4a;--zone-middle: #1a2a3a;--zone-back: #1a3a2a}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;background:var(--bg);color:#fafafa}.shell{min-height:100vh;display:grid;place-items:center;padding:2rem;background:radial-gradient(ellipse at center,var(--felt) 0%,var(--felt-dark) 50%,var(--bg) 100%)}.start-screen{text-align:center;max-width:28rem}.logo-area{margin-bottom:2rem}.logo-cards{display:flex;justify-content:center;gap:.25rem;margin-bottom:1rem}.logo-card{width:3rem;height:4rem;background:var(--card-bg);border-radius:.5rem;display:grid;place-items:center;font-size:1.5rem;box-shadow:0 4px 12px #0000004d;transform-origin:bottom center}.lc1{color:var(--card-black);transform:rotate(-12deg)}.lc2{color:var(--card-red);transform:rotate(-4deg)}.lc3{color:var(--card-red);transform:rotate(4deg)}.lc4{color:var(--card-black);transform:rotate(12deg)}.game-title{font-size:2.5rem;font-weight:800;background:linear-gradient(135deg,var(--gold) 0%,#fff 50%,var(--gold) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.02em;margin-bottom:.25rem}.game-subtitle{font-size:1.1rem;color:var(--gold-dim);letter-spacing:.15em;text-transform:uppercase;font-weight:600}.game-desc{color:#ffffffb3;font-size:.95rem;margin-bottom:2rem;line-height:1.6}.start-score{margin-top:1.5rem;font-size:1.1rem;color:#ffffffb3}.score-pos{color:var(--win)}.score-neg{color:var(--lose)}.btn{padding:.75rem 2rem;border-radius:.5rem;font-size:1rem;font-weight:600;border:none;cursor:pointer;transition:all .15s;letter-spacing:.02em}.btn-primary{background:linear-gradient(135deg,var(--gold) 0%,var(--gold-dim) 100%);color:#1a1a1a;box-shadow:0 4px 16px #f0c0404d}.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 20px #f0c04066}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:#ffffff1a;color:#fafafa;border:1px solid rgba(255,255,255,.2)}.btn-secondary:hover{background:#ffffff26}.game-layout{min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(ellipse at center,var(--felt) 0%,var(--felt-dark) 50%,var(--bg) 100%)}.game-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1.5rem;background:#0006;border-bottom:1px solid rgba(255,255,255,.1)}.header-title{font-size:1.25rem;font-weight:700;background:linear-gradient(135deg,var(--gold) 0%,#fff 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header-score{font-size:1rem;color:#fffc}.arrange-area{flex:1;display:flex;flex-direction:column;padding:1rem;gap:.75rem;max-width:900px;margin:0 auto;width:100%}.board-section{display:flex;flex-direction:column;gap:.5rem}.hand-zone{border-radius:.75rem;padding:.75rem;border:1px solid rgba(255,255,255,.1)}.zone-front{background:var(--zone-front)}.zone-middle{background:var(--zone-middle)}.zone-back{background:var(--zone-back)}.zone-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.zone-label{font-size:.85rem;font-weight:600;color:#ffffffb3;text-transform:uppercase;letter-spacing:.08em}.hand-type{font-size:.8rem;color:var(--gold);font-weight:600}.zone-cards{display:flex;gap:.35rem;flex-wrap:wrap}.card-tile{width:3.2rem;height:4.5rem;background:var(--card-bg);border-radius:.4rem;border:1.5px solid var(--card-border);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .15s;position:relative;box-shadow:0 2px 6px #0003;-webkit-user-select:none;user-select:none}.card-tile:hover{transform:translateY(-3px);box-shadow:0 4px 12px #0000004d}.card-small{width:2.6rem;height:3.6rem}.card-selected{transform:translateY(-6px);box-shadow:0 6px 16px #f0c04066;border-color:var(--gold)}.card-red{color:var(--card-red)}.card-black{color:var(--card-black)}.card-rank-top{position:absolute;top:.15rem;left:.25rem;font-size:.7rem;font-weight:700;line-height:1}.card-rank-bottom{position:absolute;bottom:.15rem;right:.25rem;font-size:.7rem;font-weight:700;line-height:1;transform:rotate(180deg)}.card-suit-center{font-size:1.5rem;line-height:1}.card-small .card-rank-top,.card-small .card-rank-bottom{font-size:.6rem}.card-small .card-suit-center{font-size:1.2rem}.card-empty{background:#ffffff0d;border:2px dashed rgba(255,255,255,.15);cursor:default}.card-empty:hover{transform:none;box-shadow:none}.empty-text{font-size:1.2rem;color:#ffffff26;font-weight:700}.card-back{background:var(--card-back);border-color:#2a4a9a;cursor:default;overflow:hidden}.card-back:hover{transform:none}.card-back-pattern{width:100%;height:100%;background:repeating-linear-gradient(45deg,transparent,transparent 3px,rgba(255,255,255,.05) 3px,rgba(255,255,255,.05) 6px)}.hand-section{background:#0000004d;border-radius:.75rem;padding:.75rem;border:1px solid rgba(255,255,255,.08)}.hand-cards-row{display:flex;gap:.35rem;flex-wrap:wrap;justify-content:center}.controls{display:flex;gap:.75rem;justify-content:center;padding:.5rem 0}.error-msg{text-align:center;color:var(--lose);font-size:.9rem;font-weight:500;padding:.5rem;background:#f871711a;border-radius:.5rem;border:1px solid rgba(248,113,113,.2)}.instructions{text-align:center}.instructions p{font-size:.8rem;color:#fff6}.return-hint{color:var(--gold)!important;animation:pulse 1.2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.hand-section.clickable{cursor:pointer;border-color:var(--gold);box-shadow:0 0 12px #f0c04033}.result-area{flex:1;display:flex;flex-direction:column;padding:1.5rem;gap:1.5rem;max-width:900px;margin:0 auto;width:100%}.result-title{text-align:center;font-size:1.5rem;font-weight:700;color:var(--gold)}.comparison-grid{display:flex;flex-direction:column;gap:1rem}.comparison-row{display:grid;grid-template-columns:4rem 1fr 4rem 1fr;gap:.75rem;align-items:center;background:#0000004d;border-radius:.75rem;padding:1rem;border:1px solid rgba(255,255,255,.08)}.comp-label{font-size:.85rem;font-weight:600;color:#ffffff80;text-transform:uppercase;letter-spacing:.08em}.comp-player,.comp-ai{display:flex;flex-direction:column;align-items:center;gap:.35rem}.comp-cards{display:flex;gap:.25rem}.comp-type{font-size:.75rem;color:#fff9;font-weight:500}.comp-result{text-align:center;font-weight:800;font-size:.9rem;padding:.25rem .5rem;border-radius:.35rem}.result-win{color:var(--win);background:#4ade801a}.result-lose{color:var(--lose);background:#f871711a}.result-tie{color:var(--tie);background:#fbbf241a}.round-summary{text-align:center;font-size:.95rem;color:#ffffffb3}.summary-sep{margin:0 .75rem;color:#ffffff4d}.scoop-bonus{display:block;margin-top:.5rem;color:var(--gold);font-weight:700;font-size:1.1rem}@media(max-width:600px){.card-tile{width:2.8rem;height:4rem}.card-small{width:2.2rem;height:3.2rem}.comparison-row{grid-template-columns:3rem 1fr 3.5rem 1fr;gap:.5rem;padding:.75rem}.game-title{font-size:2rem}.arrange-area{padding:.5rem}}@media(max-width:400px){.card-tile{width:2.4rem;height:3.5rem}.card-small{width:2rem;height:2.8rem}.card-suit-center{font-size:1.2rem}.card-small .card-suit-center{font-size:1rem}}
