/* Mythovaryx.xyz - Luxe Card Room Theme */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;600;700&family=Outfit:wght@300;400;500;700&display=swap');

:root{--navy:#0a0f1e;--velvet:#131a30;--gold:#d4a843;--silver:#c0c0c0;--pearl:#ede8df;--slate:#6b7a90}
*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}
body{font-family:'Outfit',sans-serif;background:var(--navy);color:var(--pearl);overflow-x:hidden}

.bar{position:fixed;top:0;width:100%;z-index:999;background:rgba(10,15,30,.97);backdrop-filter:blur(12px);height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 4%;border-bottom:1px solid rgba(212,168,67,.15)}
.bar .mark{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:1.5rem;color:var(--gold);text-decoration:none;display:flex;align-items:center;gap:8px;letter-spacing:1px}
.bar .mark svg{width:30px;height:30px}
.bar .tabs{display:flex;gap:1.6rem;list-style:none}
.bar .tabs a{color:var(--slate);text-decoration:none;font-weight:500;font-size:.88rem;transition:color .2s;letter-spacing:.5px}
.bar .tabs a:hover,.bar .tabs a.now{color:var(--gold)}
.mbtn{display:none;background:none;border:none;cursor:pointer;z-index:1001}
.mbtn i{display:block;width:26px;height:2px;background:var(--gold);margin:6px 0;border-radius:1px;transition:all .3s;font-style:normal}
.mbtn.act i:first-child{transform:rotate(45deg) translate(5px,7px)}
.mbtn.act i:nth-child(2){opacity:0}
.mbtn.act i:last-child{transform:rotate(-45deg) translate(5px,-7px)}
@media(max-width:768px){.mbtn{display:block}.bar .tabs{position:fixed;top:0;right:-100%;width:75%;max-width:300px;height:100vh;background:var(--velvet);flex-direction:column;padding:80px 2rem;gap:1.3rem;transition:right .35s}.bar .tabs.open{right:0}}

.salon{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:90px 5% 50px;gap:3rem;background:radial-gradient(ellipse at 40% 40%,rgba(212,168,67,.04) 0%,transparent 50%),var(--navy)}
.salon-text h1{font-family:'Cormorant Garamond',serif;font-size:clamp(2rem,4.5vw,3.5rem);font-weight:700;line-height:1.15;margin-bottom:1rem}
.salon-text h1 .gilded{color:var(--gold)}
.salon-text p{color:var(--slate);font-size:1.05rem;line-height:1.7;margin-bottom:2rem;max-width:480px}
.btn-gold{display:inline-block;padding:14px 38px;background:linear-gradient(135deg,var(--gold),#c49530);color:var(--navy);font-family:'Cormorant Garamond',serif;font-weight:700;font-size:1rem;text-decoration:none;border-radius:4px;border:none;cursor:pointer;transition:transform .3s,box-shadow .3s;letter-spacing:1px}
.btn-gold:hover{transform:translateY(-3px);box-shadow:0 6px 25px rgba(212,168,67,.3)}
.salon-vis{display:flex;justify-content:center}
.card-display{width:100%;max-width:350px;aspect-ratio:3/4;background:var(--velvet);border:1px solid rgba(212,168,67,.15);border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:5rem}
@media(max-width:768px){.salon{grid-template-columns:1fr;text-align:center}.salon-text p{margin-left:auto;margin-right:auto}.card-display{max-width:220px;font-size:3.5rem;margin:0 auto}}

.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;padding:3rem 5%;max-width:1200px;margin:0 auto}
.tri{background:var(--velvet);border-radius:12px;padding:2rem;text-align:center;border:1px solid rgba(212,168,67,.06);transition:border-color .3s}
.tri:hover{border-color:rgba(212,168,67,.25)}
.tri .ti{font-size:2rem;margin-bottom:.6rem}
.tri h3{font-family:'Cormorant Garamond',serif;font-size:1.1rem;color:var(--gold);margin-bottom:.4rem}
.tri p{color:var(--slate);font-size:.88rem;line-height:1.5}
@media(max-width:700px){.trio{grid-template-columns:1fr}}

.table{padding:3rem 4%;max-width:1200px;margin:0 auto}
.table h2{font-family:'Cormorant Garamond',serif;text-align:center;color:var(--gold);font-size:clamp(1.3rem,3vw,1.8rem);margin-bottom:1.2rem;letter-spacing:1px}
.table-frame{width:100%;max-width:960px;margin:0 auto;aspect-ratio:5/4;border-radius:12px;overflow:hidden;border:2px solid rgba(212,168,67,.12);background:#000}
.table-frame iframe{width:100%;height:100%;border:none}

.selling{display:flex;gap:1.5rem;flex-wrap:wrap;justify-content:center;padding:3rem 5%;max-width:1200px;margin:0 auto}
.sell-pt{flex:1;min-width:250px;max-width:350px;background:linear-gradient(145deg,var(--velvet),rgba(19,26,48,.5));border-radius:10px;padding:1.5rem;border-left:3px solid var(--gold)}
.sell-pt h3{font-family:'Cormorant Garamond',serif;font-size:1rem;color:var(--gold);margin-bottom:.4rem}
.sell-pt p{color:var(--slate);font-size:.88rem;line-height:1.5}

.page{padding:110px 5% 50px;max-width:880px;margin:0 auto}
.page h1{font-family:'Cormorant Garamond',serif;font-size:clamp(1.8rem,4vw,2.5rem);color:var(--gold);margin-bottom:1.2rem;letter-spacing:1px}
.page h2{font-family:'Cormorant Garamond',serif;font-size:1.2rem;color:var(--silver);margin:1.8rem 0 .6rem}
.page p{color:var(--slate);line-height:1.8;margin-bottom:.8rem}
.page ul{list-style:none;margin-bottom:1rem}
.page ul li{color:var(--slate);padding:.25rem 0 .25rem 1.2rem;position:relative}
.page ul li::before{content:'\2022';color:var(--gold);position:absolute;left:0;font-weight:bold}

.play-h{padding:90px 5% 25px;text-align:center}
.play-h h1{font-family:'Cormorant Garamond',serif;font-size:clamp(1.8rem,4vw,2.5rem);color:var(--gold);margin-bottom:.6rem}
.play-h p{color:var(--slate);max-width:620px;margin:0 auto}
.play-t{padding:1.5rem 3%;max-width:1100px;margin:0 auto 3rem}
.play-t .table-frame{max-width:100%}

.floor{background:var(--velvet);border-top:1px solid rgba(212,168,67,.12);padding:2.5rem 5%;text-align:center}
.floor-nav{display:flex;justify-content:center;gap:1.5rem;flex-wrap:wrap;margin-bottom:1rem}
.floor-nav a{color:var(--slate);text-decoration:none;font-size:.85rem;transition:color .3s}
.floor-nav a:hover{color:var(--gold)}
.rg-part{margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(212,168,67,.06)}
.rg-part p{color:var(--slate);font-size:.78rem;margin-bottom:.4rem}
.rg-part a{color:var(--gold);text-decoration:none;font-size:.78rem;margin:0 .5rem}
.rg-part a:hover{text-decoration:underline}
.floor-cp{color:var(--slate);font-size:.72rem;margin-top:1rem;opacity:.5}

.veil{position:fixed;inset:0;background:rgba(0,0,0,.95);z-index:9999;display:flex;align-items:center;justify-content:center}
.veil.closed{display:none}
.veil-card{background:var(--velvet);border:2px solid var(--gold);border-radius:14px;padding:2.5rem;text-align:center;max-width:420px;width:90%}
.veil-card h2{font-family:'Cormorant Garamond',serif;color:var(--gold);font-size:1.5rem;margin-bottom:.7rem}
.veil-card p{color:var(--slate);margin-bottom:1.5rem;font-size:.92rem}
.veil-btns{display:flex;gap:.8rem;justify-content:center}
.veil-btns button{padding:10px 30px;border-radius:4px;font-family:'Cormorant Garamond',serif;font-weight:700;font-size:.92rem;cursor:pointer;border:2px solid var(--gold);transition:all .3s;letter-spacing:.5px}
.v-yes{background:var(--gold);color:var(--navy)}
.v-yes:hover{box-shadow:0 4px 18px rgba(212,168,67,.35)}
.v-no{background:transparent;color:var(--gold)}
.v-no:hover{background:rgba(212,168,67,.08)}