*{box-sizing:border-box}body{margin:0;min-height:100dvh;background:radial-gradient(ellipse at 18% 15%,#dce4d5,transparent 65%),radial-gradient(ellipse at 90% 85%,#eed6c5,transparent 60%),#edeae3;color:#49382e;font:14px system-ui;display:flex;flex-direction:column;align-items:center;padding:18px;gap:12px}header{display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap}header strong{font-size:16px}header small{font-size:11px;display:block;margin-top:4px;color:#8c7a6d}.controls{display:flex;gap:5px;padding:5px;border-radius:24px;background:#ffffffa8}.controls button{background:none;border:0;border-radius:18px;padding:9px 15px;font:600 12px system-ui;color:#674d3b;cursor:pointer}.controls button:hover,.controls button:focus-visible{background:#e1ecdc;color:#25673f}iframe{width:390px;height:844px;max-height:none;border:7px solid #42372f;border-radius:39px;background:#f7f4ee;box-shadow:0 18px 55px #49332330;overflow:hidden}footer{font-size:11px;color:#8b7869}a{color:#6c594a}@media(max-width:460px){body{padding:0;gap:0}header{padding:8px;gap:8px}header>div:first-child{display:none}iframe{width:100%;height:calc(100dvh - 60px);max-height:none;border:0;border-radius:0}footer{display:none}}
iframe{box-sizing:content-box}