*{box-sizing:border-box}html{font-family:Arial,sans-serif;color:#163355;background:#e9eedf}body{margin:0;min-height:100dvh;display:grid;place-items:center}.device{width:320px;max-width:100vw;min-height:240px;background:#fff7de;display:flex;flex-direction:column;border-radius:12px;overflow:hidden;box-shadow:0 12px 40px #16335520}header{height:32px;background:#1f508d;color:#fffdf4;display:flex;align-items:center;gap:9px;padding:0 12px}header span{font-size:12px;font-weight:bold}header strong{font-size:14px}header img{width:32px;height:32px;object-fit:contain;margin-left:auto}article{padding:8px 12px;flex:1}.tag{font-size:14px;font-weight:bold;color:#9c4d12;margin:0 0 6px}h1{font-size:20px;line-height:1.12;margin:0 0 8px}#body{font-size:16px;line-height:1.2;margin:0}nav{padding:6px 12px 8px;display:flex;align-items:center;justify-content:space-between;gap:8px}button{font:inherit;font-size:14px;color:white;background:#1f508d;border:0;border-radius:7px;min-height:30px;padding:4px 10px;cursor:pointer}button:disabled{background:#d5dccf;color:#536056;cursor:default}button:focus-visible{outline:3px solid #d9a024;outline-offset:2px}#count{font-size:14px;font-weight:bold}@media(min-width:500px){.device{outline:6px solid #34483d}}