:root{font-family:system-ui,-apple-system,"Microsoft YaHei",sans-serif;color:#ededed;background:#090909;color-scheme:dark;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100svh;display:grid;place-items:center}main{width:min(850px,100%);padding:32px 24px;position:relative}.gallery{padding:12px;background:#111;border:1px solid #262626;border-radius:10px}.photo-stage{height:min(65svh,580px);min-height:220px;position:relative;overflow:hidden;border-radius:6px;background:#d8d8d8;display:flex;align-items:center;justify-content:center}#photo{height:100%;max-width:100%;object-fit:contain}.actions{display:flex;justify-content:center;gap:12px;margin-top:26px}:is(button,.otto-link){font-family:inherit;border:1px solid #333;border-radius:6px;min-width:162px;height:49px;background:#151515;display:flex;gap:11px;align-items:center;justify-content:center;font-size:13px;color:#d4d4d4;cursor:pointer;transition:transform .2s,background .2s,box-shadow .2s}:is(button,.otto-link) svg,#feedback svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;width:17px;height:17px}.primary{min-width:198px;background:#e8e8e8;border-color:#e8e8e8;color:#111}:is(button,.otto-link):hover{transform:translateY(-1px);background:#252525;border-color:#555}.primary:hover{background:#fff;border-color:#fff}:is(button,.otto-link):active{transform:translateY(0)}:is(button,.otto-link):focus-visible{outline:2px solid #bcbcbc;outline-offset:4px}button:disabled{opacity:.5;cursor:wait;transform:none}.loading{position:absolute;inset:0;background:#101010cc;display:grid;place-items:center}.spinner{width:30px;height:30px;border:2px solid #3a3a3a;border-top-color:#e8e8e8;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}#feedback{position:absolute;bottom:5px;left:calc(50% - 10px);color:#bcbcbc}#feedback svg{width:20px;height:20px}#feedback .error{display:none}#feedback[data-error="true"]{color:#e29393}#feedback[data-error="true"] .success{display:none}#feedback[data-error="true"] .error{display:block}@media(max-width:700px){main{padding:24px 18px 32px}.gallery{padding:10px}.photo-stage{height:60svh}.actions{gap:8px;margin-top:20px}.actions :is(button,.otto-link){min-width:0;flex:1;font-size:12px;gap:7px;height:47px}.actions .primary{flex:1.15}}@media(prefers-reduced-motion:reduce){:is(button,.otto-link){transition:none}.spinner{animation-duration:2s}}

body{isolation:isolate}main{z-index:1}#head-background{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;contain:strict}.falling-head{position:absolute;top:-600px;left:var(--x);width:var(--width);height:var(--height);opacity:var(--opacity);animation:head-fall var(--fall-duration) var(--fall-delay) linear infinite;will-change:transform}.falling-head img{display:block;width:100%;height:100%;object-fit:contain;animation:head-spin var(--spin-duration) var(--spin-delay) linear infinite;animation-direction:var(--spin-direction)}@keyframes head-fall{from{transform:translateY(0)}to{transform:translateY(calc(100dvh + 1200px))}}@keyframes head-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}#head-background.paused .falling-head,#head-background.paused img{animation-play-state:paused}@media(prefers-reduced-motion:reduce){.falling-head,.falling-head img{animation-play-state:paused}}

.otto-link{text-decoration:none}@media(max-width:700px){.actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.actions :is(button,.otto-link){width:100%;min-width:0}}
