*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#06090c;color:#e3e8e9;font-family:"Microsoft YaHei",system-ui,sans-serif}canvas{position:fixed;inset:0;width:100%;height:100%;touch-action:none;outline:none}header,footer{position:fixed;left:38px;right:38px;display:flex;justify-content:space-between;align-items:center;z-index:2}header{top:30px;letter-spacing:2px;font-size:19px}header small{display:block;font-size:9px;letter-spacing:3px;color:#697982;margin-top:8px}header>span{font-size:10px;border:1px solid #4b566550;border-radius:30px;padding:8px 13px;letter-spacing:1px}main{position:fixed;left:5%;top:25%;pointer-events:none}.kicker{font-size:10px;letter-spacing:3px;color:#71b0b8}h1{font-weight:300;font-size:clamp(60px,6vw,90px);letter-spacing:13px;line-height:1.2;margin:23px 0}h1 span{display:block;font-size:12px;letter-spacing:6px;margin-top:22px}main p{font-size:12px;line-height:2.2;letter-spacing:2px;color:#86999f}.status{display:flex;align-items:center;gap:10px;margin-top:30px;font-size:10px;letter-spacing:2px;color:#94bcc0}.status i{width:5px;height:5px;border-radius:100%;background:#a5eee0;box-shadow:0 0 12px #a5eee0}aside{position:fixed;right:38px;top:35%;width:205px;background:#0c141a99;border:1px solid #abbac425;backdrop-filter:blur(15px);padding:18px 15px;border-radius:5px;z-index:2}label{font-size:11px;letter-spacing:2px;display:block}output{float:right;color:#a1c8c6}input{width:100%;margin:18px 0 22px;accent-color:#a4d7d3}button{font:inherit;font-size:11px;white-space:nowrap;color:#b7c5ca;background:#10202566;border:1px solid #738b9940;padding:9px 10px;cursor:pointer}button:hover,button[aria-pressed=true]{background:#29413e;color:#e0fff6;border-color:#94c3c0}button:focus-visible{outline:2px solid #ead7a4;outline-offset:3px}.palettes,.actions{display:flex;gap:5px}.palettes button,.actions button{flex:1;padding:8px 6px}.actions{margin-top:15px}footer{bottom:26px;font-size:10px;letter-spacing:1px;color:#83999f;gap:10px}footer b{margin:0 7px;font-weight:400;color:#3c5b64}footer div{display:flex;align-items:center;gap:9px}#quality{font-size:9px;margin-right:10px;color:#6f9298}#fallback{position:fixed;z-index:9;inset:35% 10% auto;background:#16222a;padding:30px;border:1px solid #7aa0a3}#toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%);font-size:12px;background:#15313b;padding:12px 20px;opacity:0;pointer-events:none}#toast.show{opacity:1}@media(max-width:700px){header,footer{left:20px;right:20px}header{top:20px;font-size:15px}header small{font-size:8px;letter-spacing:1px}header>span{font-size:9px}main{left:7%;top:14%}.kicker{font-size:8px;letter-spacing:2px}h1{font-size:48px;letter-spacing:8px;margin:13px 0}h1 span{font-size:9px;letter-spacing:3px;margin-top:12px}main p{font-size:10px;line-height:1.8}.status{font-size:8px;margin-top:15px}aside{top:auto;bottom:111px;left:20px;right:20px;width:auto;padding:12px 15px;display:grid;grid-template-columns:1fr 1fr;gap:0 15px}aside label{font-size:10px}aside input{grid-column:1;margin:10px 0 0}.palettes{grid-column:2;grid-row:1}.actions{grid-column:2;grid-row:2;margin-top:6px}.actions button,.palettes button{font-size:10px;padding:6px 3px}footer{bottom:18px;flex-direction:column;align-items:stretch;gap:12px;font-size:8px}footer b{margin:0 3px}footer div{justify-content:flex-end}#quality{margin-right:auto}footer button{padding:7px 12px}}
/* Published artwork navigation */
.return-nav{position:fixed;top:83px;right:38px;z-index:5;display:flex;gap:8px}.return-nav a{display:inline-flex;align-items:center;min-height:32px;padding:7px 12px;border:1px solid #91b5bd40;border-radius:4px;background:#09161bba;color:#c5dbdf;text-decoration:none;font-size:11px;letter-spacing:1px;backdrop-filter:blur(10px)}.return-nav a:hover{border-color:#a2dcd3;color:#effffb;background:#23423d}.return-nav a:focus-visible{outline:2px solid #d6e9bb;outline-offset:3px}@media(max-width:700px){.return-nav{top:75px;right:20px;gap:6px}.return-nav a{font-size:10px;min-height:32px;padding:6px 9px}}

/* Creation date */
.edition{font:11px monospace;text-align:right;letter-spacing:.15em}.edition span{display:block;margin-top:10px;color:#86999f;font-size:10px;letter-spacing:.06em}@media(max-width:700px){.edition{font-size:10px}.edition span{font-size:9px;margin-top:8px}}