@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@400;500;600;700&display=swap";:root{font-family:DM Sans,sans-serif;color:#f6ead8;background:#171310;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px}button{font:inherit;cursor:pointer}button:focus-visible{outline:2px solid #e3b96c;outline-offset:3px}.app{min-height:100dvh;background:radial-gradient(ellipse at 70% 12%,#32251c,#171310 57%);--gold: #d9ab61;--line: #ffffff1b}.topbar{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:0 clamp(20px,4vw,64px)}.brand{display:flex;align-items:center;gap:14px}.brand-icon{height:43px;width:43px;border:1px solid #b78950;border-radius:12px;display:grid;place-items:center;color:#e6b96b}.brand-name{font-family:Playfair Display,serif;font-weight:700;font-size:22px;letter-spacing:2px}.brand-name span{color:var(--gold);font-weight:400}.brand-sub{color:#a99580;font-size:9px;letter-spacing:2.7px;margin-top:4px}.top-actions{display:flex;align-items:center}.edition{font-size:10px;letter-spacing:2px;color:#a99785}.icon-button{background:transparent;border:1px solid #ffffff24;border-radius:11px;color:#dcc5a8;display:grid;place-items:center;width:41px;height:41px}.mobile-settings{display:none}.workspace{display:grid;grid-template-columns:300px minmax(0,1fr);gap:30px;max-width:1580px;margin:auto;padding:30px clamp(20px,4vw,64px) 50px}.sidebar{padding:25px 23px;background:linear-gradient(150deg,#25201c,#191715);border:1px solid var(--line);border-radius:18px;align-self:start;box-shadow:0 16px 55px #0003}.eyebrow{color:var(--gold);font-size:10px;font-weight:700;letter-spacing:2.3px}.sheet-header h2{font-family:Playfair Display,serif;font-size:29px;line-height:1.2;font-weight:500;margin:15px 0}.setting-section{padding:24px 0;border-top:1px solid var(--line)}.section-title{font-size:10px;font-weight:700;letter-spacing:1.8px;color:#e7d8c6;display:flex;justify-content:space-between;gap:8px;margin-bottom:19px}.section-title span{font-weight:400;letter-spacing:0;color:#aa9c8b;text-transform:none}.swatches{display:flex;gap:9px;flex-wrap:wrap}.swatch{width:34px;height:34px;background:#ffffff0a;border:1px solid #ffffff22;border-radius:9px;padding:4px}.swatch span{display:block;width:100%;height:100%;border-radius:5px;box-shadow:inset -5px -5px 9px #0004,inset 3px 3px 6px #fff5}.swatch.selected{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}.surfaces{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.surface-choice{padding:5px 5px 9px;background:#1b1918;color:#ddd0c1;border:1px solid #ffffff20;border-radius:10px;font-size:11px}.surface-choice.selected{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}.surface-preview{display:block;height:55px;border-radius:6px;margin-bottom:8px}.wood .surface-preview{background:repeating-linear-gradient(10deg,#56311e,#6f422a 5px,#372319 8px,#57321f 14px)}.felt .surface-preview{background:radial-gradient(circle at 30% 40%,#255d42,#0d2b20)}.stone .surface-preview{background:linear-gradient(145deg,#45484a,#1d2023 45%,#4a4946)}.main{min-width:0}.scene{height:clamp(370px,52vw,565px);border:1px solid #ffffff24;border-radius:18px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 48% 34%,#9a6a42,#513324 42%,#291c17);box-shadow:inset 0 0 110px #0004}.surface-felt .scene{background:radial-gradient(ellipse at 48% 34%,#436c51,#214432 48%,#13291e)}.surface-stone .scene{background:radial-gradient(ellipse at 48% 34%,#66615a,#343538 48%,#1b1c20)}.scene canvas{position:absolute;top:0;right:0;bottom:0;left:0;touch-action:none}.bottom-panel{margin-top:18px;display:flex;justify-content:center}.roll-button{width:min(100%,320px);min-width:0;height:65px;display:flex;align-items:center;justify-content:center;gap:12px;background:linear-gradient(115deg,#b98443,#f1d093 50%,#d5a45d);border:1px solid #f9dba0;color:#2b1b0e;border-radius:11px;font-weight:800;font-size:13px;letter-spacing:1.1px;box-shadow:0 5px 25px #0004;transition:transform .15s}.roll-button:hover:not(:disabled){transform:translateY(-2px)}.roll-button:disabled{opacity:.7;cursor:wait}.history{margin-top:14px}.history-items{display:flex;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;padding:4px 0 8px}.history-item{display:flex;align-items:center;gap:12px;min-width:130px;max-width:200px;padding:10px;border:1px solid var(--line);border-radius:12px;background:#ffffff08}.history-num{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:#d2a66324;color:#e7bd7e;font-family:Playfair Display,serif;font-size:17px}.history-item strong{font-weight:500;font-size:12px;white-space:pre-line;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.history-item small{display:block;color:#968b80;font-size:10px;margin-top:5px}.modal-backdrop{display:none}@media(max-width:980px){.workspace{grid-template-columns:240px minmax(0,1fr);gap:16px;padding:20px}.sidebar{padding:20px 15px}.scene{height:480px}}@media(max-width:720px),(max-width:980px)and (orientation:landscape)and (max-height:500px){.topbar{display:flex;height:calc(64px + env(safe-area-inset-top));padding:env(safe-area-inset-top) max(16px,env(safe-area-inset-right)) 0 max(16px,env(safe-area-inset-left))}.brand{gap:10px}.brand-name{font-size:18px}.brand-icon{width:37px;height:37px}.workspace{display:block;padding:8px max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}.sidebar{display:none}.scene{height:calc(100dvh - 224px - env(safe-area-inset-top) - env(safe-area-inset-bottom));min-height:240px;border-radius:15px}.mobile-settings{display:grid;flex-shrink:0;width:44px;height:44px;background:#211c19ed}.bottom-panel{margin-top:8px}.roll-button{width:100%;height:60px}.history{margin-top:8px}.history-items{gap:8px}.history-item{min-width:110px;padding:8px;gap:8px}.history-num{width:27px;height:27px;flex-shrink:0}.modal-backdrop{display:flex;position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;z-index:20;align-items:end}.settings-sheet{width:100%;max-height:88dvh;overflow:auto;background:#211c19;border:1px solid #ffffff24;border-radius:23px 23px 0 0;padding:25px 24px calc(24px + env(safe-area-inset-bottom));box-shadow:0 -12px 60px #0007}.sheet-header{display:flex;justify-content:space-between;align-items:start}.sheet-header h2{margin:8px 0 25px}.settings-sheet .setting-section{padding:23px 0}.settings-sheet .swatch{width:40px;height:40px}.settings-sheet .surface-preview{height:75px}.settings-sheet .sheet-done{width:100%;height:49px;margin-top:24px;border:1px solid #e9c083;background:#d9ab61;color:#21170d;border-radius:10px;font-weight:700}}@media(max-width:980px)and (orientation:landscape)and (max-height:500px){.scene{min-height:80px;height:calc(100dvh - 224px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}.roll-label{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;white-space:pre-line;overflow-wrap:anywhere;max-height:2.6em;line-height:1.3;font-size:16px;letter-spacing:.3px;padding:0 16px}.sidebar .setting-section:first-child{border-top:0;padding-top:0}