*{margin:0;padding:0;box-sizing:border-box}body{font-family:system-ui,-apple-system,sans-serif;background:linear-gradient(135deg,#0f172a,#1e1b4b);color:#e2e8f0;min-height:100vh}.page{max-width:720px;margin:0 auto;padding:16px;display:flex;flex-direction:column;gap:16px}header{display:grid;grid-template-columns:minmax(52px,1fr) minmax(0,2fr) minmax(52px,1fr);align-items:center;gap:6px;min-height:44px}header h1{grid-column:2;font-size:clamp(1.05rem,4.5vw,1.5rem);text-align:center;overflow-wrap:break-word;line-height:1.25}.back{grid-column:1;justify-self:start;display:inline-flex;align-items:center;min-height:44px;padding:0 4px;color:#cbd5e1;text-decoration:none;font-size:.9rem;white-space:nowrap}.back:hover{color:#fff}main{display:flex;flex-direction:column;align-items:center;gap:10px}canvas{display:block;width:100%;max-width:480px;aspect-ratio:3 / 4;border-radius:8px;background:#0f172a;box-shadow:0 16px 36px #00000038;touch-action:none;cursor:crosshair}.hint{width:100%;text-align:center;font-size:.95rem;color:#e2e8f0}.content{width:100%;max-width:640px;margin:4px auto 0;font-size:.92rem;line-height:1.65;color:#cbd5e1}.content h2{font-size:1.05rem;color:#e2e8f0;margin:20px 0 8px}.content h2:first-child{margin-top:0}.content p{margin:0 0 10px}.content ul{margin:0 0 10px;padding-left:20px}.content li{margin-bottom:6px}@media(max-width:480px){.content{font-size:.88rem}}footer{text-align:center;color:#cbd5e1}footer a{color:#e2e8f0}