:root{color-scheme:dark;--bg:#101310;--surface:#181e16;--line:#35402e;--text:#edf1e9;--muted:#aab5a2;--accent:#c9eca9;--class-color:#c9eca9;font-family:Arial,Helvetica,sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-size:15px;line-height:1.6}button,input{font:inherit}a{color:inherit;text-decoration:none}a:hover{color:var(--accent)}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}button:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:5px}h1,h2,p{margin:0}svg{fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.symbol-library{position:absolute;width:0;height:0;overflow:hidden}.wrap{width:min(100%,1344px);margin-inline:auto;padding-inline:56px}.skip-link{position:fixed;top:-100px;left:16px;padding:12px 20px;background:var(--accent);color:#182213;z-index:5}.skip-link:focus{top:12px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.site-header{height:108px;display:flex;align-items:center;gap:35px;border-bottom:1px solid var(--line)}.wordmark{display:inline-flex;align-items:center;font-size:30px;font-weight:700;letter-spacing:-1.5px;line-height:1}.brand-dot{color:var(--accent)}.brand-symbol{display:inline-flex;position:relative;align-items:center;justify-content:center;width:37px;height:37px;border:1px solid #4b5a43;border-radius:10px;font-size:29px;margin-right:13px;color:var(--accent)}.brand-symbol span{font-size:15px;position:absolute;right:2px;top:-4px}.breadcrumb{display:flex;gap:16px;align-items:center;font-size:9px;letter-spacing:.13em;color:var(--muted)}.breadcrumb strong{font-weight:500;color:var(--text)}.breadcrumb>span{color:#768b66}.back-link{margin-left:auto;font-size:12px;display:flex;align-items:center;gap:14px}.back-link>span{color:var(--accent)}.intro-line{display:flex;justify-content:space-between;align-items:center;padding-top:47px;margin-bottom:29px}.eyebrow{font-size:10px;letter-spacing:.13em;display:flex;gap:10px;align-items:center;font-weight:600}.status-dot{height:6px;width:6px;border-radius:50%;background:var(--accent)}.edition{font:10px monospace;letter-spacing:.05em;color:#8d9c81}.generator{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:64px;align-items:start}.setup h1{font-size:clamp(42px,4.8vw,65px);line-height:1.06;letter-spacing:-.06em;font-weight:550;margin-top:10px}.setup h1>span{color:var(--accent)}.lead{font-size:15px;line-height:1.8;color:var(--muted);margin-top:24px;margin-bottom:32px}
fieldset{border:0;margin:0;padding:0;min-width:0}legend{padding:0;margin-bottom:14px;font-size:12px;font-weight:600}.section-number{font-family:monospace;color:#96ac84;margin-right:9px;font-size:11px}.class-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.class-option{position:relative;min-width:0;cursor:pointer}.class-option input{position:absolute;opacity:0;width:1px;height:1px}.class-tile{border:1px solid #323d2c;border-radius:9px;display:flex;align-items:center;gap:10px;padding:13px 11px;background:#141912;transition:background .16s,border-color .16s}.class-tile>svg{width:29px;height:39px;flex-shrink:0;color:var(--class-color);stroke-width:4}.class-tile strong{display:block;font-size:13px;font-weight:600}.class-tile small{display:block;font-size:9px;color:var(--muted);margin-top:2px}.checkmark{margin-left:auto;font-size:12px;border:1px solid #5d6c51;border-radius:4px;width:17px;height:17px;line-height:15px;text-align:center;color:transparent;flex-shrink:0}.class-option input:checked+.class-tile{border-color:#647950;background:#1e2918}.class-option input:checked+.class-tile .checkmark{background:var(--accent);border-color:var(--accent);color:#15220e}.class-option:hover .class-tile{border-color:#8b9c78}.class-option input:focus-visible+.class-tile{outline:3px solid var(--accent);outline-offset:3px}.class-option input:disabled+.class-tile{cursor:wait;opacity:.7}[data-class=ninja]{--class-color:#a6cfdf}[data-class=sura]{--class-color:#c5b3ec}[data-class=shaman]{--class-color:#e5c38e}.pool-description{color:var(--muted);font-size:11px;min-height:19px;margin-top:13px}.draw-button{border:1px solid var(--accent);border-radius:8px;background:var(--accent);color:#192512;display:flex;align-items:center;gap:14px;width:100%;padding:16px 19px;font-weight:700;font-size:14px;margin-top:22px;transition:background .15s,transform .15s}.draw-button:hover:not(:disabled){background:#dcf7c4;transform:translateY(-1px)}.draw-button>svg{width:21px;height:21px;stroke-width:1.7}.button-arrow{margin-left:auto;font-size:19px}.small-note{font-size:10px;color:#9da992;margin-top:12px}.notice{margin-top:20px;color:#ecd18e}
.result-card{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,#26321f 0,#192016 45%,#151a13 80%);border:1px solid #495b3b;border-radius:15px;min-width:0;box-shadow:0 20px 70px #0002}.result-card[data-class=ninja]{background:radial-gradient(ellipse at 50% 35%,#20343b 0,#182329 45%,#141c21 80%);border-color:#3d5963}.result-card[data-class=sura]{background:radial-gradient(ellipse at 50% 35%,#332a46 0,#211d2c 45%,#19171f 80%);border-color:#57496b}.result-card[data-class=shaman]{background:radial-gradient(ellipse at 50% 35%,#3b3323 0,#282318 45%,#1c1b15 80%);border-color:#635337}.card-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:25px 27px 0;color:#c3cfb9}.card-top .eyebrow{font-size:8px;letter-spacing:.15em}.card-counter{font:10px monospace;color:var(--class-color);white-space:nowrap}.result-illustration{height:290px;position:relative;display:grid;place-items:center;margin:3px 20px 0;color:var(--class-color)}.orbit{position:absolute;border:1px solid currentColor;opacity:.22;width:232px;height:232px;border-radius:50%}.orbit.outer{width:266px;height:266px;border-style:dashed;opacity:.2;animation:orbit 120s linear infinite}.orbit.inner{width:202px;height:202px;opacity:.35}.orbit.cross{height:232px;width:232px;border-radius:22%;transform:rotate(45deg);opacity:.14}.class-emblem{width:129px;height:147px;stroke-width:2;filter:drop-shadow(0 0 15px #c9eca917);transition:opacity .15s,transform .3s}.rune{position:absolute;font-size:15px;color:var(--class-color)}.rune.top{top:8px}.rune.bottom{bottom:7px}.rune.left{left:calc(50% - 144px)}.rune.right{right:calc(50% - 144px)}.coordinate{position:absolute;font:8px monospace;letter-spacing:.1em;opacity:.65;bottom:16px}.coordinate.left{left:7px}.coordinate.right{right:7px}.result-copy{text-align:center;padding:10px 22px 28px;min-height:171px}.result-kicker{color:var(--muted);font-size:10px;margin-bottom:10px}.result-copy h2{line-height:1.2;font-weight:400;letter-spacing:-.04em}.result-copy h2>span{display:block;font-size:23px;color:#d5dccf}.result-copy h2>strong{display:block;font-size:clamp(34px,4.2vw,56px);letter-spacing:-.05em;font-weight:550;color:var(--class-color);margin-top:3px}.card-bottom{border-top:1px solid #77846933;display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 27px;padding:19px 0 22px;color:#aeb9a4;font-size:10px}.copy-button{border:0;background:none;padding:5px 0;color:var(--class-color);font-size:11px;white-space:nowrap}.copy-button>span{margin-left:8px}.result-card.is-drawing .class-emblem{animation:casting .4s ease-in-out infinite alternate}.result-card.is-drawing .orbit.inner{animation:orbit 1.5s linear infinite}.feedback{min-height:25px;font-size:12px;color:var(--accent);margin-top:20px}
.history-section{margin-top:32px;padding:31px 0 32px;border-top:1px solid var(--line)}.history-heading{display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:23px}.history-heading h2{font-size:25px;line-height:1.2;letter-spacing:-.035em;font-weight:500;margin-top:13px}.history-heading>p{font-size:10px;line-height:1.7;color:var(--muted)}.history-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;min-height:80px}.history-list li{border:1px solid var(--line);border-radius:8px;padding:14px;position:relative;background:#151a13;min-width:0}.history-list li:first-child{background:#1c2418;border-color:#5b704a}.history-list small{display:block;font:9px monospace;color:#98a68b;margin-bottom:9px}.history-list strong{display:block;font-size:12px;font-weight:500;color:#c8d0c1}.history-list span{display:block;font-size:15px;color:var(--class-color);line-height:1.2;margin-top:3px}.history-list .history-empty{grid-column:1/-1;color:var(--muted);font-size:13px;background:transparent}.tool-notes{display:grid;grid-template-columns:1fr 1fr;gap:56px;border-top:1px solid var(--line);padding:28px 0 38px}.tool-notes>p{display:flex;gap:18px;color:var(--muted);font-size:11px;max-width:450px}.tool-notes strong{display:block;font-size:12px;color:#d3dccb;font-weight:500;margin-bottom:5px}.note-symbol{font:21px monospace;color:var(--accent);white-space:nowrap;padding-top:3px;min-width:42px}.site-footer{border-top:1px solid var(--line);display:flex;align-items:center;gap:24px;padding-top:26px;padding-bottom:30px;font-size:10px;color:var(--muted)}.wordmark.small{font-size:24px;color:var(--text)}.site-footer p{flex:1}.site-footer p a{text-decoration:underline;text-underline-offset:3px}.footer-note{color:#99a58e}
.note-symbol{flex:0 0 64px}.mobile-reroll{display:none}
.icon-steel{fill:currentColor;fill-opacity:.12}.icon-gold{stroke:#dac49a;fill:#dac49a;fill-opacity:.08}.icon-detail{stroke-width:1.3}.skill-flame{stroke:#edb17b;fill:#e9a16d;fill-opacity:.1}.skill-poison{stroke:#aed995;fill:#aed995;fill-opacity:.08}.skill-impact{stroke:#aabfe5;fill:none;stroke-width:1.4}.skill-lightning{stroke:#a0ded9;fill:#a0ded9;fill-opacity:.12}.skill-magic{stroke:#c0a6e9;fill:#9c77c9;fill-opacity:.15}.skill-orb{stroke:#c6b0f0;fill:#755a9d;fill-opacity:.45}.class-emblem{width:152px;height:160px;stroke-width:1.8}.history-icon{position:absolute;right:10px;top:7px;width:29px;height:29px;color:var(--class-color);stroke-width:2.5}
@keyframes orbit{to{transform:rotate(360deg)}}@keyframes casting{from{opacity:.4;transform:scale(.87)}to{opacity:.9;transform:scale(1.04)}}
@media(min-width:1600px){.generator{gap:80px}.result-illustration{height:310px}.result-copy{padding-bottom:30px}}
@media(max-width:1100px){.wrap{padding-inline:32px}.generator{gap:35px}.setup h1{font-size:51px}.class-tile{gap:8px;padding:12px 8px}.class-tile>svg{width:25px}.class-tile small{font-size:8px}.card-top{padding-inline:20px}.card-bottom{margin-inline:20px}.edition{font-size:8px}.breadcrumb{gap:10px}.history-list{gap:8px}.history-list li{padding:12px}}
@media(max-width:800px){.breadcrumb{display:none}.generator{grid-template-columns:1fr 1fr;gap:24px}.wrap{padding-inline:24px}.setup h1{font-size:42px}.class-grid{grid-template-columns:1fr}.class-tile{padding:9px 12px}.class-tile small{font-size:10px}.class-tile>svg{height:30px}.lead{font-size:13px}.result-illustration{height:280px;margin-inline:8px}.orbit.outer{width:230px;height:230px}.orbit.inner{width:175px;height:175px}.orbit.cross{width:202px;height:202px}.rune.left{left:calc(50% - 124px)}.rune.right{right:calc(50% - 124px)}.result-copy h2>strong{font-size:36px}.card-top{align-items:start;flex-direction:column;gap:8px}.result-copy{min-height:166px}.card-bottom{align-items:start;flex-direction:column;gap:10px}.tool-notes{gap:28px}.footer-note{display:none}.history-list span{font-size:13px}.history-heading h2{font-size:22px}.edition{display:none}}
@media(max-width:600px){.wrap{padding-inline:20px}.site-header{height:82px;gap:16px}.wordmark{font-size:26px}.brand-symbol{width:31px;height:31px;font-size:24px;margin-right:9px}.back-link{font-size:10px;gap:7px}.intro-line{padding-top:30px;margin-bottom:24px}.intro-line .eyebrow{font-size:9px}.generator{display:flex;flex-direction:column;gap:30px}.setup{width:100%}.setup h1{font-size:clamp(43px,10.5vw,58px);margin-top:0}.lead{font-size:14px;margin-top:20px;margin-bottom:25px}.class-grid{grid-template-columns:1fr 1fr;gap:8px}.class-tile{padding:11px 9px;gap:7px}.class-tile>svg{width:23px;height:34px}.class-tile strong{font-size:12px}.class-tile small{font-size:8px}.checkmark{width:15px;height:15px;line-height:13px;font-size:10px}.draw-button{margin-top:18px;padding:15px}.result-card{width:100%}.card-top{flex-direction:row;padding:22px 21px 0;align-items:center}.card-top .eyebrow{font-size:8px}.result-illustration{height:260px;margin-top:5px}.class-emblem{width:115px;height:130px}.result-copy{padding:5px 18px 27px;min-height:140px}.result-copy h2>strong{font-size:46px}.result-copy h2>span{font-size:21px}.card-bottom{flex-direction:row;align-items:center;padding:16px 0 19px}.coordinate{font-size:7px}.feedback{margin-top:15px;min-height:19px}.history-section{margin-top:19px;padding-top:27px}.history-heading{align-items:start;flex-direction:column;gap:12px}.history-heading>p br{display:none}.history-heading>p{font-size:11px}.history-heading h2{font-size:23px}.history-list{grid-template-columns:repeat(2,minmax(0,1fr))}.history-list li{padding:13px}.history-list span{font-size:16px}.history-list li:first-child:last-child{grid-column:1/-1}.tool-notes{grid-template-columns:1fr;gap:24px;padding-bottom:30px}.site-footer{flex-wrap:wrap;gap:17px}.site-footer p{flex-basis:calc(100% - 110px)}.site-footer>a:last-of-type{margin-left:auto}}
@media(max-width:600px){.mobile-reroll{display:flex;align-items:center;justify-content:center;gap:24px;width:calc(100% - 40px);margin:0 20px 22px;padding:12px;background:#c9eca9;color:#192512;border:1px solid #c9eca9;border-radius:7px;font-weight:600;font-size:12px}.note-symbol{flex-basis:54px;font-size:18px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}