:root{--deep-ocean: #0a1c2a;--deep-ocean-2: #0e2638;--deep-ocean-3: #123247;--amber: #d98e33;--amber-bright: #f0ab4e;--steel: #5c7a8a;--parchment: #ece2cd;--blood: #9c3a3a;--blood-bright: #d35858;--shadow: rgba(0, 0, 0, .45)}*{box-sizing:border-box}html,body{margin:0;padding:0;min-height:100vh;background:radial-gradient(ellipse 120% 80% at 50% -10%,var(--deep-ocean-3) 0%,var(--deep-ocean) 55%,#060f17 100%);color:var(--parchment);font-family:DM Mono,monospace}#root{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:48px 20px 80px}.locale-btn{position:fixed;top:16px;right:20px;font-family:DM Mono,monospace;font-size:11px;font-weight:500;letter-spacing:.12em;color:var(--steel);background:transparent;border:1px solid rgba(92,122,138,.35);border-radius:6px;padding:5px 10px;cursor:pointer;transition:color .15s ease,border-color .15s ease;z-index:100}.locale-btn:hover{color:var(--parchment);border-color:#5c7a8ab3}.eyebrow{letter-spacing:.35em;text-transform:uppercase;font-size:11px;color:var(--steel);margin-bottom:10px;text-align:center}h1.title{font-family:Cormorant Garamond,serif;font-style:italic;font-weight:600;font-size:clamp(34px,6vw,56px);margin:0 0 6px;color:var(--parchment);text-align:center;letter-spacing:.01em}.subtitle{color:var(--steel);font-size:13px;margin-bottom:40px;text-align:center}.panel{width:100%;max-width:620px;background:linear-gradient(160deg,#ffffff08,#00000026);border:1px solid rgba(217,142,51,.18);border-radius:16px;padding:28px 28px 24px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 20px 50px var(--shadow)}.fields{display:flex;gap:18px;flex-wrap:wrap}.field{flex:1 1 160px;display:flex;flex-direction:column;gap:8px}.field label{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--steel)}.field input{background:#060f1799;border:1px solid var(--deep-ocean-3);border-bottom:2px solid var(--amber);color:var(--parchment);font-family:DM Mono,monospace;font-size:20px;padding:10px 12px;border-radius:6px;outline:none;width:100%;transition:border-color .2s ease,box-shadow .2s ease}.field input:focus{border-color:var(--amber-bright);box-shadow:0 0 0 3px #d98e332e}.roll-row{margin-top:22px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}button.roll-btn{font-family:Cormorant Garamond,serif;font-style:italic;font-weight:600;font-size:19px;letter-spacing:.03em;color:var(--deep-ocean);background:linear-gradient(180deg,var(--amber-bright),var(--amber));border:none;padding:12px 32px;border-radius:999px;cursor:pointer;box-shadow:0 8px 24px #d98e3359;transition:transform .15s ease,box-shadow .15s ease}button.roll-btn:hover{transform:translateY(-1px);box-shadow:0 10px 28px #d98e3380}button.roll-btn:active{transform:translateY(0) scale(.98)}button.roll-btn:disabled{background:linear-gradient(180deg,#5a6a72,#3d4f57);color:#ece2cd80;box-shadow:none;cursor:not-allowed;transform:none}.error-msg{color:var(--blood-bright);font-size:13px;margin-top:4px}.hint{color:var(--steel);font-size:12px;margin-top:4px}.footer{margin-top:48px;font-size:12px;color:var(--steel);opacity:.6}.footer a{color:inherit;text-decoration:none}.footer a:hover{color:var(--parchment);opacity:1}.result-section{width:100%;max-width:820px;margin-top:36px;display:flex;flex-direction:column;align-items:center}.success-readout{text-align:center;margin-bottom:28px}.success-number{font-family:Cormorant Garamond,serif;font-weight:600;font-size:clamp(48px,9vw,78px);line-height:1;color:var(--amber-bright);text-shadow:0 0 30px rgba(217,142,51,.35)}.success-label{letter-spacing:.25em;text-transform:uppercase;font-size:12px;color:var(--steel);margin-top:6px}.crit-note{margin-top:8px;font-size:13px;font-style:italic;font-family:Cormorant Garamond,serif;color:var(--blood-bright)}.crit-note.messy-critical{color:#c06020;text-shadow:0 0 12px rgba(192,96,32,.4)}.crit-note.bestial-failure{color:var(--blood-bright);text-shadow:0 0 12px rgba(211,88,88,.45)}.tray{position:relative;width:100%;min-height:180px;border-radius:18px;background:radial-gradient(circle at 20% 20%,rgba(92,122,138,.08),transparent 45%),radial-gradient(circle at 80% 70%,rgba(92,122,138,.06),transparent 50%),linear-gradient(180deg,#060f178c,#060f17bf);border:1px solid rgba(92,122,138,.18);padding:28px;display:flex;align-items:center;justify-content:center;overflow:hidden}.tray:before{content:"";position:absolute;top:-40%;right:-40%;bottom:-40%;left:-40%;background:repeating-radial-gradient(circle at 50% 50%,rgba(92,122,138,.05) 0px,transparent 2px,transparent 38px,rgba(92,122,138,.05) 40px);opacity:.5;pointer-events:none}.empty-tray{color:var(--steel);font-family:Cormorant Garamond,serif;font-style:italic;font-size:17px;position:relative;z-index:1}.dice-row{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:center;position:relative;z-index:1}.die{width:56px;height:56px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-family:DM Mono,monospace;font-weight:500;font-size:20px;position:relative;box-shadow:0 6px 14px #00000059,inset 0 1px 1px #ffffff26;animation:diceIn .45s ease backwards}.die.success{background:linear-gradient(160deg,var(--amber-bright),var(--amber));color:var(--deep-ocean)}.die.fail{background:linear-gradient(160deg,#2c3e48,#1a2b35);color:var(--steel)}.die.fail.regular{opacity:.38}.die.hunger{border:2px solid var(--blood-bright)}.die.hunger.fail{background:linear-gradient(160deg,#3a2424,#271414);color:var(--blood-bright);opacity:1}.die.hunger.success{background:linear-gradient(160deg,var(--amber-bright),var(--blood) 130%);color:#1a0d0d}.pair-wrap{position:relative;display:flex;gap:8px;padding:10px 12px 16px;border:1.5px solid var(--amber-bright);border-radius:16px;background:#d98e3312;box-shadow:0 0 18px #d98e332e}.pair-badge{position:absolute;bottom:-10px;left:50%;transform:translate(-50%);background:var(--amber-bright);color:var(--deep-ocean);font-size:10px;letter-spacing:.08em;padding:2px 8px;border-radius:999px;font-weight:600;white-space:nowrap}@keyframes diceIn{0%{opacity:0;transform:scale(.4) rotate(-25deg)}to{opacity:1;transform:scale(1) rotate(0)}}@media (prefers-reduced-motion: reduce){.die,button.roll-btn{animation:none!important;transition:none!important}}@media (max-width: 480px){.die{width:44px;height:44px;font-size:16px}.panel{padding:20px}.fields{flex-direction:column}}