.piou-page{--piou-width:min(680px,calc((100svh - var(--nav-h,70px) - 220px)*.9),100%);padding:calc(var(--nav-h,70px) + 16px) 16px 28px;min-height:100vh;background:radial-gradient(ellipse at 50% 25%,#fff7df 0,#f8ecd3 55%,#ead6b5 100%);color:#613216;display:flex;flex-direction:column;align-items:center;gap:12px;box-sizing:border-box;font-family:system-ui,sans-serif}
.piou-tools,.piou-hud,.piou-controls{width:var(--piou-width);display:flex;align-items:center;justify-content:space-between;gap:10px}.piou-heading h1{font-family:'Paytone One',system-ui;font-size:clamp(1.2rem,3vw,1.55rem);margin:0;color:#653019}.piou-tools button{border:1px solid #e8cda7;background:#fffaf0;border-radius:13px;color:#9a571f;padding:9px 14px;text-decoration:none;cursor:pointer;font-size:1.2rem;box-shadow:0 3px 0 #dbbd9538}
.piou-hud{padding:0;font-size:.68rem;text-align:center;text-transform:uppercase;letter-spacing:.08em;font-weight:800;color:#9d7551}.piou-hud span{flex:1;background:#fffcf5;border:1px solid #ead6b8;border-radius:13px;padding:10px 5px;box-shadow:0 3px 0 #d2ae7526}.piou-hud strong{display:block;font-size:clamp(1.1rem,3vw,1.5rem);letter-spacing:0;color:#df751c;margin-top:3px;font-variant-numeric:tabular-nums}.piou-stage{position:relative;width:var(--piou-width);border:5px solid #ffd166;border-radius:16px;overflow:hidden;box-sizing:border-box;box-shadow:0 0 0 2px #be7327,0 7px 0 #9b5424,0 20px 44px #7c481f30;background:#59230f}#piou-canvas{display:block;width:100%;height:auto;aspect-ratio:9/10;outline:none;touch-action:none}
.piou-overlay{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 25%,#fff8e7,#fff3df 70%,#efc97c);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:20px;box-sizing:border-box;overflow:auto}.piou-overlay[hidden]{display:none}.piou-overlay>img{width:clamp(140px,26svh,235px);height:auto;max-width:65%;flex-shrink:0;object-fit:contain;filter:drop-shadow(0 8px 8px #b5783033)}.piou-overlay h2{font-family:'Paytone One',system-ui;margin:0;font-size:1.45rem;color:#7a421b}.piou-overlay p{font-size:.86rem;line-height:1.5;margin:0;max-width:390px;flex-shrink:0}.piou-values{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;font-weight:800;color:#7c4c23;font-size:.85rem;flex-shrink:0}.piou-values span{display:flex;align-items:center;gap:5px;background:#fffaf0;border:1px solid #ebd2a5;border-radius:10px;padding:5px 8px}.piou-values img{width:28px;height:28px;object-fit:contain}.piou-primary{border:2px solid #ffe2a1;border-radius:15px;padding:13px 35px;background:linear-gradient(#ffc856,#f59526);color:#653519;font:900 1.05rem system-ui;cursor:pointer;box-shadow:0 5px 0 #b96a23,0 9px 20px #b17c2830;flex-shrink:0}.piou-primary:disabled{opacity:.6;cursor:wait}.piou-controls{padding-top:6px}.piou-controls button{border:2px solid #f5dcaf;border-radius:14px;background:linear-gradient(#fffdf6,#f5e2bb);color:#8b5224;min-height:58px;flex:1;font:900 1.35rem system-ui;box-shadow:0 4px 0 #c09d6b;touch-action:none;user-select:none;-webkit-user-select:none}.piou-controls button:active{transform:translateY(3px);box-shadow:none}.piou-help{font-size:.73rem;text-align:center;color:#937351;line-height:1.6;margin:3px 0}#piou-message{color:#a33620}
@media(max-width:520px){.piou-page{--piou-width:100%;padding:calc(var(--nav-h,60px) + 8px) 10px 20px;gap:8px}.piou-overlay{gap:8px;padding:12px;justify-content:flex-start}.piou-overlay>img{width:110px;max-height:110px}.piou-overlay h2{font-size:1.05rem}.piou-overlay p{font-size:.73rem;line-height:1.4}.piou-primary{padding:10px 28px}.piou-heading h1{font-size:1.1rem}.piou-help{font-size:.66rem}.piou-values{font-size:.72rem;gap:4px}.piou-values span{padding:4px 5px}.piou-values img{width:24px;height:24px}.piou-hud{font-size:.59rem;gap:6px}.piou-hud span{padding:7px 4px}.piou-controls button{min-height:54px}}

.piou-tools{justify-content:flex-end}.piou-tools button{font:700 .8rem system-ui;min-height:40px}.piou-tools+.piou-controls{padding-top:0}

.piou-seo{max-width:900px;margin:28px auto;padding:24px;border:1px solid #e8cda7;border-radius:18px;background:#fffaf0;color:#613216;font-family:system-ui,sans-serif;box-sizing:border-box}.piou-seo h1{font-size:clamp(1.3rem,3vw,1.8rem);line-height:1.3;margin:0 0 16px}.piou-seo h2{font-size:1.15rem;margin:24px 0 10px;color:#8b5224}.piou-seo p{font-size:.95rem;line-height:1.8;margin:10px 0}.piou-seo a{color:#965014;font-weight:700;text-decoration:underline;text-underline-offset:3px}@media(max-width:520px){.piou-seo{margin:20px 10px;padding:18px}}

.piou-page,#piou-paused{user-select:none;-webkit-user-select:none}.piou-seo{user-select:text;-webkit-user-select:text}

#piou-paused .mgc-rules-card{width:min(540px,100%)!important;max-width:540px!important;padding:20px!important;border-radius:20px!important;scrollbar-width:thin}
#piou-paused h2{font-size:1.15rem!important;margin:0 40px 14px 0!important}
#piou-paused h3{margin:14px 0 5px!important;font-size:.88rem!important}
#piou-paused p{max-width:none;margin:0;font-size:.82rem!important;line-height:1.5!important}
#piou-paused .mgc-rules-steps{gap:7px;margin:0 0 12px}
#piou-paused .mgc-rules-step{padding:8px 5px;border-radius:12px}
#piou-paused .mgc-rules-picture{min-height:32px;font-size:22px;gap:3px}
#piou-paused .mgc-rules-picture img{width:27px;height:27px}
#piou-paused .mgc-rules-step strong{margin-top:5px;font-size:.72rem}
#piou-paused .mgc-rules-step small{font-size:.65rem;margin-top:3px}
#piou-paused .mgc-rules-x{top:10px!important;right:10px!important;width:34px!important;height:34px!important;min-height:34px!important;font-size:24px!important}
#piou-paused .mgc-rules-resume{margin-top:16px;border-radius:12px}
#piou-paused .mgc-rules-help{display:none}
@media(max-width:480px){#piou-paused .mgc-rules-card{padding:16px!important}#piou-paused .mgc-rules-step small{display:none}#piou-paused .mgc-rules-picture{font-size:19px}#piou-paused .mgc-rules-step strong{font-size:.68rem}#piou-paused h3{margin-top:12px!important}}