.rol-potion-text{background:linear-gradient(100deg, var(--teal) 0%, var(--gold) 45%, var(--magenta) 100%);color:#0000;filter:drop-shadow(.04em .05em #07031a);-webkit-background-clip:text;background-clip:text}.rol-rune{font-family:var(--ff-gothic);color:var(--teal);text-shadow:0 0 12px var(--teal), 0 0 30px color-mix(in oklab, var(--teal) 60%, transparent)}.rol-d20{cursor:pointer;width:100%;height:100%;color:inherit;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:999px;place-items:center;padding:0;display:grid;position:relative}.rol-d20:focus-visible{outline:3px solid var(--gold);outline-offset:6px}.rol-d20 svg{width:100%;height:100%;filter:drop-shadow(0 0 28px color-mix(in oklab, var(--teal) 60%, transparent)) drop-shadow(6px 8px 0 #07031a);overflow:visible}.rol-d20[data-crit=true] svg{filter:drop-shadow(0 0 40px var(--gold)) drop-shadow(6px 8px 0 #07031a)}.rol-d20[data-fail=true] svg{filter:drop-shadow(0 0 36px var(--blood)) drop-shadow(6px 8px 0 #07031a)}@media (prefers-reduced-motion:no-preference){.rol-d20:hover svg{animation:1.6s ease-in-out infinite rol-hover-bob}}@keyframes rol-hover-bob{0%,to{translate:0}50%{translate:0 -8px}}.rol-orbit{border:1.5px dashed color-mix(in oklab, var(--outline) 70%, transparent);pointer-events:none;border-radius:999px;position:absolute;inset:-13%;container-type:size}.rol-orbit span{translate:-50% -50%;transform:rotate(var(--a)) translateY(-50cqh) rotate(calc(var(--a) * -1));font-size:1.6rem;position:absolute;top:50%;left:50%}@media (prefers-reduced-motion:no-preference){.rol-orbit{animation:40s linear infinite spin}}.rol-flip{perspective:1100px;width:100%;min-height:21rem;color:inherit;text-align:left;cursor:pointer;border-radius:var(--fx-radius);background:0 0;border:0;padding:0;display:block}.rol-flip:focus-visible{outline:3px solid var(--gold);outline-offset:5px}.rol-flip-inner{min-height:inherit;transform-style:preserve-3d;display:grid;position:relative}@media (prefers-reduced-motion:no-preference){.rol-flip-inner{transition:transform .7s var(--ease-jelly)}.rol-flip:hover .rol-flip-inner{transform:rotateY(-8deg)rotateX(3deg)}.rol-flip[aria-pressed=true]:hover .rol-flip-inner{transform:rotateY(172deg)rotateX(3deg)}}.rol-flip[aria-pressed=true] .rol-flip-inner{transform:rotateY(180deg)}.rol-flip-face{backface-visibility:hidden;flex-direction:column;grid-area:1/1;display:flex}.rol-flip-back{transform:rotateY(180deg)}@media (prefers-reduced-motion:reduce){.rol-flip[aria-pressed=true] .rol-flip-inner{transform:none}.rol-flip-back{visibility:hidden;transform:none}.rol-flip[aria-pressed=true] .rol-flip-back{visibility:visible}.rol-flip[aria-pressed=true] .rol-flip-front{visibility:hidden}}.rol-card-sky{background:radial-gradient(circle at 25% 20%, var(--potion), transparent 60%), radial-gradient(circle at 90% 80%, var(--magenta), transparent 55%), var(--arcane)}.rol-card-back{background:radial-gradient(circle at 50% 0%, color-mix(in oklab, var(--magenta) 55%, transparent), transparent 60%), radial-gradient(circle at 0% 100%, color-mix(in oklab, var(--teal) 45%, transparent), transparent 55%), var(--arcane)}.rol-scroll{color:var(--ink);border:2.5px solid var(--ink);box-shadow:0 0 0 1px #8f6bff66, 0 0 40px -8px var(--gold), 6px 6px 0 0 #07031a;--focus:var(--ink);background:radial-gradient(120% 70% at 50% 0,#ffffff8c,#0000 60%),radial-gradient(90% 60% at 100% 100%,#c47b1e2e,#0000 70%),linear-gradient(#fbf3dc,#f1e1b8);border-radius:.6rem;position:relative}.rol-scroll:before,.rol-scroll:after{content:"";border:2.5px solid var(--ink);background:linear-gradient(#e8cf94,#c9a35a 55%,#a87f3a);border-radius:999px;height:1.6rem;position:absolute;left:-.9rem;right:-.9rem;box-shadow:3px 3px #07031a}.rol-scroll:before{top:-.85rem}.rol-scroll:after{bottom:-.85rem}.rol-scroll dt{color:#5b3a12}.rol-scroll .rol-scroll-rule{opacity:.45;background:repeating-linear-gradient(90deg,#5b3a12 0 8px,#0000 8px 14px);height:2px}.rol-portal{z-index:60;background:radial-gradient(circle at 50% 50%, color-mix(in oklab, var(--potion) 70%, transparent), transparent 55%), #07031ae0;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);place-items:center;padding:1.5rem;display:grid;position:fixed;inset:0}.rol-portal-ring{aspect-ratio:1;background:conic-gradient(from 0deg, var(--teal), var(--gold), var(--magenta), var(--potion), var(--teal));width:min(80vmin,34rem);filter:blur(1px) drop-shadow(0 0 24px var(--magenta));border-radius:999px;position:absolute;-webkit-mask:radial-gradient(circle,#0000 58%,#000 59% 64%,#0000 65%);mask:radial-gradient(circle,#0000 58%,#000 59% 64%,#0000 65%)}@media (prefers-reduced-motion:no-preference){.rol-portal-ring{animation:2.4s linear infinite spin}.rol-portal-core{animation:rol-portal-in .6s var(--ease-jelly) both}}@keyframes rol-portal-in{0%{opacity:0;rotate:-12deg;scale:.4}}.rol-spell{border:1.5px dashed color-mix(in oklab, var(--outline) 90%, transparent);background:color-mix(in oklab, var(--surface-2) 65%, transparent);color:var(--surface-ink);cursor:pointer;transition:transform .26s var(--ease-jelly), background-color .2s ease, border-color .2s ease;border-radius:999px}.rol-spell:hover{border-style:solid;border-color:var(--pop);background:color-mix(in oklab, var(--pop) 18%, var(--surface-2));transform:translateY(-2px)rotate(-2deg)}.rol-spell:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.rol-spell[data-active=true]{border-style:solid;border-color:var(--pop);background:var(--pop);color:var(--pop-ink)}.rol-faq summary{cursor:pointer;list-style:none}.rol-faq summary::-webkit-details-marker{display:none}.rol-faq summary:focus-visible{outline:3px solid var(--focus);outline-offset:4px;border-radius:.6rem}.rol-faq-icon{transition:rotate .3s var(--ease-jelly)}.rol-faq[open] .rol-faq-icon{rotate:45deg}