:root{--color-bg:#0e0c0a;--color-surface:#161210;--color-surface-2:#1f1a16;--color-surface-3:#2a2018;--color-accent:#c8722a;--color-accent-glow:#c8722a59;--color-safe:#7aad6b;--color-warning:#d4a847;--color-info:#7bafc4;--color-danger:#b84040;--color-gold:#c9a84c;--color-gold-light:#e8c97a;--color-gold-dim:#7a622a;--color-wizard:#8b6bc4;--color-wizard-glow:#8b6bc44d;--color-fighter:#c8722a;--color-fighter-glow:#c8722a4d;--color-mode-simple:#7aad6b;--color-mode-normal:#8b6bc4;--color-text:#e8dfd0;--color-text-muted:#9e8e7a;--color-text-dim:#4f4036;--color-border:#c9a84c1f;--color-border-gold:#c9a84c4d;--color-border-glow:#8b6bc459;--font-body:"Crimson Pro",Georgia,serif;--font-display:"IM Fell English",Georgia,serif;--font-title:"Uncial Antiqua",serif;--text-xs:12px;--text-sm:15px;--text-md:17px;--text-lg:21px;--text-xl:28px;--text-2xl:38px;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:40px;--space-2xl:64px;--radius-sm:6px;--radius-md:12px;--radius-lg:20px;--radius-full:9999px;--shadow-card:0 4px 24px #0009;--shadow-raised:0 8px 40px #000c;--shadow-glow-wizard:0 0 24px #8b6bc466;--shadow-glow-fighter:0 0 24px #c8722a66;--shadow-glow-safe:0 0 20px #7aad6b59;--shadow-glow-danger:0 0 20px #b8404066;--shadow-glow-gold:0 0 16px #c9a84c4d;--transition-fast:.15s ease;--transition-normal:.28s ease;--transition-slow:.45s ease}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;font-size:16px}body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);font-size:var(--text-md);min-height:100dvh;line-height:1.6;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:0;opacity:.5;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");position:fixed;inset:0}a{color:inherit;text-decoration:none}button{font-family:var(--font-body);cursor:pointer;background:0 0;border:none}input,textarea{font-family:var(--font-body)}.app-wrapper{max-width:480px;min-height:100dvh;padding:0 var(--space-md);padding-bottom:var(--space-xl);z-index:1;margin:0 auto;position:relative}.card{background:var(--color-surface);border-radius:var(--radius-md);border:1px solid var(--color-border);box-shadow:var(--shadow-card);padding:var(--space-md);position:relative}.card:before{content:"";border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,#c9a84c08 0%,#0000 60%);position:absolute;inset:0}.card--wizard{box-shadow:var(--shadow-card),inset 1px 0 12px #8b6bc414}.card--fighter{box-shadow:var(--shadow-card),inset 1px 0 12px #c8722a14}.btn-primary{justify-content:center;align-items:center;gap:var(--space-sm);color:#f5e8d0;border-radius:var(--radius-md);padding:var(--space-sm)var(--space-lg);font-family:var(--font-display);font-weight:400;font-size:var(--text-md);letter-spacing:.03em;min-height:52px;transition:all var(--transition-fast);cursor:pointer;background:linear-gradient(160deg,#c8722a 0%,#a85c20 100%);border:1px solid #c9a84c40;width:100%;display:inline-flex;position:relative;overflow:hidden;box-shadow:0 2px 16px #c8722a4d,inset 0 1px #ffdc9626}.btn-primary:after{content:"";pointer-events:none;background:linear-gradient(#ffffff0f 0%,#0000 50%);position:absolute;inset:0}.btn-primary:hover{background:linear-gradient(160deg,#d97e35 0%,#b86828 100%);transform:translateY(-1px);box-shadow:0 4px 24px #c8722a73,inset 0 1px #ffdc9633}.btn-primary:active{transform:translateY(0)scale(.98);box-shadow:0 1px 8px #c8722a4d}.btn-ghost{justify-content:center;align-items:center;gap:var(--space-sm);border:1px solid var(--color-border-gold);color:var(--color-text-muted);border-radius:var(--radius-md);padding:var(--space-sm)var(--space-lg);font-family:var(--font-display);font-size:var(--text-md);min-height:48px;transition:all var(--transition-fast);cursor:pointer;background:0 0;width:100%;display:inline-flex}.btn-ghost:hover{color:var(--color-gold-light);background:#c9a84c0f;border-color:#c9a84c80}.btn-ghost:active{transform:scale(.98)}.btn-icon{border-radius:var(--radius-md);background:var(--color-surface-2);border:1px solid var(--color-border);min-width:44px;min-height:44px;color:var(--color-text);font-size:var(--text-lg);cursor:pointer;transition:all var(--transition-fast);justify-content:center;align-items:center;display:inline-flex}.btn-icon:hover{border-color:var(--color-border-gold);background:var(--color-surface-3)}.btn-icon:active{transform:scale(.95)}.mode-toggle{background:var(--color-surface-2);border-radius:var(--radius-full);align-items:center;gap:var(--space-xs);padding:var(--space-xs)var(--space-md);font-size:var(--text-sm);cursor:pointer;border:1px solid var(--color-border);transition:color var(--transition-fast),box-shadow var(--transition-fast),border-color var(--transition-fast);font-weight:600;display:inline-flex}.mode-toggle[data-mode=simple]{color:var(--color-mode-simple);border-color:#7aad6b4d;box-shadow:0 0 12px #7aad6b26}.mode-toggle[data-mode=normal]{color:var(--color-mode-normal);border-color:#8b6bc44d;box-shadow:0 0 12px #8b6bc426}.tooltip-card{background:var(--color-surface-2);border:1px solid var(--color-border-gold);border-radius:var(--radius-md);padding:var(--space-sm)var(--space-md);font-size:var(--text-sm);color:var(--color-text);box-shadow:var(--shadow-raised)}.section-title{font-family:var(--font-display);font-size:var(--text-xl);color:var(--color-gold-light);letter-spacing:.02em;font-weight:400;line-height:1.2}.card-title{font-family:var(--font-display);font-size:var(--text-lg);color:var(--color-text);font-weight:400;line-height:1.2}.label{font-size:var(--text-sm);color:var(--color-text-muted);letter-spacing:.04em;text-transform:uppercase;font-weight:500;font-family:var(--font-body)}.muted{font-size:var(--text-sm);color:var(--color-text-muted)}.divider{background:linear-gradient(90deg,transparent,var(--color-border-gold),transparent);height:1px;margin:var(--space-md)0;border:none}@keyframes fadeInScale{0%{opacity:0;transform:scale(.94)translateY(6px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes hpFlashGreen{0%{color:var(--color-text)}30%{color:var(--color-safe)}to{color:var(--color-text)}}@keyframes hpFlashRed{0%{color:var(--color-text)}30%{color:var(--color-danger)}to{color:var(--color-text)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.55}}@keyframes diceSpin{0%{transform:rotateX(0)rotateY(0)}25%{transform:rotateX(180deg)rotateY(90deg)}50%{transform:rotateX(360deg)rotateY(180deg)}75%{transform:rotateX(180deg)rotateY(270deg)}to{transform:rotateX(360deg)rotateY(360deg)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes popIn{0%{transform:scale(.6)}70%{transform:scale(1.12)}to{transform:scale(1)}}@keyframes bubbleDissolve{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.4)}}@keyframes flicker{0%,to{opacity:1}92%{opacity:1}93%{opacity:.85}94%{opacity:1}97%{opacity:.9}98%{opacity:1}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
