@import"https://fonts.googleapis.com/css2?family=Cinzel:wght@600;700&family=Inter:wght@400;500;600;700&display=swap";:root{font-family:Inter,system-ui,sans-serif;color:#f5f0e5;background:#071018;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:#071018}button{font:inherit}button:focus-visible{outline:3px solid #f2d47e;outline-offset:4px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.game-shell{min-height:100vh;display:flex;flex-direction:column;overflow:hidden;background:radial-gradient(circle at 50% 40%,#18333a 0,#0c1a23 44%,#050b12)}.topbar{height:76px;padding:0 clamp(20px,4vw,64px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff14;background:#061019e8;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:20}.brand{display:flex;align-items:center;gap:14px}.brand-mark{width:40px;height:40px;display:grid;place-items:center;border:1px solid #d9ba7270;transform:rotate(45deg);color:#e8ca82;box-shadow:inset 0 0 18px #d9ba7218,0 0 20px #d9ba720c}.brand-mark i{transform:rotate(-45deg);font: 700 20px Cinzel}h1{font:700 20px Cinzel;letter-spacing:.08em;margin:0;color:#f5e6bc}.brand p{margin:2px 0 0;color:#80929c;text-transform:uppercase;letter-spacing:.16em;font-size:9px}.header-actions{display:flex;align-items:center;gap:18px}.turn-counter{color:#778b95;text-transform:uppercase;letter-spacing:.12em;font-size:10px}.ghost-button,.secondary-button{color:#ded3b0;background:#07131b66;border:1px solid #bda86666;padding:9px 16px;border-radius:7px;cursor:pointer;transition:.2s}.ghost-button:hover,.secondary-button:hover{background:#d3b86c16;border-color:#d3b86c}.table{position:relative;flex:1;display:grid;grid-template-rows:minmax(135px,1fr) minmax(150px,auto) auto minmax(210px,1.2fr);min-height:670px;padding:14px clamp(10px,4vw,64px) 20px;isolation:isolate;background-image:linear-gradient(#06101722,#06101722),radial-gradient(#ffffff09 1px,transparent 1px);background-size:auto,22px 22px}.table:before{content:"";position:absolute;inset:2% 5%;border:1px solid #b9aa6c0c;border-radius:48%;z-index:-1;box-shadow:inset 0 0 100px #0005}.ambient{position:absolute;width:250px;height:250px;border-radius:50%;filter:blur(90px);opacity:.09;z-index:-1}.ambient-one{background:#46d6aa;top:10%;left:10%}.ambient-two{background:#e0683a;right:8%;bottom:18%}.opponent-zone,.player-zone{display:flex;min-width:0;flex-direction:column;align-items:center;justify-content:center}.player-label{display:flex;align-items:center;gap:10px;margin-bottom:12px}.player-label div{display:grid;gap:3px}.player-label strong{font:600 13px Cinzel;letter-spacing:.04em}.player-label div span{font-size:11px;color:#8297a1}.avatar{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:#182a33;border:1px solid #9fb2b755;color:#c9d6d7;font:600 10px Cinzel;transition:.3s}.avatar.thinking{border-color:#d8c271;box-shadow:0 0 18px #d8c27155;color:#f0dd9a}.hidden-hand{display:flex;justify-content:center;position:relative;padding-left:22px}.extra-cards{align-self:center;margin-left:8px;color:#cfbd7e;font:600 11px Cinzel}.card-back{--card-index: 0;width:66px;height:96px;margin-left:-22px;border:2px solid #78838a;border-radius:9px;background:repeating-linear-gradient(45deg,#1c313c,#1c313c 5px,#12232c 5px 10px);box-shadow:0 8px 18px #0008,inset 0 0 0 4px #0a141b,inset 0 0 0 5px #af9a5f55;display:grid;place-items:center;transform:rotate(calc((var(--card-index) - 5) * .8deg))}.card-back:first-child{margin-left:0}.card-back span{font:700 23px Cinzel;color:#cdb56d;border:1px solid #cdb56d88;width:40px;height:58px;display:grid;place-items:center;border-radius:50%}.card-back.stacked{width:91px;height:131px;margin:0;transform:none;box-shadow:5px 4px #172631,9px 8px #080f14,0 12px 22px #0009,inset 0 0 0 4px #0a141b,inset 0 0 0 5px #af9a5f55}.play-zone{display:flex;align-items:center;justify-content:center;gap:clamp(18px,3vw,42px);position:relative}.pile{display:grid;gap:8px;justify-items:center;border:0;padding:0;color:inherit;background:transparent}.pile-label{color:#7e939b;text-transform:uppercase;letter-spacing:.14em;font-size:9px}.draw-pile{cursor:pointer}.draw-pile:disabled{cursor:not-allowed;opacity:.62}.card{width:91px;height:131px;flex:0 0 auto;position:relative;border-radius:10px;border:2px solid #fff7ddc2;color:#fff;box-shadow:0 12px 25px #0008,inset 0 0 30px #0004;display:grid;place-items:center;overflow:hidden}.card-face{appearance:none;padding:0}.card:after{content:"";position:absolute;inset:14px 12px 15px;border:1px solid #ffffff4d;border-radius:48%;transform:rotate(-20deg)}.card-center{font:700 37px Cinzel;z-index:2;text-shadow:0 3px 8px #0008}.card-sigil{position:absolute;font-size:60px;opacity:.12;transform:rotate(-17deg)}.card-label{position:absolute;bottom:9px;font:700 7px Inter;letter-spacing:.12em;text-transform:uppercase;z-index:2}.corner{position:absolute;top:7px;left:7px;display:grid;font:700 14px Cinzel;line-height:1;z-index:3}.corner small{font-size:8px;margin-top:2px}.ember-card{background:linear-gradient(145deg,#ed6740,#8b2029)}.tide-card{background:linear-gradient(145deg,#329cca,#16466f)}.gale-card{background:linear-gradient(145deg,#48b18b,#1a5d59)}.stone-card{background:linear-gradient(145deg,#ad8251,#514133)}.neutral-card{background:linear-gradient(145deg,#8d69ba,#3c275e 70%)}.discard-pile .card{pointer-events:none}.active-suit{align-self:center;display:grid;gap:5px;min-width:145px;padding:11px 15px;border-left:2px solid currentColor;background:#071119aa;box-shadow:0 8px 22px #0003}.active-suit span{color:#71868e;font-size:9px;text-transform:uppercase;letter-spacing:.12em}.active-suit strong{font:600 14px Cinzel}.active-suit strong i{font-style:normal;font-size:17px}.active-suit.ember{color:#f19b73}.active-suit.tide{color:#70c9ec}.active-suit.gale{color:#74d5b1}.active-suit.stone{color:#d0aa77}.turn-banner{max-width:min(90vw,600px);justify-self:center;margin:12px 0;padding:8px 16px;border-radius:22px;background:#10242be8;border:1px solid #66b69b44;color:#bce3d4;font-size:12px;display:flex;align-items:center;gap:8px;text-align:center}.turn-banner.ai{border-color:#bda86655;color:#e2d4a5}.pulse-dot{flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:#63d3a9;box-shadow:0 0 10px #63d3a9}.turn-banner.ai .pulse-dot{background:#dec576;box-shadow:0 0 10px #dec576}.turn-banner.thinking .pulse-dot{animation:pulse 1s infinite}.your-label{width:min(100%,900px);display:flex;align-items:baseline;justify-content:center;gap:8px;margin-bottom:4px;color:#899aa2;text-transform:uppercase;letter-spacing:.13em;font-size:9px}.your-label b{color:#c9ba8a;font-size:9px}.hand-scroll{width:100%;overflow-x:auto;overflow-y:visible;scrollbar-width:thin;scrollbar-color:#8e805155 transparent;padding:14px 0 2px}.hand{min-width:max-content;display:flex;justify-content:center;padding:0 34px 0 58px}.hand .card{margin-left:-24px;transform:translateY(7px);transition:transform .2s ease,filter .2s,opacity .2s,box-shadow .2s}.hand .card:first-child{margin-left:0}.hand .card.playable{cursor:pointer;transform:translateY(0);box-shadow:0 0 0 2px #ecd88d,0 0 25px #dfc16c44,0 12px 25px #0008}.hand .card.playable:hover{transform:translateY(-13px) rotate(-1deg);z-index:5}.hand .card.muted{filter:saturate(.58) brightness(.69);opacity:.82}.hand .card.newly-drawn{animation:drawn .5s ease both}.controls{display:flex;align-items:center;gap:12px;margin-top:12px;color:#82959d;font-size:11px}.primary-button{border:1px solid #edd58a;background:linear-gradient(#e1ca82,#b89b50);color:#142028;padding:10px 18px;border-radius:7px;font-weight:700;cursor:pointer;box-shadow:0 5px 16px #0007;transition:.2s}.primary-button:hover:not(:disabled){transform:translateY(-1px);filter:brightness(1.08)}.primary-button:disabled,.secondary-button:disabled{opacity:.45;cursor:not-allowed}.modal-layer{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px;background:#02070cd6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:fade-in .2s ease}.suit-modal,.game-over{width:min(100%,470px);padding:32px;border:1px solid #c1ab6666;border-radius:14px;background:radial-gradient(circle at 50% 0,#243339,#0b161e 62%);box-shadow:0 25px 80px #000c,inset 0 0 50px #bfa86b0c;text-align:center}.modal-eyebrow{color:#b9a66c;font-size:9px;text-transform:uppercase;letter-spacing:.2em}.suit-modal h2,.game-over h2{margin:8px 0 7px;color:#f2e4bb;font:700 24px Cinzel}.suit-modal p,.game-over p{margin:0 auto 23px;color:#879aa3;font-size:12px;line-height:1.6}.suit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.suit-choice{aspect-ratio:.82;border:1px solid #ffffff24;border-radius:9px;color:#fff;cursor:pointer;display:grid;place-items:center;align-content:center;gap:4px;transition:.2s}.suit-choice:hover{transform:translateY(-4px);border-color:#fff9}.suit-choice b{font:700 28px Cinzel}.suit-choice span{font-size:9px;text-transform:uppercase;letter-spacing:.1em}.suit-choice.ember{background:linear-gradient(145deg,#c9492e,#6e1c25)}.suit-choice.tide{background:linear-gradient(145deg,#247ca6,#153c61)}.suit-choice.gale{background:linear-gradient(145deg,#348e70,#174f4c)}.suit-choice.stone{background:linear-gradient(145deg,#8e693f,#47382d)}.modal-cancel{margin-top:22px;border:0;background:transparent;color:#8ea0a7;cursor:pointer;font-size:11px;text-decoration:underline;text-underline-offset:3px}.result-rune{width:64px;height:64px;margin:0 auto 18px;display:grid;place-items:center;border-radius:50%;border:1px solid #d6be7355;color:#e6ca78;font-size:30px;box-shadow:0 0 28px #e6ca7822}.turn-result{margin:4px auto 23px;display:grid}.turn-result strong{color:#f2df9d;font:700 30px Cinzel}.turn-result span{color:#728790;font-size:9px;text-transform:uppercase;letter-spacing:.15em}.debug-panel{position:fixed;left:12px;bottom:12px;z-index:40;width:min(330px,calc(100vw - 24px));border:1px solid #ffffff22;border-radius:7px;background:#050a0feb;color:#aab8bd;font:10px/1.5 ui-monospace,monospace}.debug-panel summary{padding:7px 10px;cursor:pointer;color:#c8b879}.debug-panel dl{display:grid;grid-template-columns:105px 1fr;padding:0 10px}.debug-panel dt,.debug-panel dd{margin:0}.debug-panel p{padding:0 10px 8px}@keyframes pulse{50%{opacity:.35;transform:scale(.7)}}@keyframes drawn{0%{transform:translateY(-35px) scale(.8);opacity:0}}@keyframes fade-in{0%{opacity:0}}@media(max-width:700px){.topbar{height:64px;padding-inline:16px}.brand-mark{width:34px;height:34px}.brand h1{font-size:16px}.turn-counter{display:none}.table{min-height:calc(100vh - 64px);grid-template-rows:minmax(120px,.8fr) minmax(132px,auto) auto minmax(215px,1.2fr);padding-inline:5px}.card-back{width:56px;height:82px;margin-left:-21px}.card-back span{transform:scale(.8)}.card,.card-back.stacked{width:73px;height:106px}.card-center{font-size:30px}.card-sigil{font-size:46px}.card-label{font-size:6px}.play-zone{gap:17px}.active-suit{position:absolute;right:-6px;top:52px;min-width:110px;padding:8px 10px;transform:scale(.82);transform-origin:right center}.hand{justify-content:flex-start;padding-left:28px;padding-right:25px}.hand .card{margin-left:-15px}.controls span{display:none}.controls{margin-top:8px}.suit-grid{grid-template-columns:repeat(2,1fr)}.suit-choice{aspect-ratio:1.5}.suit-modal,.game-over{padding:27px 22px}.debug-panel{display:none}}@media(max-height:760px)and (min-width:701px){.table{min-height:590px;grid-template-rows:120px 140px auto 190px}.card,.card-back.stacked{width:78px;height:112px}.card-back{width:56px;height:82px}.hand .card{margin-left:-20px}}