@font-face{font-family:"PP Hey Comic";src:url("../heyfont/Hey Comic/Web Fonts/e9b073011bb8c833864edb16b78b41a5.woff2") format("woff2"),url("../heyfont/Hey Comic/Web Fonts/e9b073011bb8c833864edb16b78b41a5.woff") format("woff");font-style:normal;font-weight:400;font-display:block}
body.dialogue-page{grid-template-rows:auto minmax(0,1fr) auto;height:var(--dialogue-viewport-height,100dvh)}
.pp-dialogue-bar{display:none;position:relative;z-index:2;padding:.55rem 1rem;background:#fcfbf9;color:#111;text-align:center;line-height:1.25}
body.dialogue-page .pp-dialogue-bar{display:block}
.pp-dialogue-bar p{margin:.15rem 0 .4rem}.pp-dialogue-actions{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.4rem}
.pp-dialogue-bar button,.pp-dialogue-archive button{min-height:2.75rem;padding:.45rem .8rem;border:1px solid #242424;border-radius:.35rem;cursor:pointer;background:#fff;color:#111;font:inherit}
.pp-dialogue-bar button:focus-visible,.pp-dialogue-archive button:focus-visible{outline:3px solid #216ea5;outline-offset:2px}.pp-dialogue-bar .pp-primary{background:#ffeb61;font-weight:650}
.pp-dialogue-subtitle{font-size:.8rem;color:#555}.pp-dialogue-feedback{min-height:1.1em;margin:.35rem 0 0!important;font-size:.85rem}.pp-dialogue-feedback[data-error="true"]{color:#9c250d}
body.dialogue-page #viewer{overflow:auto;overscroll-behavior:contain;align-items:safe center;scroll-behavior:smooth}
body.dialogue-page #comic{position:relative;top:5px}
.pp-dialogue-overlay{overflow:visible}.pp-dialogue-hotspot{display:block;width:100%;height:100%;padding:0;border:0;border-radius:45%;background-color:rgba(255,239,116,.08);background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20200%20200%22%20preserveAspectRatio%3D%22none%22%3E%3Crect%20x%3D%224%22%20y%3D%224%22%20width%3D%22192%22%20height%3D%22192%22%20rx%3D%2286%22%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%227%22%20stroke-linecap%3D%22round%22%20stroke-dasharray%3D%229%209%22%20vector-effect%3D%22non-scaling-stroke%22%2F%3E%3Crect%20x%3D%224%22%20y%3D%224%22%20width%3D%22192%22%20height%3D%22192%22%20rx%3D%2286%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%20stroke-dasharray%3D%229%209%22%20vector-effect%3D%22non-scaling-stroke%22%2F%3E%3C%2Fsvg%3E");background-size:100% 100%;background-repeat:no-repeat;cursor:pointer;box-shadow:none;touch-action:manipulation}
.pp-dialogue-hotspot:hover,.pp-dialogue-hotspot:focus-visible{background-color:rgba(255,239,116,.25);outline:3px solid #1474a4;outline-offset:-3px}
.pp-dialogue-editor,.pp-dialogue-words{font-family:"PP Hey Comic",sans-serif!important;font-size:var(--pp-dialogue-font,30px)!important;font-weight:400!important;font-style:normal!important;line-height:var(--pp-dialogue-leading,32px)!important;letter-spacing:0!important;text-align:center!important;color:#111!important;background:transparent!important;box-sizing:border-box!important;padding:0!important;border:0!important;margin:0!important;outline:none!important;width:100%;height:100%;overflow:hidden;overflow-wrap:anywhere;white-space:pre-wrap;word-break:normal;resize:none;-webkit-text-size-adjust:100%;text-size-adjust:100%}
.pp-dialogue-editor{font-weight:300!important;display:block;caret-color:#111;border-radius:0!important;touch-action:manipulation}.pp-dialogue-editor::placeholder{color:#777;opacity:1}.pp-dialogue-words{color:#333!important;font-size:calc(var(--pp-dialogue-font,30px) - 1pt)!important;display:flex;align-items:center;justify-content:center}.pp-dialogue-words span{white-space:pre-wrap;overflow-wrap:anywhere;width:100%}
.pp-dialogue-words.pp-dialogue-svg-words{display:inline;white-space:pre;fill:currentColor;pointer-events:none}
.pp-dialogue-archive{max-width:min(92vw,36rem);max-height:80dvh;padding:1rem;border:2px solid #222;border-radius:.5rem;background:#fcfbf9;color:#111}.pp-dialogue-archive::backdrop{background:rgba(0,0,0,.55)}.pp-dialogue-archive h2{font-size:1.15rem;margin:.1rem 0 .5rem}.pp-dialogue-archive ul{list-style:none;padding:0;margin:.75rem 0}.pp-dialogue-archive li{margin:.4rem 0}.pp-dialogue-archive li button{width:100%;text-align:left}
@media(max-width:35rem){.pp-dialogue-bar{padding:.4rem .5rem}.pp-dialogue-bar button{font-size:.85rem;padding:.4rem .6rem}.pp-dialogue-bar p{font-size:.9rem}.pp-dialogue-subtitle{font-size:.75rem!important}}

/* Hide introductory copy without changing the space reserved above the comic. */
#dialogue-heading .pp-dialogue-subtitle,#dialogue-heading[data-phase="choice"] #dialogue-instruction{visibility:hidden}

/* Clearly distinguish unavailable actions from active yellow buttons. */
.pp-dialogue-bar button:disabled{opacity:.4;filter:grayscale(1);cursor:default}

/* Keep the comic in place while removing saved-preview headings. */
#dialogue-heading[data-phase="preview"]{visibility:hidden}
@media(hover:none),(pointer:coarse){
 .pp-dialogue-bar button{font-size:1.05rem;min-height:3rem;padding:.55rem .8rem}
 #dialogue-heading #dialogue-instruction{position:relative;top:1.25rem;font-size:1.25rem;line-height:1.3}
 .pp-dialogue-bar .pp-dialogue-feedback{font-size:1rem;line-height:1.3}
}

/* Keep existing artwork placement while hiding all top copy and lifting controls. */
#dialogue-heading{visibility:hidden}
#dialogue-controls{top:-1.5rem}

/* Emphasize the small deck target in ending3 panel 3. */
.pp-dialogue-hotspot-emphasis{background-color:rgba(255,239,116,.18);background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20200%20200%22%20preserveAspectRatio%3D%22none%22%3E%3Crect%20x%3D%224%22%20y%3D%224%22%20width%3D%22192%22%20height%3D%22192%22%20rx%3D%2286%22%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%2210%22%20stroke-linecap%3D%22round%22%20stroke-dasharray%3D%229%209%22%20vector-effect%3D%22non-scaling-stroke%22%2F%3E%3Crect%20x%3D%224%22%20y%3D%224%22%20width%3D%22192%22%20height%3D%22192%22%20rx%3D%2286%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%224%22%20stroke-linecap%3D%22round%22%20stroke-dasharray%3D%229%209%22%20vector-effect%3D%22non-scaling-stroke%22%2F%3E%3C%2Fsvg%3E")}

/* Optional attribution belongs to the saved comic and follows its artwork. */
#dialogue-writer-credit{position:fixed;z-index:3;text-align:right;font:14px/1.25 "PP Hey Comic",sans-serif;color:#111;overflow-wrap:anywhere;pointer-events:none}
#dialogue-writer-credit[hidden]{display:none}
.pp-dialogue-writer-dialog h2{margin-bottom:1rem}
.pp-dialogue-writer-dialog form{display:grid;gap:.75rem}
.pp-dialogue-writer-dialog label{display:block;text-align:left}
.pp-dialogue-writer-dialog input{min-width:0;width:100%;padding:.6rem;border:1px solid #444;border-radius:.3rem;font:16px/1.3 system-ui,sans-serif}
.pp-dialogue-writer-dialog form p{margin:0;font-size:.9rem;color:#9c250d}

/* Touch keyboard: keep the editor scrollable above controls and the keyboard. */
@media(hover:none),(pointer:coarse){
 /* Reading uses the stable layout viewport; only a focused editor uses keyboard height. */
 body.dialogue-page{width:100%}
 body.dialogue-page #viewer{max-width:100%;scroll-behavior:auto}
 body.dialogue-page #comic{max-width:100%}
 body.dialogue-page.dialogue-keyboard{grid-template-rows:minmax(0,1fr) auto;position:relative;top:var(--dialogue-viewport-offset,0px)}
 body.dialogue-page.dialogue-keyboard #dialogue-heading{display:none}
 body.dialogue-page.dialogue-keyboard #dialogue-controls{top:0;padding-bottom:max(.5rem,env(safe-area-inset-bottom))}
 body.dialogue-page.dialogue-keyboard #viewer{align-items:start;align-content:start;padding-top:12px;padding-bottom:36px;scroll-padding:16px}
}