@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Playfair+Display:wght@500;600;700&display=swap');
:root{--bg:#181715;--bg2:#24211f;--panel:#282523;--panel2:#34302c;--gold:#d8b681;--gold2:#f1d4a7;--text:#f4ecdf;--muted:#b4a9a0;--line:rgba(224,192,145,.26);--green:#174137;--bad:#f18c87;--pink:#cf979c;font-family:Manrope,system-ui,-apple-system,sans-serif;color:var(--text);background:var(--bg)}*{box-sizing:border-box}body{padding:0;margin:0;min-height:100vh;background:radial-gradient(circle at 25% 0,rgba(95,75,57,.3),transparent 45%),var(--bg)}button,input,textarea{font:inherit}button{cursor:pointer;color:inherit}button:disabled{opacity:.45;cursor:not-allowed}.hidden{display:none!important}h1,h2,h3,p{margin:0}h1,h2,.serif{font-family:'Playfair Display',Georgia,serif;font-weight:600}.app{max-width:640px;margin:auto;padding-bottom:85px}header{height:71px;display:flex;align-items:center;gap:10px;padding:9px 17px;border-bottom:1px solid var(--line);background:rgba(23,20,18,.85);position:sticky;top:0;z-index:5;backdrop-filter:blur(15px)}header .logo{width:41px;height:55px;object-fit:contain;object-position:top}header .brand{display:flex;flex-direction:column;gap:0;flex:1}.brand small{color:var(--gold);font-size:9px;letter-spacing:.17em}.brand strong{font:26px Georgia,serif;line-height:1.1}.profile-chip{border:1px solid var(--line);background:#302a25;border-radius:50%;width:43px;height:43px;overflow:hidden;padding:0;font-size:20px}.profile-chip img{width:100%;height:100%;object-fit:cover}#screen{padding:15px 15px 25px;min-height:70vh}.plain{border:0;background:transparent;font-size:26px;width:32px;height:40px}.splash{position:fixed;inset:0;z-index:99;background:radial-gradient(circle at center 38%,#443527,transparent 72%),#171615;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:26px;text-align:center}.splash img{width:56%;max-width:230px;max-height:350px;object-fit:contain;filter:drop-shadow(0 0 22px rgba(230,197,132,.18))}.splash h1{margin:24px 0 7px;font-size:clamp(25px,8vw,38px);line-height:1.14;color:#e6cfaa}.splash p{font-size:12px;line-height:1.7;color:#c2b6a7}.load{margin-top:35px;height:5px;width:65%;max-width:280px;background:#3d352e;border-radius:20px;overflow:hidden}.load span{display:block;width:60%;height:100%;border-radius:20px;background:linear-gradient(90deg,#9a7651,#f1d7a3);animation:loading 1.5s ease-in-out infinite alternate}@keyframes loading{from{transform:translateX(-100%)}to{transform:translateX(180%)}}
.eyebrow{font-size:10px;letter-spacing:.17em;text-transform:uppercase;color:var(--gold);font-weight:800}.heading{margin:7px 0 17px;font-size:30px;line-height:1.1}.lead{color:var(--muted);font-size:12px;line-height:1.7;margin:9px 0 16px}.panel{background:linear-gradient(135deg,#342e27,#24211e);border:1px solid var(--line);border-radius:20px;padding:17px;box-shadow:0 12px 40px rgba(0,0,0,.12);margin-bottom:13px}.panel.paper{background:linear-gradient(150deg,#e9d5b7,#f5e4ca);color:#31241b;border-color:#d4b78a;box-shadow:0 8px 20px #0004}.btn{border-radius:13px;padding:13px 15px;border:1px solid var(--line);font-size:13px;font-weight:800;background:#38302b;min-height:45px}.btn.primary{border-color:#e2bd82;color:#261e16;background:linear-gradient(135deg,#f3d7a7,#d3ac70);box-shadow:0 9px 24px #d6ab6c22}.btn.secondary{background:#201d1b}.btn.full{width:100%}.btn-row{display:flex;gap:8px;flex-wrap:wrap}.btn-row .btn{flex:1}.hero{position:relative;border-radius:23px;padding:25px 18px 18px;overflow:hidden;background:linear-gradient(140deg,rgba(41,31,26,.75),rgba(23,18,16,.95)),url('/salon/salon_back.webp') center 26%/cover;border:1px solid var(--line);min-height:185px;display:flex;flex-direction:column;justify-content:flex-end;margin-bottom:16px}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(18,16,14,.9),transparent 95%)}.hero>*{position:relative}.hero img{width:75px;height:105px;object-fit:contain;align-self:flex-start;position:absolute;top:-14px;right:8px}.hero h1{font-size:29px;line-height:1.1;margin-top:6px}.hero p{font-size:11px;color:#dfd0ba;margin-top:8px;max-width:290px}.tiles{display:grid;grid-template-columns:1fr;gap:12px}.tile{display:flex;gap:14px;min-height:118px;align-items:center;overflow:hidden;text-align:left;padding:12px;border-radius:19px;border:1px solid #665446;background:linear-gradient(115deg,#2d342f,#171a18);width:100%}.tile.story{background:linear-gradient(115deg,#6b4e37,#383023)}.tile.quiz{background:linear-gradient(115deg,#513832,#251d21)}.tile img{width:91px;height:92px;object-fit:contain;flex-shrink:0;filter:drop-shadow(0 6px 9px #0005)}.tile b{font:600 24px Georgia,serif;display:block;color:#f1d2a5}.tile small{font-size:11px;line-height:1.5;color:#d5c8bb}.tile .arrow{margin-left:auto;color:var(--gold);font-size:26px}.section-title{font:600 21px Georgia,serif;margin:19px 0 12px}.meta{display:flex;align-items:center;justify-content:space-between;gap:8px}.badge{font-size:10px;border:1px solid var(--line);padding:6px 10px;color:var(--gold2);border-radius:16px;white-space:nowrap}.muted{font-size:12px;color:var(--muted);line-height:1.6}.mini-input{border:1px solid #67584b;background:#1c1a18;color:white;border-radius:10px;padding:12px 10px;min-width:0;width:100%;outline:none}.mini-input:focus{border-color:var(--gold)}.player-row{display:flex;gap:9px;align-items:center;margin-bottom:11px}.avatar{width:39px;height:39px;object-fit:cover;border-radius:50%;border:1px solid #c9a779;background:#594b3d;display:grid;place-items:center;color:#e7d2ab;flex-shrink:0;font-weight:800}.avatars{display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin:11px 0}.avatars .avatar{width:40px;height:40px}.avatar.me{box-shadow:0 0 0 2px var(--gold2)}.player-row b{font-size:13px}.player-row small{color:var(--muted);display:block;font-size:11px}.join-box{display:flex;gap:8px;margin-top:14px}.join-box .mini-input{flex:1}.room-card{display:flex;align-items:center;gap:9px;padding:11px;border-radius:14px;border:1px solid var(--line);background:#292522;margin-bottom:9px}.room-icon{font-size:25px;width:40px;text-align:center}.room-card .details{flex:1;min-width:0}.room-card .details b{font-size:13px;display:block}.room-card .details small{font-size:10px;color:#c4b7a7}.room-card .btn{padding:9px;font-size:11px;min-height:33px}.nav-help{font-size:12px;color:#cdbb9e;border:1px solid var(--line);background:#2b2521;border-radius:12px;padding:10px;margin-bottom:12px;line-height:1.6}
#navbar{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:640px;height:calc(67px + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);display:grid;grid-template-columns:repeat(4,1fr);z-index:7;background:#1c1a19;border-top:1px solid var(--line)}#navbar button{border:0;background:transparent;color:#a69a8a;font-size:24px;display:grid;place-content:center;gap:2px}#navbar button span{font-size:10px}#navbar button.selected{color:#eac58e}.game-mode #navbar{display:none}.game-mode .app{padding-bottom:185px}.game-mode #screen{padding-bottom:65px}.chat-dock{position:fixed;z-index:6;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:640px;background:linear-gradient(180deg,#29241eea,#1a1918fa);border:1px solid #977c594a;border-radius:17px 17px 0 0;padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px));backdrop-filter:blur(16px)}.chat-expand{display:flex;align-items:center;gap:7px;width:100%;border:0;background:none;font-size:12px;color:var(--gold);font-weight:800;text-align:left}.chat-expand span{flex:1}.chat-expand b{font-size:10px;border:1px solid #735f4e;padding:1px 6px;border-radius:20px}.chat-line{font-size:11px;display:flex;align-items:center;gap:5px;min-height:22px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.chat-line b{color:var(--gold);font-size:10px}.chat-line img{height:35px;width:35px;object-fit:contain}.chat-compose{display:flex;gap:7px;margin-top:5px;align-items:center}.chat-compose input{flex:1;min-width:0;border:1px solid #685548;background:#171615;border-radius:22px;padding:9px 12px;color:#fff;font-size:12px}.iconbtn,.send{border:1px solid #8a6b4e;background:#2c2620;color:#efd1a0;width:33px;height:33px;flex-shrink:0;border-radius:50%;font-size:20px}.send{background:#dbb982;color:#241b16}.sticker-tray{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;max-height:205px;overflow:auto;padding-top:10px}.sticker-tray button{border:0;border-radius:11px;background:#3c3129;padding:4px;min-height:76px}.sticker-tray img{height:83px;max-width:100%;object-fit:contain}.sticker-links{font-size:10px;grid-column:1/-1;color:#e3bb83;line-height:1.5}.sticker-links a{color:#e8c995}.modal{position:fixed;inset:0;z-index:25;background:#000a;display:flex;justify-content:center;align-items:flex-end}.modal-sheet{width:100%;max-width:640px;height:75vh;border-radius:22px 22px 0 0;background:#292420;border:1px solid var(--line);padding:16px;display:flex;flex-direction:column}.modal-title{display:flex;justify-content:space-between;align-items:center;font:20px Georgia,serif}.chat-all{flex:1;overflow:auto;margin-top:12px}.modal .chat-line{white-space:normal;margin:12px 0;font-size:13px}.modal .chat-line img{width:100px;height:95px}.toast{position:fixed;z-index:100;bottom:100px;left:50%;transform:translate(-50%,140px);background:#e9c99b;color:#241b16;padding:11px 17px;border-radius:14px;box-shadow:0 10px 30px #0009;font-size:13px;max-width:90vw;text-align:center;transition:.2s}.toast.on{transform:translate(-50%,0)}
.game-head{margin-bottom:11px}.board{min-height:250px;background:radial-gradient(ellipse at center,#295645,#173b31 55%,#0c2922);border:4px ridge #a78b60;border-radius:37px;padding:18px 10px;position:relative}.players-board{display:flex;justify-content:center;gap:11px;flex-wrap:wrap}.player-head{text-align:center;max-width:70px}.player-head .avatar{margin:auto;width:37px;height:37px}.player-head span{font-size:10px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-head small{font-size:9px;color:#dfc7a0}.cards-on-table{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;min-height:114px;margin:17px 0 0}.pair{display:flex;align-items:center}.pair .playing-card:nth-child(2){margin-left:-23px;transform:translateY(-14px) rotate(8deg)}.playing-card{height:86px;width:59px;flex:0 0 auto;background:#fff9ee;border:2px solid #d7b88b;box-shadow:0 5px 11px #0007;border-radius:7px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#26251f;overflow:hidden}.playing-card.red{color:#c53f38}.playing-card .cornerrank{position:absolute;top:2px;left:4px;z-index:2;font:bold 13px Georgia}.playing-card .largesuit{font:31px Georgia,serif}.playing-card .face-image{height:71px;max-width:99%;object-fit:contain;z-index:1}.playing-card .bottomrank{position:absolute;bottom:2px;right:3px;transform:rotate(180deg);font:bold 11px Georgia;z-index:2}.hand{display:flex;gap:4px;overflow-x:auto;padding:12px 0;justify-content:flex-start}.hand .playing-card{cursor:pointer;min-width:59px}.hand .playing-card:active{transform:translateY(-8px)}.card-ctrl{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:12px;margin:9px 0}.action-ctrl{display:flex;gap:7px}.action-ctrl .btn{flex:1}.table-meta{display:flex;gap:7px;align-items:center;margin:12px 0}.table-meta .badge{flex:1;text-align:center;font-size:11px}.paperline{display:grid;grid-template-columns:34px minmax(0,1fr);gap:9px;padding:10px 7px;border-bottom:1px dashed #987e604a}.paperline .avatar{width:32px;height:32px}.paperline .q{font:16px Georgia,serif;font-weight:bold}.paperline .by{font-size:10px;color:#6e5847}.paperline .answer{font-size:13px;margin-top:5px;background:#fff5e6aa;border:1px dashed #b5977d;border-radius:9px;padding:9px}.paperline .cover{filter:blur(0);color:#8b7b72;font-size:11px}.paperline .live{font-size:12px;color:#b45653}.quiz-q{font:600 22px Georgia,serif;margin:15px 0;line-height:1.35}.quiz-choice{width:100%;text-align:left;padding:14px;border:1px solid #685545;border-radius:14px;background:#29231e;color:#eee0cc;display:block;margin:8px 0;min-height:50px;font-size:13px}.quiz-choice.selected{background:#5e503e;border-color:#e7c58d}.quiz-choice.correct{border-color:#7ab08a;background:#274735}.quiz-choice.wrong{border-color:#df7970}.score-item{display:flex;align-items:center;gap:10px;margin:8px 0;padding:8px;background:#302a24;border-radius:12px;font-size:12px}.score-item b{margin-left:auto;color:var(--gold)}.result{border:1px solid var(--gold);border-radius:20px;background:radial-gradient(circle at 50% 0,#564331,#2b2420 65%);padding:23px 14px;text-align:center;margin:12px 0}.result h1{color:#f2d7a9;font-size:32px;margin:14px 0}.result .icon{font-size:64px}.profile-row{display:flex;align-items:center;gap:14px}.profile-row .avatar{width:85px;height:85px}.big-num{font:30px Georgia,serif;color:var(--gold2)}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:9px}.grid2 .panel{margin:0}.grid2 b{display:block;font-size:20px;color:var(--gold)}.grid2 small{font-size:11px;color:var(--muted)}@media(max-width:365px){.tile img{width:72px;height:77px}.tile b{font-size:20px}.board{padding:9px 6px}.playing-card{height:76px;width:51px;min-width:51px}.panel{padding:12px}.hand .playing-card{min-width:51px}}

/* Informational cards on the table must stay opaque. Buttons are disabled only to prevent clicks. */
.playing-card:disabled{opacity:1;filter:none;cursor:default;color:#25231f}
.playing-card.red:disabled{color:#c53f38}
