/* Fun Lab 07: Broken RPG Quest, grayscale dungeon parchment and large readable d20. */
.brpg-page{max-width:1210px;margin:0 auto;padding-bottom:3.5rem;color:#181818}
.brpg-page [hidden]{display:none!important}
.brpg-hero{padding:1.4rem 0 1.25rem;border-bottom:1px solid #d2d2d2}
.brpg-hero .eyebrow{font-size:.72rem;letter-spacing:.13em}
.brpg-hero h1{font-size:clamp(2.1rem,5vw,4.1rem);line-height:1.05;letter-spacing:-.05em;margin:.45rem 0}
.brpg-hero>p:not(.eyebrow){font-size:.94rem;line-height:1.55;color:#5b5b5b;max-width:770px;margin:.5rem 0}
.brpg-tags{display:flex;gap:.42rem;flex-wrap:wrap;margin-top:1rem}
.brpg-tags span{font-size:.72rem;border:1px solid #bdbdbd;border-radius:99px;padding:.34rem .62rem;color:#555}
.brpg-layout{display:grid;grid-template-columns:minmax(260px,.68fr) minmax(0,1.32fr);gap:1rem;margin:1.2rem 0;align-items:start}
.brpg-panel{display:grid;gap:.75rem;min-width:0}
.brpg-config,.brpg-stats,.brpg-journal{background:#fff;border:1px solid #d2d2d2;border-radius:11px;padding:1.1rem;min-width:0}
.brpg-label{font:800 .66rem/1.5 ui-monospace,monospace;letter-spacing:.09em;color:#777;margin:0}
.brpg-config h2{font-size:1.3rem;letter-spacing:-.03em;line-height:1.2;margin:.4rem 0 1rem}
.brpg-input-label{display:grid;gap:.35rem;font-size:.76rem;font-weight:750;color:#444;margin:.8rem 0}
.brpg-input-label select{background:white;color:#222;min-height:45px;border:1px solid #bfbfbf;border-radius:6px;padding:.5rem;font:600 .82rem system-ui,sans-serif;width:100%}
.brpg-flavor{font-size:.77rem;color:#555;line-height:1.5;background:#f2f2f2;border-radius:5px;padding:.6rem;margin:.75rem 0}
.brpg-bonuses{display:flex;flex-wrap:wrap;gap:.35rem}
.brpg-bonuses span{font:750 .67rem ui-monospace,monospace;padding:.3rem .45rem;border-radius:4px;background:#e9e9e9;color:#333}
.brpg-start{width:100%;min-height:45px;margin:.95rem 0 .45rem;justify-content:center;white-space:normal;text-align:center}
.brpg-small{color:#777;font-size:.7rem;line-height:1.55;margin:.6rem 0 .2rem}
.brpg-stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.38rem;margin-top:.75rem}
.brpg-stats-grid>div{border:1px solid #d9d9d9;border-radius:6px;background:#f7f7f7;display:grid;gap:.3rem;padding:.55rem .35rem;min-width:0;text-align:center}
.brpg-stats-grid span{font-size:.65rem;color:#666}
.brpg-stats-grid strong{font:800 .9rem ui-monospace,monospace;color:#222}
.brpg-chaos-track{height:5px;border-radius:50px;background:#ddd;overflow:hidden;margin-top:.8rem}
.brpg-chaos-track i{height:100%;width:10%;display:block;background:#3b3b3b;transition:width .15s}
.brpg-journal-head{display:flex;justify-content:space-between;align-items:center;gap:.5rem}
.brpg-journal-head h3{font-size:.85rem;margin:0}
.brpg-journal-head span{font:750 .71rem ui-monospace,monospace;color:#777}
.brpg-journal-entry{border-left:2px solid #444;margin:.8rem 0;padding:.55rem .65rem;background:#f7f7f7}
.brpg-journal-step{display:block;font:750 .61rem ui-monospace,monospace;color:#7c7c7c;letter-spacing:.06em}
.brpg-journal-entry strong{display:block;font-size:.76rem;line-height:1.3;margin-top:.3rem}
.brpg-journal-entry p{font-size:.72rem;line-height:1.45;color:#6c6c6c;margin:.25rem 0 0}
.brpg-stage{border:1px solid #2b2b2b;border-radius:13px;background:#1e1e1e;color:#f6f6f6;min-height:420px;overflow:hidden}
.brpg-empty{min-height:420px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:2.2rem 1.3rem}
.brpg-intro-die{display:grid;place-items:center;width:110px;height:110px;background:linear-gradient(145deg,#fff,#777);clip-path:polygon(50% 0%,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);font:900 2.5rem ui-monospace,monospace;color:#222;filter:drop-shadow(0 2px 4px #555)}
.brpg-empty .brpg-label{margin:1rem 0 0}
.brpg-empty h2{font-size:clamp(1.5rem,3vw,2rem);max-width:440px;line-height:1.18;letter-spacing:-.04em;margin:.7rem 0}
.brpg-empty>p:not(.brpg-label){font-size:.86rem;line-height:1.5;color:#bcbcbc;max-width:400px}
.brpg-playing{padding:1.2rem 1.25rem}
.brpg-heading{display:flex;justify-content:space-between;align-items:center;gap:.5rem;border-bottom:1px solid #4c4c4c;padding-bottom:.7rem;font:750 .68rem ui-monospace,monospace;color:#b5b5b5;letter-spacing:.06em}
.brpg-playing>h2{font-size:clamp(1.5rem,3.3vw,2.5rem);line-height:1.12;letter-spacing:-.04em;margin:.95rem 0 .6rem;color:white}
.brpg-premise{font-size:.82rem;line-height:1.55;color:#c5c5c5;margin:.3rem 0 1rem}
.brpg-scene{padding:.9rem;background:#2a2a2a;border:1px solid #515151;border-radius:8px;margin:1rem 0 1.25rem}
.brpg-scene>span,.brpg-action-kicker{font:800 .65rem ui-monospace,monospace;color:#aaa;letter-spacing:.08em}
.brpg-scene p{font-size:.84rem;line-height:1.6;margin:.5rem 0 .15rem;color:#eee}
.brpg-choice-list{display:grid;gap:.5rem;margin:.7rem 0}
.brpg-choice{display:grid;gap:.5rem;position:relative;cursor:pointer;text-align:left;border:1px solid #777;border-radius:8px;background:#333;color:#f5f5f5;padding:.78rem 2rem .72rem .85rem;min-height:83px;min-width:0}
.brpg-choice>strong{font-size:.89rem;line-height:1.38}
.brpg-choice-stats{display:flex;gap:.32rem;flex-wrap:wrap}
.brpg-choice-stats span{font:700 .62rem ui-monospace,monospace;border-radius:3px;background:#505050;padding:.19rem .34rem;color:#ddd}
.brpg-choice>i{position:absolute;right:.75rem;top:50%;transform:translateY(-50%);font:normal 1.2rem system-ui;color:#aaa}
.brpg-choice:hover,.brpg-choice:focus-visible{background:#f1f1f1;color:#151515;border-color:white;outline:2px solid white;outline-offset:1px}
.brpg-choice:hover .brpg-choice-stats span,.brpg-choice:focus-visible .brpg-choice-stats span{background:#ddd;color:#333}
.brpg-rolling{border:1px solid #545454;border-radius:9px;padding:1rem;text-align:center}
.brpg-rolling h3{font-size:1.1rem;line-height:1.35;margin:.65rem 0;color:white}
.brpg-rolling>p:not(.brpg-label){font:.75rem/1.45 ui-monospace,monospace;color:#bdbdbd}
.brpg-die-area{display:grid;place-items:center;margin:1rem 0}
.brpg-d20{height:138px;width:138px;display:grid;place-items:center;position:relative;clip-path:polygon(50% 0%,92% 24%,92% 76%,50% 100%,8% 76%,8% 24%);background:conic-gradient(from 45deg,#ddd,#7f7f7f,#f7f7f7,#555,#ddd);color:#121212}
.brpg-d20::before{content:'';position:absolute;inset:13px;clip-path:polygon(50% 0%,100% 100%,0% 100%);border:2px solid #555;background:rgba(255,255,255,.11)}
.brpg-d20 span{position:relative;z-index:1;font:900 3.1rem ui-monospace,monospace;text-shadow:0 1px 1px #fff}
.brpg-die-rolled{animation:brpg-pop .25s ease-out}
@keyframes brpg-pop{0%{transform:rotate(-24deg) scale(.85)}100%{transform:rotate(0) scale(1)}}
.brpg-roll-button{min-height:47px;width:100%;justify-content:center}
.brpg-recap,.brpg-ending{border:1px solid #555;border-radius:9px;padding:1.1rem;background:#f0f0f0;color:#222}
.brpg-recap h3,.brpg-ending h3{font-size:clamp(1.2rem,2.5vw,1.75rem);line-height:1.25;letter-spacing:-.025em;margin:.65rem 0}
.brpg-recap>p:not(.brpg-label),.brpg-ending>p:not(.brpg-label){font-size:.84rem;line-height:1.55;color:#444}
.brpg-roll-detail{font:850 .83rem ui-monospace,monospace!important;background:#d6d6d6;padding:.65rem;border-radius:5px}
.brpg-next,.brpg-ending button{width:100%;min-height:45px;margin-top:.65rem;justify-content:center}
.brpg-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.45rem;border-top:1px solid #4c4c4c;padding-top:1rem;margin-top:1.2rem}
.brpg-actions .button{font-size:.72rem;white-space:normal;min-height:42px;padding:.5rem;background:#333;color:white;border:1px solid #666;justify-content:center;text-align:center}
.brpg-actions .button:hover{background:#eee;color:#222}
.brpg-status,.brpg-disclaimer{font-size:.73rem;line-height:1.5;color:#777}
.brpg-copy-fallback{width:100%;min-height:95px;padding:.6rem;border:1px solid #888;border-radius:5px}
@media(max-width:900px){.brpg-layout{grid-template-columns:minmax(0,1fr)}.brpg-panel{grid-template-columns:repeat(2,minmax(0,1fr))}.brpg-panel>.brpg-small{grid-column:1/-1}.brpg-journal{grid-column:2;grid-row:1/3}.brpg-stats{grid-column:1}}
@media(max-width:560px){.brpg-hero{padding:.9rem 0}.brpg-layout{gap:.7rem}.brpg-panel{grid-template-columns:minmax(0,1fr)}.brpg-journal,.brpg-stats{grid-column:auto;grid-row:auto}.brpg-panel>.brpg-small{grid-column:auto}.brpg-playing{padding:.85rem}.brpg-actions{grid-template-columns:minmax(0,1fr)}.brpg-empty{min-height:300px}.brpg-stage{min-height:300px}.brpg-heading{font-size:.59rem}.brpg-tags span{font-size:.64rem}}
@media(prefers-reduced-motion:reduce){.brpg-die-rolled{animation:none}.brpg-chaos-track i{transition:none}}

.brpg-outcome-die{display:flex;align-items:center;gap:.75rem;margin:.7rem 0;flex-wrap:wrap}.brpg-d20-small{width:67px;height:67px;flex:none}.brpg-d20-small::before{inset:6px}.brpg-d20-small span{font-size:1.7rem}.brpg-outcome-die .brpg-roll-detail{flex:1;margin:0}