:root{--bg:#1a1420;--panel:#2b2233;--panel-hi:#3d3048;--ink:#f0e6d2;--muted:#b8ab96;--accent:#d9a441}*{box-sizing:border-box}body{background:var(--bg);color:var(--ink);margin:0;font:15px/1.5 Georgia,serif}header{z-index:2;background:var(--panel);border-bottom:2px solid #000;align-items:center;gap:12px;padding:10px 16px;display:flex;position:sticky;top:0}header h1{color:var(--accent);flex:1;margin:0;font-size:18px}header a{color:var(--ink);text-decoration:none}main{max-width:900px;margin:0 auto;padding:8px 16px 64px}h2{color:var(--accent);margin:28px 0 4px;font-size:18px}p{color:var(--muted);margin:4px 0 12px}.intro{color:var(--ink)}code{background:var(--panel);padding:1px 4px}canvas{image-rendering:pixelated;display:block}.stage{background:#0e0a14;border:2px solid #000;justify-content:center;padding:8px 0;display:flex}.grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;display:grid}.card{background:var(--panel);box-shadow:inset 2px 2px 0 var(--panel-hi);text-align:center;border:2px solid #000;flex-direction:column;align-items:center;gap:4px;padding:8px;font-size:13px;display:flex}.card small{color:var(--muted)}.dice{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;display:grid}.die-card{cursor:pointer;color:var(--ink);font:inherit}.die-card:active{transform:translateY(1px)}.die-card b{font-size:14px}.sheet{z-index:5;background:#0008;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet[hidden]{display:none}.sheet-card{background:var(--panel);width:100%;max-width:520px;max-height:92vh;box-shadow:inset 2px 2px 0 var(--panel-hi);border:2px solid #000;border-bottom:0;padding:14px 16px 24px;position:relative;overflow-y:auto}.sheet-card h3{color:var(--accent);margin:0}.sub{margin:0 0 10px}.close{font:inherit;color:var(--ink);background:var(--panel-hi);cursor:pointer;border:2px solid #000;width:34px;height:34px;position:absolute;top:10px;right:10px}.net{grid-template-columns:repeat(4,1fr);gap:4px;max-width:340px;margin:0 auto;display:grid}.net button{cursor:pointer;aspect-ratio:1;background:0 0;border:0;padding:0}.net button canvas{width:100%;height:100%}.net button.selected{outline:3px solid var(--accent);outline-offset:1px}.net .gap{aspect-ratio:1}.detail{align-items:flex-start;gap:14px;min-height:100px;margin-top:16px;display:flex}.detail canvas{flex:none;width:96px;height:96px}.detail h4{color:var(--ink);margin:0 0 4px;font-size:17px}.detail p{margin:0 0 6px}.detail .hint{color:var(--muted);font-style:italic}