:root{--bg:#050b14;--bg2:#081321;--panel:#0b1929;--panel2:#0d2034;--line:rgba(118,181,241,.16);--line2:rgba(118,181,241,.28);--text:#e8f2ff;--muted:#92a7be;--blue:#62b5ff;--green:#66e5ae;--gold:#f0c86c;--orange:#f5a76c;--purple:#b691ff;--red:#ff7f8b;--shadow:0 24px 70px rgba(0,0,0,.3)}
*{box-sizing:border-box}html{background:var(--bg);color-scheme:dark}body{margin:0;background:radial-gradient(circle at 75% -10%,rgba(51,138,224,.13),transparent 34rem),linear-gradient(180deg,#050b14,#06101b 70%,#050b14);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100vh}a{color:inherit;text-decoration:none}button,input,select{font:inherit}.topbar{min-height:76px;padding:11px max(18px,env(safe-area-inset-right)) 11px max(18px,env(safe-area-inset-left));display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid var(--line);background:rgba(5,11,20,.88);backdrop-filter:blur(18px);position:sticky;top:0;z-index:50}.brand{display:flex;align-items:center;gap:12px;min-width:0}.brand-mark{width:45px;height:45px;background:#000;border:1px solid rgba(104,188,255,.25);overflow:hidden;flex:0 0 auto}.brand-mark img{width:100%;height:100%;object-fit:cover}.brand-copy{display:flex;flex-direction:column;min-width:0}.kicker{font-size:.59rem;letter-spacing:.16em;color:#69829e;font-weight:800}.kicker b{color:var(--blue)}.title{font-size:1.05rem;font-weight:850;line-height:1.15}.sub{font-size:.7rem;color:#71869d;margin-top:2px}.top-actions{display:flex;align-items:center;gap:10px}.build-badge{font-size:.68rem;font-weight:750;color:#8bd7bc;border:1px solid rgba(102,229,174,.2);background:rgba(102,229,174,.07);padding:7px 10px;border-radius:999px;white-space:nowrap}.language-select{background:#0a1726;color:#dcecff;border:1px solid var(--line2);border-radius:10px;padding:8px 30px 8px 9px;font-size:.78rem}main{width:min(1180px,calc(100% - 32px));margin:0 auto;padding:54px 0 70px}.hero{display:grid;grid-template-columns:1fr 300px;gap:34px;align-items:stretch;margin-bottom:22px}.hero-copy{padding:22px 0}.eyebrow{margin:0 0 10px;color:#6ebaff;font-size:.68rem;letter-spacing:.15em;font-weight:850}.hero h1{font-size:clamp(2.7rem,7vw,5.6rem);line-height:.92;letter-spacing:-.06em;margin:0 0 22px}.hero h1 span{color:#78bfff}.hero-copy>p:not(.eyebrow){font-size:1.05rem;color:var(--muted);line-height:1.65;max-width:720px}.hero-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:26px}.hero-chips .hero-jump{appearance:none;border:1px solid var(--line);background:rgba(30,90,145,.08);border-radius:999px;padding:7px 10px;color:#9fb6ce;font:inherit;font-size:.73rem;line-height:1.2;cursor:pointer;transition:.17s;touch-action:manipulation}.hero-chips .hero-jump:hover{color:#e5fff7;border-color:rgba(102,217,181,.34);background:rgba(51,145,122,.14)}.hero-chips .hero-jump:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.hero-chips .hero-jump.active{color:#dffbf2;border-color:rgba(102,217,181,.34);background:rgba(51,145,122,.18);box-shadow:inset 0 0 0 1px rgba(102,217,181,.08)}.hero-metric{border:1px solid var(--line);border-radius:22px;padding:26px;background:linear-gradient(150deg,rgba(13,32,52,.95),rgba(7,18,31,.95));display:flex;flex-direction:column;justify-content:center;box-shadow:var(--shadow)}.hero-metric small{font-size:.61rem;letter-spacing:.14em;color:#637f9c;font-weight:800}.hero-metric strong{font-size:2.35rem;color:#78c0ff;margin:4px 0}.hero-metric b{font-size:1rem;margin:5px 0}.hero-metric span{color:#7890a9;font-size:.78rem}.hero-metric i{height:1px;background:var(--line);margin:21px 0;display:block}.accuracy-note{border:1px solid rgba(102,229,174,.18);background:rgba(44,132,104,.07);border-radius:15px;padding:15px 18px;margin-bottom:22px;display:flex;gap:18px;align-items:flex-start}.accuracy-note strong{color:#8ce1bf;white-space:nowrap;font-size:.8rem}.accuracy-note p{margin:0;color:#8da8a0;font-size:.78rem;line-height:1.55}.tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;padding:7px;border:1px solid var(--line);background:rgba(8,19,33,.88);border-radius:15px;position:sticky;top:88px;z-index:30;backdrop-filter:blur(16px);margin-bottom:38px}.tab{border:0;background:transparent;color:#839ab3;min-height:48px;border-radius:10px;font-weight:750;cursor:pointer;transition:.17s}.tab span{margin-right:5px}.tab:hover{color:#c9e3fc;background:rgba(67,144,218,.08)}.tab.active{background:linear-gradient(135deg,rgba(47,135,219,.28),rgba(63,158,244,.15));box-shadow:inset 0 0 0 1px rgba(100,184,255,.16);color:#dff1ff}.panel{animation:fade .18s ease;scroll-margin-top:150px}@keyframes fade{from{opacity:.2;transform:translateY(4px)}to{opacity:1;transform:none}}.section-heading{display:grid;grid-template-columns:1.1fr .9fr;gap:45px;align-items:end;margin-bottom:20px}.section-heading h2{font-size:clamp(1.8rem,4vw,3rem);line-height:1.04;letter-spacing:-.04em;margin:0}.section-heading>p{margin:0;color:var(--muted);line-height:1.55;font-size:.9rem}.rarity-row{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin:0 0 18px}.rarity-row.three{grid-template-columns:repeat(3,1fr)}.rarity-row.four{grid-template-columns:repeat(4,1fr)}.rarity-row.five{grid-template-columns:repeat(5,1fr)}.rarity-card{border:1px solid var(--line);border-radius:14px;padding:17px;background:linear-gradient(155deg,rgba(15,35,56,.92),rgba(8,20,34,.95));min-height:104px}.rarity-card span{display:block;font-size:.68rem;letter-spacing:.1em;color:#7890aa;font-weight:850}.rarity-card strong{display:block;font-size:1.8rem;margin-top:7px}.rarity-card.n strong{color:#b9c3cd}.rarity-card.r strong{color:#77c6ff}.rarity-card.sr strong{color:#b994ff}.rarity-card.ssr strong{color:#f2c970}.rarity-card.ur strong{color:#ff9c72}.two-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px}.card{border:1px solid var(--line);border-radius:18px;background:linear-gradient(155deg,rgba(13,31,51,.95),rgba(7,18,31,.96));padding:23px;box-shadow:0 14px 40px rgba(0,0,0,.15);margin-bottom:14px}.two-col>.card{margin-bottom:0}.card-kicker{font-size:.59rem;letter-spacing:.15em;color:#6a9bc9;font-weight:850}.card h3{font-size:1.25rem;margin:7px 0 11px}.card p{color:var(--muted);line-height:1.58;font-size:.86rem}.calculator label{display:grid;gap:7px;color:#91a9c2;font-size:.75rem;font-weight:750;margin:18px 0 13px}.calculator input,.calculator select,.card select{width:100%;min-height:45px;border:1px solid var(--line2);background:#071321;color:#e7f3ff;border-radius:10px;padding:9px 11px;outline:none}.calculator input:focus,.calculator select:focus{border-color:#58abf8;box-shadow:0 0 0 3px rgba(80,165,242,.10)}.result{border:1px solid rgba(86,176,255,.18);background:rgba(33,111,183,.07);border-radius:13px;padding:15px;margin-top:12px}.result span{display:block;color:#7f99b3;font-size:.73rem}.result strong{display:block;font-size:2rem;color:#7ec4ff;margin:3px 0}.result small{display:block;color:#607b96;font-size:.68rem}.result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:15px}.result-grid>div{padding:13px;border:1px solid var(--line);border-radius:11px;background:rgba(5,14,24,.45)}.result-grid span{display:block;font-size:.66rem;color:#748da6;line-height:1.3}.result-grid strong{display:block;color:#83caff;font-size:1.45rem;margin-top:5px}.secondary{margin-top:12px;min-height:39px;border:1px solid var(--line2);background:rgba(59,138,214,.08);color:#a9d6ff;border-radius:10px;padding:0 13px;font-weight:750;cursor:pointer}.secondary:hover{background:rgba(59,138,214,.15)}.sample-roll{min-height:28px;margin-top:10px;font-size:.76rem;color:#839bb3;line-height:1.5}.task-list{display:flex;flex-wrap:wrap;gap:7px;margin:15px 0}.task-list span{border:1px solid rgba(100,180,244,.17);background:rgba(46,122,190,.07);border-radius:999px;padding:7px 9px;font-size:.72rem;color:#a8c9e7}.mini-note{border-left:2px solid #4c97d8;padding:9px 11px;color:#7690aa;background:rgba(49,118,180,.06);font-size:.73rem;line-height:1.55;margin-top:15px}.mini-note b{color:#badbfa}.table-card{padding:0;overflow:hidden}.table-title{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:21px 23px 14px}.table-title h3{margin-bottom:0}.source-chip{font-size:.61rem;color:#6f8ba6;border:1px solid var(--line);border-radius:999px;padding:6px 8px;white-space:nowrap}.table-scroll{overflow-x:auto}.table-scroll table{width:100%;border-collapse:collapse;min-width:650px}.table-scroll th,.table-scroll td{text-align:left;padding:12px 16px;border-top:1px solid rgba(113,174,231,.09);font-size:.75rem}.table-scroll th{color:#6585a4;font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;background:rgba(6,15,26,.35)}.table-scroll td{color:#b2c5d8}.table-scroll td strong{color:#f4fbff}.table-foot{display:block;padding:11px 16px;color:#657d95;border-top:1px solid rgba(113,174,231,.09);font-size:.65rem}.big-stat{border:1px solid var(--line);background:rgba(29,91,147,.06);border-radius:13px;padding:17px;margin:15px 0}.big-stat strong{font-size:2.25rem;color:#7dc5ff;display:block}.big-stat span{font-size:.72rem;color:#7892ab}.big-stat.compact{padding:12px 17px}.big-stat.compact strong{font-size:1.7rem}.split-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px}.split-stats>div{padding:13px;border:1px solid var(--line);border-radius:11px}.split-stats span,.split-stats small{display:block;color:#748aa2;font-size:.68rem}.split-stats strong{font-size:1.45rem;color:#eccb78;display:block;margin:4px 0}.rule-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:15px}.rule-grid>div{border:1px solid var(--line);border-radius:12px;padding:15px}.rule-grid strong{display:block;color:#7fc5ff;font-size:1rem}.rule-grid span{display:block;color:#7990a8;font-size:.72rem;line-height:1.45;margin-top:5px}.toggle{display:flex!important;grid-template-columns:unset!important;align-items:center;gap:10px!important;cursor:pointer}.toggle input{position:absolute;opacity:0;width:1px;height:1px}.toggle>span{width:40px;height:22px;background:#142a3e;border:1px solid var(--line2);border-radius:999px;position:relative;flex:0 0 auto}.toggle>span:after{content:"";position:absolute;width:16px;height:16px;border-radius:50%;background:#778fa7;left:2px;top:2px;transition:.17s}.toggle input:checked+span{background:rgba(60,151,231,.28)}.toggle input:checked+span:after{left:20px;background:#75c2ff}.toggle b{font-size:.76rem;color:#8ea6bd}.calc-foot{font-size:.68rem!important;color:#627c96!important}.distribution{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:10px}.distribution div{padding:9px;border-radius:9px;background:rgba(6,16,27,.5);border:1px solid var(--line)}.distribution span{display:block;color:#6f879f;font-size:.62rem}.distribution strong{font-size:.92rem;color:#b9d8f5}.source-footer{margin-top:32px;padding:19px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:20px}.source-footer>div{display:flex;gap:11px;align-items:flex-start}.source-mark{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:rgba(102,229,174,.11);border:1px solid rgba(102,229,174,.24);color:#86dfbd;font-weight:900}.source-footer p{margin:0;color:#71899f;font-size:.72rem;line-height:1.5}.source-footer p strong{color:#a2cdbb}.source-footer a{color:#7cbcf5;font-size:.76rem;font-weight:800;white-space:nowrap}
@media(max-width:850px){.build-badge{display:none}.hero{grid-template-columns:1fr}.hero-metric{display:grid;grid-template-columns:1fr 1fr;gap:4px 16px}.hero-metric i{grid-column:1/-1;margin:12px 0}.section-heading{grid-template-columns:1fr;gap:12px}.two-col{grid-template-columns:1fr}.rarity-row{grid-template-columns:repeat(3,1fr)}.rarity-row.four,.rarity-row.five{grid-template-columns:repeat(2,1fr)}.rule-grid{grid-template-columns:1fr}.tabs{top:78px;overflow-x:auto;display:flex}.tab{flex:0 0 auto;padding:0 16px}.accuracy-note{display:block}.accuracy-note strong{display:block;margin-bottom:5px}.source-footer{align-items:flex-start;flex-direction:column}}
@media(max-width:560px){.topbar{min-height:68px}.brand-mark{width:39px;height:39px}.sub{display:none}.language-select{max-width:126px}.title{font-size:.93rem}main{width:min(100% - 22px,1180px);padding-top:32px}.hero h1{font-size:3.35rem}.hero-copy{padding:5px 0}.hero-chips{gap:6px}.hero-chips .hero-jump{font-size:.67rem}.hero-metric{padding:19px}.hero-metric strong{font-size:1.8rem}.tabs{top:68px;margin-left:-2px;margin-right:-2px}.rarity-row,.rarity-row.three,.rarity-row.four,.rarity-row.five{grid-template-columns:repeat(2,1fr)}.rarity-card{padding:13px;min-height:88px}.rarity-card strong{font-size:1.45rem}.card{padding:18px;border-radius:15px}.table-title{padding:18px 18px 12px}.result-grid{grid-template-columns:1fr}.distribution{grid-template-columns:repeat(2,1fr)}.split-stats{grid-template-columns:1fr 1fr}.source-footer{padding-left:4px;padding-right:4px}.section-heading h2{font-size:2rem}}

/* V3.19 decision-advisor layer */
.decision-card{border-color:rgba(102,217,181,.2);background:linear-gradient(145deg,rgba(12,37,47,.96),rgba(7,18,31,.97));box-shadow:0 18px 55px rgba(0,0,0,.23)}
.decision-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:5px}.decision-head h3{font-size:1.45rem}.evidence-pills{display:flex;flex-wrap:wrap;gap:7px;justify-content:flex-end}.evidence-pill{font-size:.61rem;font-weight:800;border-radius:999px;padding:6px 9px;border:1px solid var(--line);color:#8ea6bd;white-space:nowrap}.evidence-pill.source{color:#8ee1c4;border-color:rgba(102,229,174,.24);background:rgba(61,149,116,.08)}.evidence-pill.crosscheck{color:#efd08a;border-color:rgba(239,198,108,.22);background:rgba(179,129,34,.07)}
.input-grid{display:grid;gap:10px;margin-top:13px}.input-grid label{margin:0}.two-inputs{grid-template-columns:repeat(2,minmax(0,1fr))}.three-inputs{grid-template-columns:repeat(3,minmax(0,1fr))}.four-inputs{grid-template-columns:repeat(4,minmax(0,1fr))}
.decision-box{margin:17px 0 12px;padding:17px 18px;border-radius:14px;border:1px solid rgba(102,217,181,.24);background:linear-gradient(135deg,rgba(48,153,121,.13),rgba(26,86,128,.09))}.decision-box>span{display:block;font-size:.59rem;letter-spacing:.16em;font-weight:900;color:#71a994}.decision-box>strong{display:block;font-size:clamp(1.45rem,3vw,2.05rem);letter-spacing:-.025em;margin:4px 0;color:#8ce4c5}.decision-box>p{margin:0;color:#a7bfd2;line-height:1.52;font-size:.82rem}.decision-box[data-tone="wait"]{border-color:rgba(106,171,239,.22);background:linear-gradient(135deg,rgba(34,111,176,.12),rgba(24,67,108,.08))}.decision-box[data-tone="wait"]>strong{color:#82c9ff}.decision-box[data-tone="wait"]>span{color:#6f9fca}.decision-box[data-tone="caution"]{border-color:rgba(236,192,102,.23);background:linear-gradient(135deg,rgba(164,116,35,.12),rgba(83,58,24,.08))}.decision-box[data-tone="caution"]>strong{color:#f0ce83}.decision-box[data-tone="caution"]>span{color:#b69352}.decision-box[data-tone="plan"]{border-color:rgba(128,151,255,.22);background:linear-gradient(135deg,rgba(86,101,183,.11),rgba(37,80,132,.08))}.decision-box[data-tone="plan"]>strong{color:#a7baff}
.metric-grid{display:grid;gap:8px;margin-top:10px}.four-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.three-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.metric-grid>div{border:1px solid var(--line);background:rgba(5,14,24,.42);border-radius:11px;padding:13px}.metric-grid span,.metric-grid small{display:block;color:#7189a1;font-size:.65rem;line-height:1.35}.metric-grid strong{display:block;color:#90d2ff;font-size:1.32rem;margin:5px 0 1px}
.steps{display:grid;gap:7px;margin-top:13px}.steps>div{display:grid;grid-template-columns:25px 1fr;gap:9px;align-items:start;border:1px solid rgba(100,180,244,.11);background:rgba(6,16,27,.34);border-radius:10px;padding:10px 11px}.steps b{width:23px;height:23px;border-radius:50%;display:grid;place-items:center;background:rgba(91,170,230,.12);color:#84c8ff;font-size:.68rem}.steps span{color:#91a9be;font-size:.75rem;line-height:1.5}
.reference-drawer{margin:10px 0 15px;border:1px solid var(--line);border-radius:15px;background:rgba(7,18,30,.55);overflow:hidden}.reference-drawer>summary{cursor:pointer;list-style:none;padding:14px 17px;color:#86b8e5;font-size:.76rem;font-weight:800}.reference-drawer>summary::-webkit-details-marker{display:none}.reference-drawer>summary:after{content:"+";float:right;color:#617d97;font-size:1rem}.reference-drawer[open]>summary:after{content:"−"}.reference-drawer>.card,.reference-drawer>.two-col{margin:0;border-left:0;border-right:0;border-bottom:0;border-radius:0}.reference-drawer>.drawer-grid{padding:0}.decision-filter .rule-grid{grid-template-columns:repeat(4,1fr)}
@media(max-width:930px){.four-inputs,.four-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.three-inputs{grid-template-columns:1fr 1fr}.decision-filter .rule-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.decision-head{display:block}.evidence-pills{justify-content:flex-start;margin:8px 0 12px}.two-inputs,.three-inputs,.four-inputs,.three-metrics,.four-metrics{grid-template-columns:1fr}.decision-box{padding:15px}.decision-filter .rule-grid{grid-template-columns:1fr}.reference-drawer>summary{padding:13px 14px}}


/* V3.28 mobile touch-target cleanup. */
@media (max-width:700px){
  .hero-chips .hero-jump{min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding-inline:12px}
}

/* V3.30 recruitment guarantee tracker */
.two-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
.compact-decision{margin-bottom:10px}.compact-decision>strong{font-size:clamp(1.25rem,2.5vw,1.75rem)}
.recruitment-secondary{margin-top:14px}.tracker-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin:12px 0 18px}.tracker-actions span{font-size:.7rem;color:#7f98af}.tracker-actions button{min-height:44px;border:1px solid var(--line2);border-radius:10px;background:rgba(10,27,43,.82);color:#9bcdf5;font-weight:800;padding:10px 14px;cursor:pointer}.tracker-actions button:hover{border-color:#47749a;background:rgba(14,38,60,.9)}.tracker-actions button:focus-visible{outline:2px solid #78bdf5;outline-offset:2px}.drawer-rarity{padding:0 0 10px;margin-top:0}.reference-drawer>.drawer-rarity{padding:0 14px 14px}.reference-drawer>.drawer-rarity+.card{border-top:1px solid var(--line)}
@media(max-width:650px){.two-metrics{grid-template-columns:1fr}.tracker-actions{align-items:stretch;flex-direction:column}.tracker-actions button{width:100%}}

/* 2026-09-02 — Mobile gutter optimization */
@media(max-width:560px){main{width:min(calc(100% - 16px),1180px)}}
