@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#e7e4df;background:#0e1420;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button{font:inherit;cursor:pointer}a{color:#d7b77e}.app-shell{max-width:1600px;margin:auto}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 5.5%;background:#111826}.brand{font-size:12px;letter-spacing:.24em;font-weight:700}.brand-mark{color:#e5b865;font-size:23px;vertical-align:middle;margin-right:10px}.text-button{background:none;border:0;color:#c8bea9;font-size:13px}.hero{height:min(630px,65vw);min-height:500px;position:relative;overflow:hidden;background:#202331}.hero-art{position:absolute;inset:0;background:url('./assets/bestiary.png') center 43%/cover no-repeat;opacity:.9}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#0b111e 0%,#0b111eea 27%,#0b111e63 62%,#0b111e36 100%),linear-gradient(0deg,#0e1420 0%,transparent 26%)}.hero-content{position:relative;z-index:1;padding:115px 5.5%;max-width:740px}.eyebrow{color:#d6af72;letter-spacing:.2em;font-weight:700;font-size:11px;margin:0 0 18px}h1,h2,h3{font-family:'Cormorant Garamond',Georgia,serif}h1{font-size:clamp(66px,7.3vw,112px);font-weight:500;line-height:.9;letter-spacing:-.045em;margin:0 0 24px}h1 em{font-weight:400;color:#e7c690}.hero-copy{font-size:16px;color:#d4d2cf;line-height:1.7;max-width:400px}.hero-actions{display:flex;align-items:center;gap:23px;margin-top:34px}.primary-button{border:1px solid #f0d8a1;background:#d9ad69;color:#1c1a18;padding:16px 27px;font-weight:700;letter-spacing:.02em;box-shadow:0 8px 30px #0005}.primary-button:hover{background:#edc684}.primary-button:disabled{opacity:.45;cursor:not-allowed}.remaining{font-size:12px;color:#d0c9bb}.content{padding:64px 5.5% 80px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px}h2{font-size:55px;line-height:1;margin:0;font-weight:500}.toolbar{display:flex;flex-wrap:wrap;gap:9px}.small-button{border:1px solid #45505a;background:#182231;color:#e5e2dc;padding:10px 13px;font-size:12px;border-radius:3px}.small-button:hover{border-color:#c9ab74}.danger{color:#d9a7a1}.file-button{cursor:pointer}.file-button input{display:none}.helper{max-width:630px;color:#aeb3b8;font-size:13px;line-height:1.6}.stats{display:flex;gap:25px;border-top:1px solid #303a45;border-bottom:1px solid #303a45;margin:26px 0 26px;padding:17px 0;font-size:12px;color:#b6bcc1}.stats strong{font-size:18px;color:#e5c389;margin-right:5px}.stats span:last-child{margin-left:auto}.card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.card-tile{position:relative;min-height:178px;padding:20px;border:1px solid #35404a;background:linear-gradient(140deg,#202c3b,#151d2a);border-radius:4px;text-align:left;color:#e9e6e0;transition:transform .15s,border-color .15s}.card-tile:hover{transform:translateY(-3px);border-color:#c19c65}.card-tile.drawn{opacity:.48}.card-tile .index{color:#aeb8bd;font-size:11px;letter-spacing:.12em}.card-tile .sigil{position:absolute;right:18px;top:11px;font-family:Georgia,serif;font-size:32px;color:#bd9f6d;opacity:.8}.card-tile h3{font-size:28px;line-height:1;margin:30px 0 7px;font-weight:600}.card-tile p{color:#c8c2b8;font-size:12px;line-height:1.5;margin:0}.card-tile .state{display:block;margin-top:14px;color:#d3ad72;text-transform:uppercase;font-size:10px;letter-spacing:.15em}footer{padding:20px 5.5% 40px;border-top:1px solid #303a45;color:#8e969e;font-size:12px;display:flex;justify-content:space-between}dialog{border:1px solid #a88959;background:#182230;color:#eae4da;box-shadow:0 25px 100px #000b;max-width:min(520px,calc(100vw - 32px));padding:35px;border-radius:5px}dialog::backdrop{background:#060b13d9}.close-button{position:absolute;right:13px;top:7px;color:#eee;background:none;border:0;font-size:30px}.result-dialog{text-align:center;width:500px}.result-dialog .card-face{width:230px;height:300px;margin:10px auto 24px;border:2px solid #d2b47d;outline:1px solid #d2b47d;outline-offset:-10px;background:linear-gradient(#172333cc,#172333dd),url('./assets/bestiary.png') center/cover;display:flex;flex-direction:column;justify-content:space-between;padding:25px 20px}.card-face .suit{font-size:42px;color:#e6c27e}.card-face .rank{font-family:Georgia,serif;font-size:38px;color:#f3e6c8}.result-dialog h2{font-size:42px}.result-dialog p{color:#c6c5c1;line-height:1.6;font-size:14px}.result-dialog .primary-button{margin-top:16px}.rules-dialog{line-height:1.65}.rules-dialog h2{font-size:46px}.rules-dialog p{font-size:14px;color:#d1d0cc}.rules-dialog .rule-note{color:#aeafb1;font-size:12px}@media(max-width:900px){.card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-content{padding-top:100px}.section-heading{align-items:start;flex-direction:column}}@media(max-width:540px){.topbar{height:64px}.brand{font-size:10px}.text-button{font-size:11px}.hero{height:550px}.hero-art{background-position:61% center}.hero-shade{background:linear-gradient(90deg,#0b111eef,#0b111e8c),linear-gradient(0deg,#0e1420,transparent 40%)}.hero-content{padding-top:100px}h1{font-size:67px}.hero-actions{align-items:start;flex-direction:column;gap:13px}.content{padding-top:48px}h2{font-size:46px}.card-grid{gap:9px}.card-tile{min-height:165px;padding:13px}.card-tile h3{font-size:23px}.card-tile .sigil{font-size:26px;right:10px}.toolbar{gap:6px}.small-button{font-size:11px;padding:9px}.stats{gap:12px;font-size:11px}footer{gap:15px;flex-direction:column}}