@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Playfair+Display:ital,wght@0,600;1,600&display=swap";:root{color:#26362f;font-synthesis:none;text-rendering:optimizelegibility;--ink:#26362f;--muted:#778079;--cream:#fffaf5;--paper:#fffcf8;--rose:#c75f62;--rose-dark:#9f4148;--sage:#6f8879;--line:#e5ddd4;background:#f7f2ec;font-family:DM Sans,system-ui,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{color:inherit}button:focus-visible,a:focus-visible{outline-offset:3px;outline:3px solid #c75f625c}.app-shell{background:radial-gradient(circle at 12% 20%,#e6b4a524,#0000 28%),linear-gradient(120deg,#f8f2ec 0%,#fffaf5 52%,#f4f1eb 100%);min-height:100vh}.topbar{border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);z-index:20;background:#fffcf8e0;grid-template-columns:1fr auto 1fr;align-items:center;height:74px;padding:0 42px;display:grid;position:sticky;top:0}.brand{width:fit-content;color:var(--ink);align-items:center;gap:11px;font-family:Playfair Display,Georgia,serif;font-size:21px;font-weight:600;text-decoration:none;display:inline-flex}.brand i{color:var(--rose);font-weight:600}.brand-mark{width:34px;height:34px;color:var(--cream);background:var(--rose);border-radius:50% 50% 47% 53%;place-items:center;display:grid;transform:rotate(-5deg);box-shadow:0 5px 14px #9f41482e}.brand-mark svg{transform:rotate(5deg)}.room-pill{color:#7c827d;background:#f5f1eb;border:1px solid #e7e0d8;border-radius:999px;align-items:center;gap:9px;padding:8px 14px;font-size:12px;display:flex}.room-pill strong{color:var(--ink);letter-spacing:.11em;border-left:1px solid #d8d1c8;padding-left:8px;font-size:11px}.live-dot{background:#6c9a71;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 4px #6c9a711f}.top-actions{justify-content:flex-end;align-items:center;gap:10px;display:flex}.avatars{padding-left:8px;display:flex}.avatar{border:2px solid var(--paper);color:#fff;border-radius:50%;place-items:center;width:31px;height:31px;margin-left:-8px;font-size:11px;font-weight:600;display:grid}.avatar-you{background:#87968d}.avatar-sam{background:#c47b6e}.together-label{color:var(--muted);font-size:12px}.icon-button{cursor:pointer;background:0 0;border:0;place-items:center;padding:7px;display:grid}.workspace{grid-template-columns:325px minmax(0,1fr);max-width:1480px;min-height:calc(100vh - 142px);margin:0 auto;display:grid}.sidebar{border-right:1px solid var(--line);background:#fffaf56b;padding:45px 32px 38px 42px}.eyebrow,.modal-eyebrow{color:var(--rose);letter-spacing:.18em;text-transform:uppercase;align-items:center;gap:7px;font-size:10px;font-weight:600;display:flex}.sidebar h1{letter-spacing:-.035em;margin:11px 0 13px;font-family:Playfair Display,Georgia,serif;font-size:clamp(36px,3.3vw,49px);line-height:.98}.sidebar h1 em{color:var(--rose);font-weight:600}.intro{max-width:245px;color:var(--muted);margin:0;font-size:13px;line-height:1.65}.side-section{margin-top:30px}.section-heading{align-items:center;gap:10px;margin-bottom:13px;display:flex}.section-heading>span{color:#acaaa4;font-family:Playfair Display,Georgia,serif;font-size:10px;font-style:italic}.section-heading h2{margin:0;font-size:12px;font-weight:600}.photo-card{cursor:pointer;background:#ddd;border:0;border-radius:12px;width:100%;height:118px;padding:0;position:relative;overflow:hidden;box-shadow:0 8px 24px #333c3517}.photo-card img{object-fit:cover;width:100%;height:100%;transition:transform .35s;display:block}.photo-card:hover img{transform:scale(1.035)}.photo-overlay{color:#fff;background:#1f2c27c7;border-radius:7px;align-items:center;gap:6px;padding:7px 9px;font-size:10px;display:flex;position:absolute;bottom:9px;right:9px}.photo-name{color:var(--muted);text-transform:capitalize;margin:8px 2px 0;font-size:10px}.visually-hidden{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.difficulty-list{gap:7px;display:grid}.difficulty-option{text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:9px;grid-template-columns:auto 1fr auto;align-items:center;gap:11px;width:100%;min-height:48px;padding:8px 11px;transition:all .2s;display:grid}.difficulty-option:hover{background:#ffffff8c}.difficulty-option.active{background:#ffffffc2;border-color:#d8cfc6;box-shadow:0 6px 16px #353d380d}.difficulty-option strong,.difficulty-option small{display:block}.difficulty-option strong{font-size:11px;font-weight:600}.difficulty-option small{color:#949891;margin-top:2px;font-size:9px}.difficulty-option>svg{color:var(--rose)}.radio{border:1px solid #bbb8b1;border-radius:50%;width:15px;height:15px;padding:3px}.radio span{border-radius:50%;width:100%;height:100%;display:block}.active .radio{border-color:var(--rose)}.active .radio span{background:var(--rose)}.invite-card{border-top:1px solid var(--line);grid-template-columns:auto 1fr auto;align-items:center;gap:9px;margin-top:29px;padding-top:20px;display:grid}.invite-icon{width:30px;height:30px;color:var(--sage);background:#e8eee9;border-radius:50%;place-items:center;display:grid}.invite-card strong,.invite-card span{display:block}.invite-card strong{font-size:10px}.invite-card span{color:#92968f;margin-top:2px;font-size:8px}.invite-card button{color:var(--rose-dark);cursor:pointer;background:0 0;border:0;align-items:center;gap:5px;padding:6px 8px;font-size:9px;font-weight:600;display:flex}.game-area{padding:42px clamp(35px,5vw,76px) 50px;overflow:hidden}.game-header{justify-content:space-between;align-items:flex-end;gap:25px;display:flex}.game-kicker{color:var(--rose);letter-spacing:.14em;text-transform:uppercase;margin:0 0 6px;font-size:9px;font-weight:600}.game-header h2{margin:0;font-family:Playfair Display,Georgia,serif;font-size:27px}.game-tools{align-items:center;gap:8px;display:flex}.game-tools button,.time{border:1px solid var(--line);color:#66716a;background:#ffffff80;border-radius:8px;align-items:center;gap:6px;min-height:33px;padding:7px 10px;font-size:10px;display:flex}.game-tools button{cursor:pointer}.game-tools button:hover{color:var(--ink);background:#fff}.time{font-variant-numeric:tabular-nums;background:0 0;border:0}.progress-row{grid-template-columns:auto minmax(120px,1fr) 34px;align-items:center;gap:15px;margin:25px 0 22px;display:grid}.progress-copy{align-items:center;gap:9px;font-size:9px;display:flex}.progress-copy span{color:#a3a49f;font-family:Playfair Display,Georgia,serif;font-style:italic}.progress-copy strong{font-size:9px;font-weight:600}.progress-track{background:#e4ded6;border-radius:99px;height:3px;overflow:hidden}.progress-track span{background:linear-gradient(90deg, #d4817f, var(--rose));border-radius:99px;height:100%;transition:width .35s;display:block}.percent{color:var(--rose);text-align:right;font-size:9px;font-weight:600}.board-stage{background:linear-gradient(#ffffff73,#ffffff73),repeating-linear-gradient(45deg,#ebe4da 0 1px,#0000 1px 6px);border:1px solid #e3dbd1;border-radius:20px;justify-content:center;padding:23px;display:flex;position:relative}.puzzle-board{width:min(100%, var(--board-max-width,690px));aspect-ratio:var(--board-ratio,1.5);background:#d8d0c6;border:1px solid #cfc6bb;border-radius:9px;gap:0;padding:7px;display:grid;box-shadow:0 18px 42px #343d3721}.puzzle-slot{cursor:default;background:#fffbf678;border:1px dashed #545f5733;min-width:0;padding:0;position:relative;overflow:hidden}.puzzle-slot:first-child{border-radius:5px 0 0}.puzzle-slot.filled{border:0}.puzzle-slot:not(.filled):has(.slot-hint){cursor:pointer;background:#fff7efc7}.puzzle-slot.wrong{background:#c75f6229;animation:.38s nope}.piece-image,.loose-piece{background-image:var(--piece-image);background-size:var(--piece-size);background-position:var(--piece-position);background-repeat:no-repeat;display:block}.piece-image{animation:.3s both place;position:absolute;inset:0}.slot-hint{border:1px solid #c75f6259;border-radius:4px;animation:1.2s infinite pulse;position:absolute;inset:10%}.corner-note{color:var(--rose-dark);background:#fff7e8;align-items:center;gap:5px;padding:7px 10px;font-family:Playfair Display,Georgia,serif;font-size:10px;font-style:italic;display:flex;position:absolute;box-shadow:0 6px 14px #35302a1a}.note-one{top:14px;right:10px;transform:rotate(3deg)}.note-two{bottom:14px;left:10px;transform:rotate(-4deg)}.piece-tray-wrap{margin-top:20px}.tray-heading{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.tray-heading span{font-size:10px;font-weight:600}.tray-heading small{color:#999a94;font-family:Playfair Display,Georgia,serif;font-size:9px;font-style:italic}.piece-tray{scrollbar-width:thin;background:#ebe4da8f;border:1px solid #e1d9cf;border-radius:14px;align-items:center;gap:clamp(7px,1vw,13px);min-height:98px;padding:14px 16px;display:flex;overflow-x:auto}.loose-piece{cursor:grab;filter:drop-shadow(0 5px 6px #30373233);border:0;border-radius:0;flex:none;width:clamp(58px,7vw,84px);padding:0;transition:transform .18s,box-shadow .18s}.loose-piece:hover{filter:drop-shadow(0 9px 8px #3037323d);transform:translateY(-4px)rotate(-1deg)}.loose-piece:active{cursor:grabbing}.loose-piece.selected{filter:drop-shadow(0 0 2px var(--rose)) drop-shadow(0 7px 7px #30373238);transform:translateY(-5px)}.empty-tray{width:100%;color:var(--rose);justify-content:center;align-items:center;gap:7px;font-family:Playfair Display,Georgia,serif;font-size:12px;font-style:italic;display:flex}.date-dock{color:#f7f1e8;background:#263a34;justify-content:space-between;align-items:center;gap:24px;min-height:68px;padding:10px 42px;display:flex}.dock-message{align-items:center;gap:10px;font-size:11px;display:flex}.dock-message svg{color:#db8a88}.dock-message strong{color:#f2b0ac;margin-right:5px}.music-player{grid-template-columns:auto 1fr auto;align-items:center;gap:9px;min-width:245px;display:grid}.album-art{color:#f5d4bb;background:linear-gradient(145deg,#b8585d,#614c50);border-radius:7px;place-items:center;width:36px;height:36px;display:grid}.music-player strong,.music-player span{display:block}.music-player strong{font-size:10px}.music-player span{color:#a8b2ad;margin-top:2px;font-size:8px}.music-player button{color:#fff;cursor:pointer;background:0 0;border:1px solid #61716b;border-radius:50%;place-items:center;width:31px;height:31px;display:grid}.modal-backdrop{z-index:50;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#1c28239e;place-items:center;padding:24px;animation:.22s both fade;display:grid;position:fixed;inset:0}.reference-modal,.complete-modal{background:var(--paper);border-radius:20px;width:min(92vw,520px);padding:25px;animation:.35s both rise;position:relative;box-shadow:0 25px 70px #151d1a47}.reference-modal img{object-fit:contain;border-radius:12px;width:100%;max-height:70vh;margin-top:14px;display:block}.reference-modal p{color:var(--muted);text-align:center;margin:14px 0 0;font-family:Playfair Display,Georgia,serif;font-size:13px;font-style:italic}.modal-close{cursor:pointer;background:#f4eee8;border:0;border-radius:50%;place-items:center;width:34px;height:34px;display:grid;position:absolute;top:14px;right:14px}.complete-modal{text-align:center;max-width:430px;padding:30px}.complete-modal .modal-eyebrow{justify-content:center}.heart-burst{color:#fff;background:var(--rose);border:5px solid #f8e7e2;border-radius:50%;place-items:center;width:54px;height:54px;margin:-58px auto 19px;display:grid;box-shadow:0 8px 20px #9f414847}.complete-modal h2{margin:8px 0;font-family:Playfair Display,Georgia,serif;font-size:38px;line-height:1.02}.complete-modal h2 em{color:var(--rose)}.complete-modal p{color:var(--muted);font-size:12px}.complete-modal img{object-fit:contain;border-radius:11px;width:100%;max-height:45vh;margin:18px 0;display:block}.complete-modal>button:not(.text-button){background:var(--rose);color:#fff;cursor:pointer;border:0;border-radius:8px;align-items:center;gap:7px;padding:10px 16px;font-size:11px;font-weight:600;display:inline-flex}.complete-modal .text-button{color:#8d8f89;cursor:pointer;background:0 0;border:0;margin:13px auto 0;font-family:Playfair Display,Georgia,serif;font-size:10px;font-style:italic;display:block}@keyframes place{0%{opacity:.55;transform:scale(.85)}to{opacity:1;transform:scale(1)}}@keyframes nope{0%,to{transform:translate(0)}30%{transform:translate(-5px)}65%{transform:translate(5px)}}@keyframes pulse{50%{opacity:.35;transform:scale(.95)}}@keyframes fade{0%{opacity:0}}@keyframes rise{0%{opacity:0;transform:translateY(14px)scale(.98)}}@media (width<=900px){.topbar{grid-template-columns:1fr auto;padding:0 22px}.room-pill{display:none}.workspace{grid-template-columns:250px minmax(0,1fr)}.sidebar{padding:34px 22px}.game-area{padding:34px 24px 42px}.game-header{align-items:flex-start}.game-tools{flex-wrap:wrap;justify-content:flex-end}.corner-note{display:none}}@media (width<=680px){.topbar{height:64px;padding:0 17px}.brand{font-size:18px}.brand-mark{width:30px;height:30px}.together-label,.icon-button{display:none}.workspace{display:block}.sidebar{border-right:0;border-bottom:1px solid var(--line);padding:28px 20px}.sidebar h1 br{display:none}.intro{max-width:100%}.side-section{margin-top:24px}.photo-card{height:165px}.difficulty-list{grid-template-columns:repeat(3,1fr)}.difficulty-option{grid-template-columns:auto 1fr;padding:8px}.difficulty-option>svg{display:none}.game-area{padding:29px 14px 35px}.game-header{display:block}.game-tools{justify-content:flex-start;margin-top:15px}.progress-row{margin-top:20px}.progress-copy span{display:none}.board-stage{border-radius:13px;padding:9px}.puzzle-board{gap:1px;padding:4px}.tray-heading small{text-align:right;max-width:160px}.date-dock{padding:10px 17px}.dock-message{display:none}.music-player{width:100%;min-width:0}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}.live-dot.connecting{background:#d3a35b;animation:1.2s infinite pulse}body.modal-open{overflow:hidden}.chat-composer{flex:1;min-width:260px}.chat-composer input{color:#fffaf2;background:#ffffff14;border:1px solid #ffffff29;border-radius:9px;outline:0;flex:1;min-width:0;padding:9px 11px;font-size:12px}.chat-composer input::placeholder{color:#fffaf2a3}.chat-composer input:focus{border-color:#fff7e88f;box-shadow:0 0 0 3px #fff7e814}.chat-composer button{color:#263a34;background:#fff7e8;border:0;border-radius:50%;flex:none;place-items:center;width:34px;height:34px;padding:0;display:grid}.chat-composer button:disabled{cursor:default;opacity:.42}.settings-modal,.confirm-modal{background:#fffaf4;border:1px solid #6d61541f;border-radius:18px;width:min(92vw,430px);padding:35px;position:relative;box-shadow:0 24px 80px #21262340}.settings-modal h2,.confirm-modal h2{color:var(--forest);margin:8px 0 18px;font-family:Playfair Display,Georgia,serif;font-size:25px}.settings-modal form{gap:10px;margin-top:22px;display:grid}.settings-modal label{color:var(--forest);align-items:center;gap:7px;font-size:11px;font-weight:600;display:flex}.settings-modal input{background:#fff;border:1px solid #d9d0c6;border-radius:9px;outline:0;width:100%;padding:11px 12px}.settings-modal input:focus{border-color:var(--rose);box-shadow:0 0 0 3px #c75f621f}.settings-modal form>button,.settings-actions button,.confirm-actions button{color:var(--forest);background:#fff;border:1px solid #d9d0c6;border-radius:9px;justify-content:center;align-items:center;gap:7px;padding:10px 14px;font-size:11px;font-weight:600;display:inline-flex}.settings-modal form>button{border-color:var(--forest);color:#fff;background:var(--forest)}.settings-actions{grid-template-columns:1fr 1fr;gap:9px;margin-top:18px;display:grid}.settings-modal>p,.confirm-modal p{color:#777970;margin:18px 0 0;font-size:11px;line-height:1.6}.confirm-actions{justify-content:flex-end;gap:9px;margin-top:24px;display:flex}.danger-button{border-color:var(--rose)!important;color:#fff!important;background:var(--rose)!important}@media (width<=720px){.date-dock{gap:10px}.chat-composer{min-width:0;display:flex}.icon-button{display:grid}.music-player{flex:none;width:auto}.music-player>div:not(.album-art){display:none}.settings-actions{grid-template-columns:1fr}}.live-dot.offline{box-shadow:none;background:#b5ada5}.toast{z-index:45;color:#fffaf5;background:#30453e;border:1px solid #ffffff24;border-radius:10px;padding:11px 15px;font-size:11px;animation:.28s both rise;position:fixed;bottom:88px;right:24px;box-shadow:0 10px 30px #1c282333}@media (width<=680px){.toast{text-align:center;bottom:80px;left:14px;right:14px}}