:root{--bg0: #020617;--bg1: #0b1220;--bg2: #0f172a;--text: #f8fafc;--muted: rgba(226, 232, 240, .86);--muted2: rgba(226, 232, 240, .72);--surface: rgba(15, 23, 42, .68);--surface2: rgba(2, 6, 23, .35);--border: rgba(71, 85, 105, .38);--shadow: 0 18px 38px rgba(0,0,0,.35);--shadow2: 0 10px 24px rgba(0,0,0,.25);--r-lg: 22px;--r-md: 18px;--r-sm: 14px}html,body,#root{height:100%}body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";color:var(--text);background:radial-gradient(1200px 700px at 10% 0%,#4f46e538,#02061700 60%),radial-gradient(1200px 700px at 90% 18%,#10b98124,#02061700 55%),linear-gradient(to bottom,var(--bg0),var(--bg0),var(--bg2));overflow-x:hidden}a{color:inherit;text-decoration:none}button,input{font:inherit}.appRoot{min-height:100dvh;height:100dvh;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top,0px)}.topBar{position:sticky;top:0;z-index:30;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);background:#0206178c;border-bottom:1px solid rgba(71,85,105,.28)}.topBarRow{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px}.topBarLeft{display:flex;justify-content:flex-start;align-items:center;gap:10px;min-width:0}.topBarRight{display:flex;justify-content:flex-end}.topBarText{min-width:0;display:flex;flex-direction:column;gap:2px}.topBarTitleRow{display:flex;align-items:center;justify-content:space-between;gap:10px}.topBarTitle{font-weight:820;font-size:16px;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topBarSubtitle{font-size:12px;color:var(--muted2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topBarControls{display:flex;gap:8px;align-items:center;justify-content:flex-end}.topBarPills{padding:0 12px 10px;display:flex;gap:8px;align-items:center;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.topBarPills::-webkit-scrollbar{display:none}.soundBtn{height:38px;width:38px;border-radius:12px;border:1px solid rgba(148,163,184,.18);background:#02061738;display:grid;place-items:center;box-shadow:0 10px 24px #00000038}.soundBtn.on{border-color:#6366f14d;background:#6366f11a}.soundIcon{font-size:18px;line-height:1}.appMain{flex:1;min-height:0;overflow:hidden;padding:12px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}.appMain.hasTabs{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}.screenSurface{height:100%;min-height:0;display:flex;flex-direction:column;overflow:hidden;border-radius:var(--r-lg);border:1px solid rgba(71,85,105,.28);background:var(--surface);box-shadow:var(--shadow);padding:14px}@media(min-width:768px){.appMain{max-width:780px;margin:0 auto}}.iconBtn{height:44px;width:44px;display:grid;place-items:center;border-radius:999px;border:1px solid rgba(71,85,105,.38);background:#0f172a59;color:var(--text);font-size:22px;cursor:pointer}.iconBtn:active{transform:translateY(1px)}.tabBar{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:10px 12px;padding-bottom:calc(10px + env(safe-area-inset-bottom,0px));background:#0206179e;border-top:1px solid rgba(71,85,105,.28);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.tabBtn{border:1px solid rgba(71,85,105,.28);background:#0f172a40;color:var(--muted);border-radius:16px;padding:10px;min-height:54px;display:grid;place-items:center;gap:4px;cursor:pointer}.tabBtn.active{background:#4f46e542;border-color:#818cf861;color:var(--text)}.tabIcon{font-size:18px;line-height:1}.tabLabel{font-size:11px;font-weight:700;letter-spacing:-.01em}.sheetOverlay{position:fixed;inset:0;background:#0000;pointer-events:none;transition:background .16s ease;z-index:60}.sheetOverlay.open{pointer-events:auto;background:#00000073}.sheet{position:absolute;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));max-height:min(70vh,540px);display:flex;flex-direction:column;border-radius:26px;border:1px solid rgba(71,85,105,.3);background:#020617db;box-shadow:var(--shadow);transform:translateY(18px);opacity:0;transition:transform .16s ease,opacity .16s ease;overflow:hidden}.sheet.open{transform:translateY(0);opacity:1}.sheetHandle{width:46px;height:5px;border-radius:999px;background:#e2e8f038;margin:10px auto 8px}.sheetHeader{display:flex;align-items:center;justify-content:space-between;padding:10px 12px}.nativeList{display:grid;gap:10px}.nativeItem{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border-radius:18px;border:1px solid rgba(71,85,105,.3);background:#0f172a42}.nativeItem.isMe{background:#4f46e529;border-color:#818cf852}.nativeItem.isWarn{background:#fbbf241a;border-color:#fbbf2438}.nativeLeft{display:flex;align-items:center;gap:12px;min-width:0}.nativeAvatar{width:36px;height:36px;border-radius:999px;border:1px solid rgba(71,85,105,.38);background:#02061740;display:grid;place-items:center;font-size:20px;flex:0 0 auto}.nativeText{min-width:0;display:grid;gap:2px}.nativeTitle{font-weight:820;letter-spacing:-.01em;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nativeSub{font-size:12px;color:var(--muted2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nativeTrail{display:flex;align-items:center;gap:8px;flex:0 0 auto}.stickyActions{position:sticky;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:20;margin-top:12px;padding:10px;border-radius:20px;border:1px solid rgba(71,85,105,.28);background:#0206179e;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:var(--shadow2)}.stickyActions.hasTabs{bottom:calc(94px + env(safe-area-inset-bottom,0px))}.stickyActionsRow{display:grid;gap:10px}.fullWidthBtn{width:100%}.ptrIndicator{position:fixed;left:0;right:0;top:calc(env(safe-area-inset-top,0px) + 10px);z-index:80;display:grid;place-items:center;pointer-events:none;opacity:0;transition:opacity .14s ease}.ptrIndicator.visible{opacity:1}.ptrPill{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:999px;border:1px solid rgba(71,85,105,.3);background:#020617b8;box-shadow:var(--shadow2)}.ptrSpinner{width:22px;height:22px;border-radius:999px;display:grid;place-items:center;font-weight:900}.ptrSpinner.spinning{animation:spin .9s linear infinite}.ptrText{font-size:12px;color:var(--muted);font-weight:750}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.sheetBody{padding:0 12px 14px;flex:1;min-height:0;overflow:auto}.ui-card{background:#0f172a8c;border:1px solid rgba(71,85,105,.32);border-radius:var(--r-lg);box-shadow:var(--shadow2)}.ui-cardContent{padding:20px}@media(min-width:768px){.ui-cardContent{padding:24px}}.ui-btn{border-radius:16px;padding:12px 14px;min-height:44px;border:1px solid rgba(51,65,85,.4);background:#1e293b99;color:var(--text);cursor:pointer;transition:transform 80ms ease,background .14s ease,border-color .14s ease,opacity .14s ease}@media(max-width:480px){.ui-cardContent{padding:16px}.panel{padding:12px}.ui-btn{padding:12px 16px}.ui-input{padding:12px 14px}}.ui-btn:hover{background:#1e293bd9}.ui-btn:active{transform:translateY(1px)}.ui-btn:disabled{opacity:.72;filter:saturate(.92);cursor:not-allowed}.ui-btnPrimary{background:#4f46e5;border-color:#818cf859}.ui-btnPrimary:hover{background:#4f46e5e0}.ui-btnSuccess{background:#10b981eb;border-color:#34d39959}.ui-btnDanger{background:#e11d48e6;border-color:#fb718559}.ui-btnGhost{background:#0f172a40;border-color:#33415566}.ui-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;font-size:12px;border:1px solid rgba(71,85,105,.5);background:#0f172a40;color:#f8fafceb}.ui-sep{height:1px;background:#33415566;border:0;margin:18px 0}.ui-progress{height:8px;border-radius:999px;background:#0f172a59;border:1px solid rgba(51,65,85,.35);overflow:hidden}.ui-progressBar{height:100%;width:0%;background:#6366f1e6;transition:width .14s ease}.ui-input{width:100%;padding:10px 12px;border-radius:14px;border:1px solid rgba(71,85,105,.45);background:#02061759;color:var(--text);outline:none}.ui-input::placeholder{color:#e2e8f0b3}.ui-input::placeholder{color:#e2e8f0b8}.ui-input:focus{border-color:#818cf873;box-shadow:0 0 0 3px #6366f12e}.panel{border-radius:var(--r-lg);border:1px solid rgba(71,85,105,.28);background:#0206174d;padding:14px}.muted{color:var(--muted2)}@media(max-width:520px){.mobileCenter{text-align:center}.mobileCenter .mobileRow{justify-content:center!important}.mobileCenter input,.mobileCenter .ui-input{text-align:center}}.cc-diceBtn{border:1px solid rgba(148,163,184,.22);background:radial-gradient(120% 140% at 30% 25%,#6366f138,#02061759);border-radius:18px;padding:12px;min-width:92px;min-height:92px;display:grid;place-items:center;cursor:pointer;touch-action:manipulation;position:relative;overflow:hidden}.cc-diceBtn:disabled{opacity:.55;cursor:not-allowed}.cc-diceBtn:after{content:"";position:absolute;inset:-40%;background:radial-gradient(circle at 30% 25%,rgba(226,232,240,.16),transparent 55%);opacity:0;transition:opacity .16s ease}.cc-diceBtn:hover:after{opacity:1}.cc-diceScene{width:78px;height:78px;perspective:520px;display:grid;place-items:center}.cc-d6Cube{width:62px;height:62px;position:relative;transform-style:preserve-3d;transform:rotateX(var(--rx, -18deg)) rotateY(var(--ry, 28deg));transition:transform .42s cubic-bezier(.2,.9,.25,1);filter:drop-shadow(0 14px 22px rgba(0,0,0,.45))}.cc-d6Face{position:absolute;inset:0;border-radius:14px;border:2px solid rgba(148,163,184,.55);background:linear-gradient(145deg,#1e293bfa,#020617eb);box-shadow:inset 0 0 0 1px #e2e8f00f;backface-visibility:hidden}.cc-d6Face--front{transform:translateZ(31px)}.cc-d6Face--back{transform:rotateY(180deg) translateZ(31px)}.cc-d6Face--right{transform:rotateY(90deg) translateZ(31px)}.cc-d6Face--left{transform:rotateY(-90deg) translateZ(31px)}.cc-d6Face--top{transform:rotateX(90deg) translateZ(31px)}.cc-d6Face--bottom{transform:rotateX(-90deg) translateZ(31px)}.cc-d6Pips{position:absolute;inset:10px}.cc-pip{position:absolute;width:10px;height:10px;border-radius:999px;background:#e2e8f0eb;box-shadow:0 0 14px #6366f147,0 2px 10px #00000073}.cc-diceRolling .cc-d6Cube{animation:cc_cube_tumble .98s cubic-bezier(.2,.9,.2,1)}.cc-diceRolling:before{content:"";position:absolute;width:92px;height:92px;border-radius:999px;background:radial-gradient(circle,rgba(99,102,241,.26),transparent 55%);filter:blur(1px);opacity:.9;animation:cc_glow_pulse .98s ease-in-out}@keyframes cc_cube_tumble{0%{transform:rotateX(-18deg) rotateY(28deg) scale(1)}20%{transform:rotateX(220deg) rotateY(160deg) scale(1.02)}40%{transform:rotateX(460deg) rotateY(340deg) scale(1.06)}65%{transform:rotateX(760deg) rotateY(610deg) scale(1.02)}82%{transform:rotateX(900deg) rotateY(740deg) scale(.98)}to{transform:rotateX(var(--rx, -18deg)) rotateY(var(--ry, 28deg)) scale(1)}}@keyframes cc_glow_pulse{0%{transform:scale(.7);opacity:.35}35%{transform:scale(1.05);opacity:.95}70%{transform:scale(.88);opacity:.55}to{transform:scale(.7);opacity:0}}.cc-d20Wrap{width:72px;height:72px;position:relative;display:grid;place-items:center}.cc-d20Svg{width:72px;height:72px;filter:drop-shadow(0 14px 22px rgba(0,0,0,.45))}.cc-d20Number{position:absolute;inset:0;display:grid;place-items:center;font-weight:950;font-size:20px;letter-spacing:.5px;color:#e2e8f0f2;text-shadow:0 2px 10px rgba(0,0,0,.55),0 0 18px rgba(99,102,241,.3)}.cc-d20Number.cc-d20Text{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;padding:0 10px;line-height:1.05}.cc-d20Rolling .cc-d20Svg{animation:cc_d20_spin .98s cubic-bezier(.15,.9,.2,1)}.cc-d20Rolling .cc-d20Number{animation:cc_d20_num .98s ease-in-out}@keyframes cc_d20_spin{0%{transform:rotate(0) scale(1)}20%{transform:rotate(110deg) scale(1.03)}45%{transform:rotate(260deg) scale(1.06)}70%{transform:rotate(520deg) scale(1.02)}88%{transform:rotate(650deg) scale(.99)}to{transform:rotate(720deg) scale(1)}}@keyframes cc_d20_num{0%{transform:translateY(0);opacity:.9}35%{transform:translateY(-2px);opacity:1}70%{transform:translateY(1px);opacity:.95}to{transform:translateY(0);opacity:1}}.cc-soundToggle{border:1px solid rgba(148,163,184,.22);background:#0f172a59;color:#e2e8f0e0;border-radius:999px;padding:10px 12px;min-height:44px;display:inline-flex;align-items:center;gap:8px;cursor:pointer}.cc-soundToggle span{font-size:13px;opacity:.9}.cc-soundDot{width:9px;height:9px;border-radius:999px;background:#94a3b88c;box-shadow:0 0 0 3px #94a3b81f}.cc-soundDot.on{background:#6366f1f2;box-shadow:0 0 0 3px #6366f129,0 0 18px #6366f147}.cc-diceOverlay{position:fixed;inset:0;z-index:9999;pointer-events:none;display:grid;place-items:center;opacity:0;transition:opacity .14s ease}.cc-diceOverlayBackdrop{position:absolute;inset:0;background:radial-gradient(circle at 50% 40%,#0206171a,#020617ad);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;transition:opacity .18s ease}.cc-diceOverlay.is-open .cc-diceOverlayBackdrop,.cc-diceOverlay.is-open{opacity:1}.cc-diceOverlayTrack{width:min(220px,72vw);height:min(220px,72vw);perspective:900px;transform-style:preserve-3d;filter:drop-shadow(0 24px 34px rgba(0,0,0,.55));animation:cc_overlay_travel 2.4s cubic-bezier(.12,.92,.18,1) both}.cc-diceOverlay.is-landed .cc-diceOverlayTrack{animation:cc_overlay_travel 2.4s cubic-bezier(.12,.92,.18,1) both}.cc-d6Model{width:min(110px,34vw);height:min(110px,34vw);position:relative;transform-style:preserve-3d;transform:rotateX(0) rotateY(0)}.cc-diceOverlayTrack .cc-d6Model{animation:cc_overlay_cube 2.4s cubic-bezier(.12,.92,.18,1) both}.cc-d6ModelFace{position:absolute;inset:0;border-radius:20px;border:2px solid rgba(226,232,240,.4);background:linear-gradient(150deg,#1e293bfa,#020617f5);box-shadow:inset 0 0 0 1px #e2e8f00f,inset 0 18px 28px #00000042;backface-visibility:hidden}.cc-d6ModelPips{position:absolute;inset:16px}.cc-d6ModelPips .cc-pip{width:14px;height:14px}.cc-d6ModelFace.front{transform:translateZ(calc(min(110px,34vw)/2))}.cc-d6ModelFace.back{transform:rotateY(180deg) translateZ(calc(min(110px,34vw)/2))}.cc-d6ModelFace.right{transform:rotateY(90deg) translateZ(calc(min(110px,34vw)/2))}.cc-d6ModelFace.left{transform:rotateY(-90deg) translateZ(calc(min(110px,34vw)/2))}.cc-d6ModelFace.top{transform:rotateX(90deg) translateZ(calc(min(110px,34vw)/2))}.cc-d6ModelFace.bottom{transform:rotateX(-90deg) translateZ(calc(min(110px,34vw)/2))}@keyframes cc_overlay_travel{0%{transform:translate3d(var(--sx),var(--sy),0) rotate(var(--rz0, 0deg)) scale(.78);opacity:0}10%{opacity:1}28%{transform:translate3d(var(--mx1),calc(var(--my1) - 8vh),0) rotate(var(--rz0, 0deg)) scale(1.06)}40%{transform:translate3d(var(--mx1),var(--my1),0) rotate(var(--rz1, 0deg)) scale(1.02)}58%{transform:translate3d(var(--mx2),calc(var(--my2) - 5vh),0) rotate(var(--rz1, 0deg)) scale(1.01)}68%{transform:translate3d(var(--mx2),var(--my2),0) rotate(var(--rz2, 0deg)) scale(.99)}84%{transform:translate3d(var(--ex),calc(var(--ey) - 3vh),0) rotate(var(--rz2, 0deg)) scale(1.01)}to{transform:translate3d(var(--ex),var(--ey),0) rotate(0) scale(1);opacity:1}}.cc-impact{position:absolute;left:50%;top:50%;width:1px;height:1px;transform:translate(-50%,-50%)}.cc-impactRing{position:absolute;left:0;top:0;width:8px;height:8px;border-radius:999px;border:2px solid rgba(226,232,240,.55);box-shadow:0 0 22px #6366f166,inset 0 0 18px #e2e8f02e;opacity:0;transform:translate(-50%,-50%) scale(.35);animation:cc_impact_ring .52s cubic-bezier(.12,.92,.18,1) both}@keyframes cc_impact_ring{0%{opacity:0;transform:translate(-50%,-50%) scale(.35);filter:blur(0px)}12%{opacity:1}to{opacity:0;transform:translate(-50%,-50%) scale(6.2);filter:blur(.8px)}}.cc-impactSparks,.cc-impactDust{position:absolute;left:0;top:0}.cc-impactSpark{position:absolute;left:0;top:0;width:var(--l);height:var(--w);border-radius:999px;background:#e2e8f0eb;box-shadow:0 0 18px #6366f18c;transform:rotate(var(--a)) translate(0) translateY(-50%);opacity:0;animation:cc_impact_spark .42s cubic-bezier(.12,.92,.18,1) both;animation-delay:var(--pd)}@keyframes cc_impact_spark{0%{opacity:0;transform:rotate(var(--a)) translate(0) translateY(-50%) scaleX(.25);filter:blur(0px)}18%{opacity:1}to{opacity:0;transform:rotate(var(--a)) translate(calc(var(--l) * 1.05)) translateY(-50%) scaleX(.15);filter:blur(.6px)}}.cc-impactDustPuff{position:absolute;left:0;top:0;width:10px;height:10px;border-radius:999px;background:#e2e8f038;box-shadow:0 0 16px #02061759;transform:rotate(var(--a)) translate(0) translateY(-50%) scale(var(--ps));opacity:0;filter:blur(1px);animation:cc_impact_dust .76s cubic-bezier(.12,.92,.18,1) both;animation-delay:var(--pd)}@keyframes cc_impact_dust{0%{opacity:0;transform:rotate(var(--a)) translate(0) translateY(-50%) scale(calc(var(--ps) * .65))}15%{opacity:1}to{opacity:0;transform:rotate(var(--a)) translate(var(--d)) translateY(-50%) scale(.12)}}@keyframes cc_overlay_cube{0%{transform:rotateX(var(--r1x)) rotateY(var(--r1y)) rotate(var(--r1z)) scale(.98)}25%{transform:rotateX(calc(var(--r1x) + 420deg)) rotateY(calc(var(--r1y) + 260deg)) rotate(calc(var(--r1z) + 160deg)) scale(1.04)}55%{transform:rotateX(calc(var(--r1x) + 900deg)) rotateY(calc(var(--r1y) + 700deg)) rotate(calc(var(--r1z) + 420deg)) scale(1.02)}72%{transform:rotateX(calc(var(--fx) + 18deg)) rotateY(calc(var(--fy) - 12deg)) rotate(calc(var(--fz) + 8deg)) scale(.99)}to{transform:rotateX(var(--fx)) rotateY(var(--fy)) rotate(var(--fz)) scale(1)}}.cc-d20OverlayTrack{width:min(260px,80vw);height:min(260px,80vw)}.cc-d20Overlay{width:min(220px,68vw);height:min(220px,68vw);position:relative;display:grid;place-items:center;filter:drop-shadow(0 22px 32px rgba(0,0,0,.58));animation:cc_d20_spin .9s linear infinite}.cc-diceOverlay.is-landed .cc-d20Overlay{animation:cc_d20_land .76s cubic-bezier(.1,.92,.2,1) both}.cc-d20OverlaySvg{width:100%;height:100%}.cc-d20OverlayNumber{position:absolute;font-weight:900;font-size:min(62px,18vw);letter-spacing:-.5px;color:#e2e8f0fa;text-shadow:0 10px 28px rgba(0,0,0,.55);transform:translateY(-2px)}@keyframes cc_d20_spin{0%{transform:rotate(var(--s1)) scale(.98)}35%{transform:rotate(calc(var(--s1) + 210deg)) scale(1.05)}70%{transform:rotate(calc(var(--s1) + 510deg)) scale(1.02)}to{transform:rotate(calc(var(--s1) + 720deg)) scale(.99)}}@keyframes cc_d20_land{0%{transform:rotate(calc(var(--s1) + 420deg)) scale(1.05)}55%{transform:rotate(calc(var(--s2) + 18deg)) scale(.96)}80%{transform:rotate(calc(var(--s3) - 8deg)) scale(1.02)}to{transform:rotate(var(--s3)) scale(1)}}