@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--gold:#d7bd80;--cream:#f0e6cf;--muted:#9cad9e;--line:#d5b97535;--display:'Cormorant Garamond',Georgia,serif;--body:Manrope,Arial,sans-serif;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 30% 15%,#21453465,transparent 60%),#091812;color:var(--cream);font:12px var(--body)}button,a,select{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button,select{font:inherit}button{border:1px solid var(--line);background:#14291f50;color:inherit;padding:11px 15px;border-radius:5px;cursor:pointer;transition:background .18s,border-color .18s}button:hover:not(:disabled){background:#d2b67422;border-color:#d6b777aa}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #ffdfa0;outline-offset:3px}a{text-decoration:none;color:inherit}.topbar{height:87px;padding:0 4%;display:flex;align-items:center;gap:24px;border-bottom:1px solid var(--line);background:#091912c9}.brand{display:flex;align-items:center;gap:14px}.brand img{width:52px;height:61px;object-fit:contain}.brand>span{font:600 18px var(--display);letter-spacing:2px;color:#e2c888}.brand small{font:7px var(--body);letter-spacing:3px;display:block;margin-top:6px;color:#9fac9b}.topbar nav{display:flex;margin:auto;gap:35px}.topbar nav button{border:0;border-radius:0;padding:33px 0;font-size:10px;color:var(--muted);background:none}.topbar nav button.active{border-bottom:2px solid var(--gold);color:var(--gold)}.wallet{display:flex;align-items:center;gap:13px;border-radius:30px;padding:8px 15px 8px 9px;background:#1b3226}.wallet b{display:block;color:#e9d6a3;font-size:13px;text-align:left}.wallet small{font-size:6px;letter-spacing:1px;display:block;margin-top:4px;color:var(--muted)}.wallet>span:last-child{font-size:19px;color:var(--gold)}.coin{width:29px;height:29px;border:3px dashed #d6bb7b;outline:1px solid #b3975c;outline-offset:2px;border-radius:50%;display:grid;place-items:center;font:11px var(--display);color:#ead39e}main{max-width:1570px;margin:auto;padding:0 4%}.heading{display:flex;align-items:center;justify-content:space-between;padding:29px 0 25px;gap:20px}.eyebrow{font-size:8px;font-weight:600;letter-spacing:2px;color:#c8b280}.heading h1{font:500 43px/1.1 var(--display);display:flex;align-items:center;gap:24px;margin:9px 0 0}.heading h1 em{font-size:20px;color:#a4b59c;font-weight:400}.dash{width:35px;height:1px;background:#bca66c70}.help{border:0;font-size:10px;color:#c2c9b5;background:none}.layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:20px}.salon{overflow:hidden;position:relative;border:1px solid #bda26a80;border-radius:10px;background:#122a20;box-shadow:0 25px 70px #0006}.salon-head{height:67px;position:relative;z-index:2;display:flex;align-items:center;padding:0 22px;gap:14px;border-bottom:1px solid #ae96572d;background:#0a2018ee}.salon-head small{display:block;margin-top:7px;letter-spacing:1.8px;font-size:5px;color:#9bac96}.salon-head .eyebrow{font-size:7px}.salon-head button{padding:7px 9px;font-size:10px}.salon-head .pill{margin-left:auto;border:1px solid var(--line);padding:7px 13px;border-radius:20px;font-size:6px;letter-spacing:1.2px;color:#c6b68d}.table-scene{position:relative;isolation:isolate;background:linear-gradient(#061810aa,#07120e55),url('assets/club-room.png') center/cover;overflow:hidden;min-height:580px}.table-scene:before{content:'';position:absolute;z-index:-1;inset:5% -8% -10%;border-radius:50%;border:16px solid #251a12;outline:2px solid #b69a5577;background:radial-gradient(ellipse,#35654788,#123d2a77 60%,#081b12),url('assets/felt-texture.png') center/400px;box-shadow:0 0 0 8px #060e0a,0 0 0 15px #5d3c20,0 0 0 17px #ad8d4a,0 5px 40px #000,inset 0 0 75px #000c;transform:perspective(1000px) rotateX(13deg)}#board{height:550px;position:relative;margin:0 auto;max-width:790px;touch-action:pan-y}#board canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}#loading{position:absolute;inset:0;display:grid;place-items:center;font:24px var(--display);color:#e3cc95}#hit-layer{position:absolute;inset:0;z-index:2}.hole-hit{position:absolute;border-radius:50%;width:4.3%;aspect-ratio:1;min-width:12px;padding:0;transform:translate(-50%,-50%);border:0;background:transparent!important}.hole-hit:focus-visible{outline:2px solid #ffe9ab;outline-offset:1px}.hole-hit.legal{cursor:pointer}.hole-hit.legal:after{content:'';position:absolute;inset:28%;border:1px solid #fff0bd;border-radius:50%;box-shadow:0 0 8px #ffe2a3;background:#d8bc7caa}.hole-hit.selected{outline:2px solid #ffe9ab;outline-offset:2px}.hole-hit.hint{outline:2px dashed #ffe9ab;outline-offset:3px}.opponent,.your-seat{position:absolute;left:50%;transform:translateX(-50%);z-index:3;display:flex;align-items:center;gap:9px;border:1px solid #c3a56a66;padding:6px 17px 6px 6px;border-radius:40px;background:linear-gradient(110deg,#122d21,#091b14eb);box-shadow:0 5px 14px #0005;pointer-events:none;white-space:nowrap}.opponent{top:12px}.your-seat{bottom:12px}.portrait{width:34px;height:34px;border-radius:50%;object-fit:cover;border:1px solid #b99c60}.seat-info b{display:block;font:21px var(--display);color:#e4d09b}.seat-info small{font-size:5px;color:#c0c5a6;letter-spacing:1px;display:block;margin-top:2px}.seat-gem{width:10px;height:10px;border-radius:50%;margin-left:13px;background:var(--gem);box-shadow:inset -2px -2px 3px #0009,0 0 8px var(--gem);border:1px solid #e5d9b866}.table-caption{position:absolute;top:49%;left:28px;right:28px;display:flex;justify-content:space-between;pointer-events:none;color:#c7b47d7a;font-size:5px;letter-spacing:2px}.table-caption span{writing-mode:vertical-rl}.table-caption span:first-child{transform:rotate(180deg)}.table-tools{padding:13px 20px;display:flex;justify-content:space-between;gap:10px;background:#0b2119ec;border-top:1px solid #ab935138;position:relative}.table-tools button{border:0;padding:3px 0;color:#d5c18b;font-size:12px;background:none}.table-tools button span{font-size:8px;margin-left:5px}.panel{border:1px solid var(--line);background:linear-gradient(140deg,#1c3325aa,#0c2015);border-radius:8px;padding:25px;display:flex;flex-direction:column}.panel-intro h2{font:500 42px/.96 var(--display);margin:13px 0 13px}.panel-intro h2 em{font-weight:400;color:#b6c3a8}.panel-intro p{font-size:9px;color:var(--muted);margin:0 0 24px}.gold{background:linear-gradient(110deg,#ead39a,#bfa164);border-color:#dbbf80;color:#192719;font-weight:800;box-shadow:0 6px 18px #0003}.gold:hover:not(:disabled){background:#ecd39c}.new{display:flex;justify-content:space-between;font-size:10px;padding:13px 16px}.turn{display:flex;gap:11px;align-items:center;padding:22px 0}.dot{height:9px;width:9px;background:#53af8c;border-radius:50%;box-shadow:0 0 12px #77dd9366}.turn b{font-size:11px;display:block}.turn small{font-size:8px;line-height:1.7;color:var(--muted);display:block;margin-top:5px}.section-label{display:flex;justify-content:space-between;font-size:6px;letter-spacing:1.4px;color:#baa574;padding:0 0 12px;border-bottom:1px solid var(--line)}.players{padding-top:6px}.player-row{display:flex;align-items:center;gap:10px;border-bottom:1px solid #bca2621a;padding:13px 0}.player-row .seat-gem{margin:0;width:13px;height:13px}.player-data{flex:1}.player-data b{font:20px var(--display);display:block}.player-data small{font-size:6px;letter-spacing:.8px;color:var(--muted)}.player-row .score{font:23px var(--display);color:#e2cb90}.player-row .score small{font:8px var(--body);color:var(--muted)}.progress{height:2px;background:#ffffff12;margin-top:7px}.progress>i{display:block;height:2px;background:var(--gem);width:var(--progress)}.player-row.current .player-data b{color:#ecdca9}.actions{display:flex;justify-content:space-between;gap:10px;padding:19px 0 15px}.actions button{border:0;padding:0;background:none;color:#d1b779;font-size:20px}.actions button span{display:block;font-size:7px;color:#b8c2ab;margin-top:5px}.tip{margin-top:auto;border-top:1px solid var(--line);padding-top:17px}.tip .eyebrow{font-size:6px}.tip p{font:italic 19px/1.4 var(--display);color:#b2c1a7;margin:8px 0 17px}.saved{border-top:1px solid var(--line);padding-top:13px;font-size:6px;color:#8f9f8d;line-height:1.6}.collection{display:flex;align-items:center;justify-content:space-between;padding:39px 20px 30px;gap:30px}.collection h2{font:500 35px/1.05 var(--display);margin:12px 0}.collection h2 em{font-weight:400;color:#a4b59c}.collection p{font-size:9px;line-height:1.9;color:var(--muted)}.collection button{font-size:9px;border:0;border-bottom:1px solid #b89d5b;border-radius:0;padding:7px 0;color:var(--gold);background:none}.gem-display{position:relative;width:300px;height:180px;display:flex;justify-content:center;align-items:center;gap:12px;filter:drop-shadow(0 20px 12px #0008)}.gem-display i{width:65px;height:65px;background:radial-gradient(circle at 28% 23%,#ffffff,#b1b57b 4%,#2c9b70 12%,#0c7052 38%,#002a21 75%,#00271f);border-radius:50%;box-shadow:inset -6px -9px 14px #000b,inset 3px 5px 6px #ddffd344,0 0 0 2px #b99b52,0 5px 0 2px #59431c}.gem-display i:nth-child(2){width:100px;height:100px;background:radial-gradient(circle at 30% 22%,#fff,#f1deb1 5%,#ce8f40 15%,#744516 55%,#321e09 85%);transform:translateY(-15px)}.gem-display i:nth-child(3){background:radial-gradient(circle at 28% 23%,#fff,#d7a0a0 4%,#b53a4a 12%,#7c122d 38%,#25020a 75%)}.gem-display>span{position:absolute;bottom:0;font-size:5px;letter-spacing:2px;color:#bfaa77}.edition{min-width:200px;border-left:1px solid var(--line);padding-left:27px;display:flex;flex-direction:column;gap:12px}.edition>span{font:27px var(--display);color:#d8c38d}.edition b{font-size:8px;letter-spacing:2px;color:#d2bf8c}.edition small{font-size:5px;letter-spacing:1px;color:#9eae94}.edition hr{width:35px;margin:2px 0;border:0;border-top:1px solid #a88d50}footer{border-top:1px solid var(--line);padding:22px 0;display:flex;align-items:center;justify-content:space-between;font-size:6px;letter-spacing:1.5px;color:#95a58c}footer img{height:40px;width:35px;object-fit:contain}dialog{background:linear-gradient(135deg,#1d3528,#0b1e15);border:1px solid #b59b64;border-radius:10px;color:var(--cream);width:min(720px,95vw);max-height:90dvh;overflow:auto;padding:27px;box-shadow:0 25px 80px #000b}dialog::backdrop{background:#020e0bca;backdrop-filter:blur(8px)}.modal-head{display:flex;justify-content:space-between;gap:20px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:17px}.modal-head h2{font:38px var(--display);margin:7px 0 0}.modal-head>button{border:0;font-size:28px;background:none;padding:4px}#modal-content{padding-top:15px}#modal-content p{color:#b7c6b0;line-height:1.8;font-size:11px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.field{display:flex;flex-direction:column;gap:9px;font-size:8px;color:#d5bd83;letter-spacing:1px}.field select{padding:13px 10px;background:#0b2117;color:#eddfb8;border:1px solid var(--line);border-radius:5px}.check{display:flex;align-items:center;gap:9px;color:#b2c2a9;font-size:10px;margin:20px 0}.check input{accent-color:#b99a5c}.wide{width:100%;margin-top:15px;padding:14px}.notice{font-size:9px!important;padding:13px 16px;border:1px solid var(--line);background:#b4995310;border-radius:5px}.shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.set-card{border:1px solid var(--line);border-radius:7px;padding:16px;text-align:center;background:#081c1255}.set-card.equipped{border-color:#d8bb7b}.set-card h3{font:25px var(--display);margin:15px 0 6px}.set-card small{font-size:6px;letter-spacing:1px;color:#b9a26f}.set-card p{font-size:9px!important;min-height:49px}.set-card button{width:100%;font-size:9px;padding:11px 4px}.swatches{height:100px;display:flex;align-items:center;justify-content:center;gap:6px;background:radial-gradient(ellipse,#6c432488,#051b1255);border-radius:5px}.swatches i{height:35px;width:35px;background:radial-gradient(circle at 30% 25%,#fff,var(--c) 20%,#000 130%);border-radius:50%;box-shadow:0 0 0 1px #c5ac70,2px 5px 7px #0009}.swatches i:nth-child(2){height:48px;width:48px;transform:translateY(-8px)}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.stats>div{border:1px solid var(--line);padding:20px;text-align:center}.stats strong{font:40px var(--display);display:block;color:var(--gold)}.stats small{font-size:7px;letter-spacing:1px;color:var(--muted)}.history-list{max-height:340px;overflow:auto}.history-row{display:flex;gap:15px;justify-content:space-between;padding:13px 4px;border-bottom:1px solid var(--line);font-size:10px}.history-row small{color:var(--muted);font-size:9px}.rules{padding-left:21px;font-size:11px;line-height:1.9;color:#bac9b1}.rules li{padding:5px}.result-mark{font:75px var(--display);text-align:center;color:#d9bf83}.result-text{text-align:center}.result-text h3{font:36px var(--display);margin:8px}.row-buttons{display:flex;gap:10px}.row-buttons>button{flex:1}#toast{position:fixed;z-index:100;bottom:25px;left:50%;transform:translateX(-50%);padding:13px 22px;max-width:90%;text-align:center;background:#173d29;border:1px solid #c5a561;color:#f0ddb1;border-radius:6px;font-size:11px;line-height:1.7;box-shadow:0 10px 25px #0007}#toast:empty{display:none}#fallback{position:absolute;inset:0;width:100%;height:100%;filter:drop-shadow(0 15px 10px #0008)}[hidden]{display:none!important}.focused .topbar,.focused .heading,.focused .collection,.focused footer{display:none}.focused main{max-width:none;padding:10px}.focused .layout{grid-template-columns:minmax(0,1fr) 280px}.focused #board{height:calc(100dvh - 132px);max-width:none}.focused .table-scene{min-height:0}.focused .panel-intro h2{font-size:34px}.focused .panel{max-height:calc(100dvh - 20px);overflow:auto}
@media(min-width:1500px){#board{height:650px;max-width:950px}.table-scene{min-height:650px}.panel{padding:30px}.panel-intro h2{font-size:49px}.player-row{padding:18px 0}}
@media(max-width:1100px){.heading h1 em,.dash{display:none}.layout{grid-template-columns:minmax(0,1fr) 260px;gap:14px}.panel{padding:20px}#board{height:510px}.table-scene{min-height:540px}.table-caption{left:15px;right:15px}.salon-head{padding:0 16px;gap:10px}.salon-head .pill{font-size:5px;padding:7px 9px}.salon-head .eyebrow{font-size:6px}.edition{min-width:160px}.gem-display{width:250px}.collection{padding-left:5px;padding-right:5px;gap:15px}}
@media(max-width:760px){.topbar{height:72px;padding:0 15px;gap:12px}.brand{gap:8px}.brand img{width:37px;height:46px}.brand>span{font-size:13px;letter-spacing:1.2px}.brand small{font-size:5px;letter-spacing:2px}.topbar nav{display:none}.wallet{margin-left:auto;padding:7px 12px 7px 8px;gap:9px}.coin{width:24px;height:24px;border-width:2px}.wallet b{font-size:11px}.wallet small{font-size:5px}.wallet>span:last-child{display:none}main{padding:0 12px}.heading{padding:22px 2px 20px;gap:10px;align-items:flex-end}.heading .eyebrow{font-size:5px;letter-spacing:1.6px}.heading h1{font-size:33px;margin:9px 0 0}.help{font-size:8px;padding:4px 0;white-space:nowrap}.layout{display:flex;flex-direction:column;gap:12px}.salon-head{height:60px;padding:0 12px;gap:8px}.salon-head small{font-size:4px;letter-spacing:1px}.salon-head .eyebrow{font-size:6px;letter-spacing:1.5px}.salon-head .pill{padding:6px 8px;font-size:5px;letter-spacing:.5px}.salon-head button{padding:5px 7px;font-size:10px}.salon-head button span{display:none}#board{height:auto;aspect-ratio:1/1.12;width:100%;margin:20px auto;max-width:550px}.table-scene{min-height:0}.opponent{top:7px}.your-seat{bottom:7px}.portrait{width:27px;height:27px}.seat-info b{font-size:17px}.seat-info small{font-size:4px}.opponent,.your-seat{gap:7px;padding:4px 11px 4px 4px}.seat-gem{width:8px;height:8px;margin-left:7px}.table-caption{left:12px;right:12px;font-size:4px;letter-spacing:1px}.table-tools{padding:12px 14px}.table-tools button span{font-size:6px;margin-left:3px}.table-tools button{font-size:10px}.panel{padding:18px;display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.panel-intro{display:none}.new{grid-column:2;grid-row:1;font-size:9px;padding:10px 13px;align-self:center}.turn{grid-column:1;grid-row:1;padding:0}.turn b{font-size:10px}.turn small{font-size:7px}.section-label{grid-column:1/-1;margin-top:20px}.players{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.player-row{padding:11px 0;gap:9px}.player-data b{font-size:19px}.player-data small{font-size:5px}.player-row .score{font-size:20px}.player-row .seat-gem{width:10px;height:10px}.actions{grid-column:1/-1;justify-content:space-around;padding:18px 0 14px}.actions button{font-size:19px}.actions button span{font-size:7px}.tip{display:none}.saved{grid-column:1/-1;font-size:6px}.collection{padding:28px 4px 25px;flex-wrap:wrap;gap:14px}.collection>div:first-child{width:100%}.collection h2{font-size:34px}.collection .eyebrow{font-size:6px}.collection p{font-size:9px}.gem-display{width:185px;height:150px;gap:9px;flex:1}.gem-display i{width:42px;height:42px}.gem-display i:nth-child(2){width:64px;height:64px}.gem-display>span{font-size:4px;letter-spacing:1px}.edition{min-width:132px;padding-left:16px}.edition b{font-size:6px;letter-spacing:1px}.edition small{font-size:4px;letter-spacing:.4px}footer{font-size:4px;letter-spacing:.5px;padding:18px 0;gap:8px}footer img{width:25px;height:30px}dialog{padding:20px}.modal-head h2{font-size:32px}.modal-head .eyebrow{font-size:6px}.form-grid{gap:15px 12px}.field{font-size:7px}.field select{font-size:10px;padding:12px 6px}.shop-grid{grid-template-columns:1fr}.set-card{display:grid;grid-template-columns:110px 1fr;gap:0 14px;text-align:left;padding:14px}.swatches{grid-row:1/5;height:118px;align-self:center;gap:4px}.swatches i{width:23px;height:23px}.swatches i:nth-child(2){width:33px;height:33px}.set-card h3{font-size:23px;margin:0 0 6px}.set-card p{min-height:0!important;font-size:8px!important}.set-card small{font-size:5px}.stats>div{padding:18px 5px}.stats small{font-size:6px}.focused main{padding:6px}.focused .layout{display:flex}.focused #board{height:auto;aspect-ratio:1/1.12;max-height:none}.focused .panel{max-height:none}.focused .table-scene{min-height:0}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media(pointer:coarse){.hole-hit{min-width:20px}}
.many-seats .panel-intro h2{font-size:32px}.many-seats .panel-intro h2 br{display:none}.many-seats .panel-intro p{margin-bottom:17px}.many-seats .tip{display:none}.many-seats .player-row{padding:9px 0}
.table-scene:before{display:none}
