@font-face{font-family:dotPhoto;src:url(../media/Doto_Round_700-s.p.1uz64s0u9s2p7.woff2)format("woff2");font-display:swap;font-weight:700}@font-face{font-family:dotPhoto;src:url(../media/Doto_Round_900-s.p.2t3wgb_zpi2_b.woff2)format("woff2");font-display:swap;font-weight:900}@font-face{font-family:dotPhoto Fallback;src:local(Arial);ascent-override:72.25%;descent-override:19.01%;line-gap-override:0.0%;size-adjust:131.49%}.NeL0TW_className{font-family:dotPhoto,dotPhoto Fallback}.NeL0TW_variable{--font-dot-photo:"dotPhoto", "dotPhoto Fallback"}
@font-face{font-family:Space Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../media/77b28ce38026b284-s.341_rbs6dql3t.woff2)format("woff2");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Space Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../media/c442f25284480cdf-s.40d3ll7mho212.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Space Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../media/ab56636924653a94-s.p.3-4lwpipb4a4k.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Space Mono;font-style:normal;font-weight:700;font-display:swap;src:url(../media/3382ae7d1c882f43-s.37aqrzupgb8zi.woff2)format("woff2");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Space Mono;font-style:normal;font-weight:700;font-display:swap;src:url(../media/3084de8c06b4aa35-s.0e_5-ojqbtsw9.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Space Mono;font-style:normal;font-weight:700;font-display:swap;src:url(../media/34c58fc38e31639a-s.p.2p-978ij53_v6.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Space Mono Fallback;src:local(Arial);ascent-override:81.58%;descent-override:26.3%;line-gap-override:0.0%;size-adjust:137.28%}.y1lW6q_className{font-family:Space Mono,Space Mono Fallback;font-style:normal}.y1lW6q_variable{--font-mono:"Space Mono", "Space Mono Fallback"}
:root{--bg:#ececea;--bg-dot:#0000001f;--ink:#0d0d0e;--ink-2:#4a4a4f;--ink-3:#85858b;--red:#d71921;--blue:#2f6bff;--orange:#e8873a;--glass-fill:#ffffff85;--glass-edge:#ffffffd9;--glass-rim:#0000001a;--glass-shadow:0 1px 1px #0000000a, 0 10px 30px -8px #0000002e;--key-top:#fbfbfa;--key-bottom:#e2e2df;--key-ink:#1a1a1c;--key-edge:#00000029;--well:#d6d6d2;--dev-top:#f6f6f3;--dev-bottom:#dddcd7;--groove:#00000017;--groove-hi:#fffc;--lcd-top:#dfe3d6;--lcd-bottom:#cfd4c5;--lcd-ink:#1d2219;--lcd-dim:#1d221966;--radius:28px;--gutter:clamp(16px, 3vw, 32px);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:root[data-theme=dark]{--bg:#0b0b0c;--bg-dot:#ffffff1a;--ink:#f4f4f2;--ink-2:#b4b4b8;--ink-3:#78787e;--red:#ff2a33;--blue:#6f9bff;--orange:#ffa25c;--glass-fill:#1c1c2080;--glass-edge:#ffffff29;--glass-rim:#0009;--glass-shadow:0 1px 1px #0000004d, 0 16px 40px -10px #000000b3;--key-top:#2c2c31;--key-bottom:#1a1a1d;--key-ink:#f4f4f2;--key-edge:#000000b3;--well:#111113;--dev-top:#2a2a2e;--dev-bottom:#151517;--groove:#0000008c;--groove-hi:#ffffff0d;--lcd-top:#141517;--lcd-bottom:#0c0c0e;--lcd-ink:#eef0ea;--lcd-dim:#eef0ea52;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*,:before,:after{box-sizing:border-box}body{background:var(--bg);min-height:100vh;color:var(--ink);font-family:var(--font-sans), "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", system-ui, sans-serif;-webkit-font-smoothing:antialiased;margin:0;font-size:15px;line-height:1.5;overflow-x:hidden}h2,p{text-wrap:pretty;margin:0}button,input{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}:focus-visible{outline:2px solid var(--red);outline-offset:3px}.dot{font-family:var(--font-dot), monospace;font-variation-settings:"ROND" 100;letter-spacing:.02em;font-weight:800}.mono{font-family:var(--font-mono), ui-monospace, "PingFang SC", monospace;letter-spacing:.08em;text-transform:uppercase;font-size:11px}.hint{color:var(--ink-3);font-size:12px}.backdrop{z-index:-1;background-image:radial-gradient(var(--bg-dot) 1.2px, transparent 1.4px);background-size:18px 18px;position:fixed;inset:0;overflow:hidden}.blob{filter:blur(60px);border-radius:50%;position:absolute}.blob-a{background:radial-gradient(circle, var(--red), transparent 65%);opacity:.26;width:40vmax;height:40vmax;top:-14vmax;right:-10vmax}.blob-b{background:radial-gradient(circle, var(--blue), transparent 65%);opacity:.2;width:34vmax;height:34vmax;bottom:-14vmax;left:-12vmax}.blob-c{background:radial-gradient(circle, var(--orange), transparent 65%);opacity:.14;width:24vmax;height:24vmax;top:40%;left:45%}.glass{background:var(--glass-fill);-webkit-backdrop-filter:blur(28px)saturate(170%);backdrop-filter:blur(28px)saturate(170%);box-shadow:inset 0 1px 0 var(--glass-edge), inset 0 0 0 1px var(--glass-edge), 0 0 0 1px var(--glass-rim), var(--glass-shadow)}@media (prefers-reduced-transparency:reduce){.glass{background:var(--bg);-webkit-backdrop-filter:none;backdrop-filter:none}.blob{display:none}}.topbar{z-index:10;width:min(1240px, calc(100% - 2 * var(--gutter)));background:color-mix(in srgb, var(--bg) 70%, transparent);border-radius:999px;justify-content:space-between;align-items:center;gap:12px;margin:12px auto 0;padding:8px 10px 8px 20px;display:flex;position:sticky;top:12px}.brand{align-items:center;gap:10px;min-width:0;display:flex}.brand-name{font-size:22px;line-height:1}.brand-sub{color:var(--ink-2);white-space:nowrap;font-size:12px}.led{background:color-mix(in srgb, var(--ink-3) 45%, transparent);border-radius:50%;flex:none;width:7px;height:7px;transition:background .2s,box-shadow .2s;display:inline-block;box-shadow:inset 0 1px 1px #0000004d}.led.on,.lamp.on .led{background:var(--red);box-shadow:0 0 8px var(--red), inset 0 -1px 1px #0003}.key{min-height:44px;color:var(--key-ink);background:linear-gradient(180deg, var(--key-top), var(--key-bottom));box-shadow:inset 0 1px 0 #fff9, 0 0 0 1px var(--key-edge), 0 2px 0 var(--key-edge), 0 6px 14px -6px #00000059;white-space:nowrap;border:0;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:0 22px;font-size:14px;font-weight:500;transition:transform .12s,box-shadow .12s;display:inline-flex}:root[data-theme=dark] .key{box-shadow:inset 0 1px 0 #ffffff1a, 0 0 0 1px var(--key-edge), 0 2px 0 var(--key-edge), 0 6px 14px -6px #0009}.key:active{box-shadow:inset 0 2px 4px #0000002e, 0 0 0 1px var(--key-edge);transform:translateY(2px)}.key-primary{--key-top:#2a2a2e;--key-bottom:#0e0e10;--key-ink:#f4f4f2}:root[data-theme=dark] .key-primary,.screen .key-primary{--key-top:#ff3d45;--key-bottom:#c4141b;--key-ink:#fff}.key-small{min-height:34px;padding:0 16px;font-size:13px}.keys{flex-wrap:wrap;gap:8px;display:flex}.keycap{min-height:38px;color:var(--key-ink);white-space:nowrap;background:linear-gradient(180deg, var(--key-top), var(--key-bottom));box-shadow:inset 0 1px 0 #ffffff8c, 0 0 0 1px var(--key-edge), 0 3px 0 var(--key-edge), 0 6px 10px -6px #0006;border:0;border-radius:10px;align-items:center;gap:6px;padding:0 12px 0 10px;font-size:13px;transition:transform .1s,box-shadow .1s;display:inline-flex;position:relative}:root[data-theme=dark] .keycap{box-shadow:inset 0 1px 0 #ffffff14, 0 0 0 1px var(--key-edge), 0 3px 0 var(--key-edge), 0 6px 10px -6px #000000b3}.keycap[aria-pressed=true]{box-shadow:inset 0 2px 4px #0003, 0 0 0 1px var(--key-edge), 0 1px 0 var(--key-edge);transform:translateY(2px)}.keycap[aria-pressed=true] .led{background:var(--red);box-shadow:0 0 8px var(--red)}.swatch{border-radius:3px;width:12px;height:12px;box-shadow:inset 0 0 0 1px #00000040}.sw-auto{background:linear-gradient(135deg,#111 50%,#f6f6f4 50%)}.sw-color{background:conic-gradient(#d71921,#e8873a,#f2c94c,#2f9e6b,#2f6bff,#8b5cf6,#d71921)}.switch{background:0 0;border:0;flex:none;padding:0}.switch-track{background:var(--well);width:56px;height:30px;box-shadow:inset 0 2px 5px #00000047, inset 0 0 0 1px #00000014, 0 1px 0 var(--groove-hi);border-radius:999px;transition:background .25s;display:block;position:relative}[aria-checked=true]>.switch-track{background:var(--red)}.switch-knob{background:radial-gradient(circle at 35% 30%,#fff,#d9d9d6 70%);border-radius:50%;width:24px;height:24px;transition:transform .28s cubic-bezier(.3,1.4,.5,1);position:absolute;top:3px;left:3px;box-shadow:0 2px 4px #00000059,inset 0 -1px 1px #0000001a}[aria-checked=true] .switch-knob{transform:translate(26px)}.theme-switch .switch-track{width:60px}.track-icon{width:12px;height:12px;color:var(--ink-3);position:absolute;top:50%;transform:translateY(-50%)}.track-sun{color:#ffffffd9;left:9px}.track-moon{right:9px}:root[data-theme=dark] .theme-switch .switch-track{background:var(--red)}:root[data-theme=dark] .theme-switch .switch-knob{transform:translate(30px)}.knob-icon{width:14px;height:14px;position:absolute;inset:5px}.knob-sun{color:#e8a13a}.knob-moon{color:#5b6475;display:none}:root[data-theme=dark] .knob-sun{display:none}:root[data-theme=dark] .knob-moon{display:block}.slide{grid-template-columns:repeat(var(--n), minmax(0, 1fr));background:var(--well);box-shadow:inset 0 3px 7px #00000042, inset 0 0 0 1px #00000014, 0 1px 0 var(--groove-hi);border-radius:16px;padding:5px;display:grid;position:relative}.slide-knob{width:calc((100% - 10px) / var(--n));transform:translateX(calc(100% * var(--i)));background:linear-gradient(180deg, var(--key-top), var(--key-bottom));box-shadow:inset 0 1px 0 #fff9, 0 0 0 1px var(--key-edge), 0 3px 6px #0000004d;border-radius:12px;transition:transform .34s cubic-bezier(.3,1.35,.5,1);position:absolute;top:5px;bottom:5px;left:5px}.slide-knob:after{content:"";background:var(--red);width:22px;height:3px;box-shadow:0 0 6px color-mix(in srgb, var(--red) 70%, transparent);border-radius:2px;position:absolute;bottom:7px;left:50%;transform:translate(-50%)}:root[data-theme=dark] .slide-knob{box-shadow:inset 0 1px 0 #ffffff1a, 0 0 0 1px var(--key-edge), 0 3px 6px #0009}.slide button{z-index:1;min-height:54px;color:var(--ink-3);white-space:nowrap;background:0 0;border:0;padding:0 6px 6px;font-size:15px;font-weight:500;transition:color .2s;position:relative}.slide button[aria-checked=true]{color:var(--ink)}.slide-small button{min-height:40px;padding-bottom:4px;font-size:13px}.slide-small .slide-knob:after{width:16px;height:2px;bottom:5px}.fader{background:repeating-linear-gradient(90deg, var(--ink-3) 0 1px, transparent 1px 10%) center bottom / 100% 6px no-repeat;flex:1;align-items:center;min-width:120px;height:40px;padding:0 4px;display:flex}.fader input{appearance:none;background:0 0;width:100%;margin:0}.fader input::-webkit-slider-runnable-track{background:var(--well);height:8px;box-shadow:inset 0 2px 4px #00000059, 0 1px 0 var(--groove-hi);border-radius:4px}.fader input::-moz-range-track{background:var(--well);border-radius:4px;height:8px;box-shadow:inset 0 2px 4px #00000059}.fader input::-webkit-slider-thumb{appearance:none;background:linear-gradient(90deg, transparent 45%, var(--red) 45% 55%, transparent 55%), linear-gradient(180deg, var(--key-top), var(--key-bottom));width:20px;height:32px;box-shadow:inset 0 1px 0 #fff9, 0 0 0 1px var(--key-edge), 0 3px 5px #00000059;border-radius:5px;margin-top:-12px}.fader input::-moz-range-thumb{background:linear-gradient(90deg, transparent 45%, var(--red) 45% 55%, transparent 55%), linear-gradient(180deg, var(--key-top), var(--key-bottom));width:20px;height:32px;box-shadow:inset 0 1px 0 #fff9, 0 0 0 1px var(--key-edge), 0 3px 5px #00000059;border:0;border-radius:5px}.readout{justify-content:flex-end;align-items:baseline;gap:2px;min-width:52px;display:inline-flex}.readout b{font-size:22px}.device{border-radius:var(--radius);background:linear-gradient(160deg, var(--dev-top), var(--dev-bottom));box-shadow:inset 0 1px 0 #fffc, inset 0 -2px 0 #0000000f, 0 0 0 1px var(--key-edge), 0 24px 44px -20px #00000073;padding:22px;position:relative}:root[data-theme=dark] .device{box-shadow:inset 0 1px 0 #ffffff14, inset 0 -2px 0 #0006, 0 0 0 1px var(--key-edge), 0 24px 44px -20px #000c}.screw{background:radial-gradient(circle at 35% 30%,#fafafa,#9b9b97 75%);border-radius:50%;width:10px;height:10px;position:absolute;box-shadow:inset 0 -1px 1px #0000004d,0 1px #ffffff80}:root[data-theme=dark] .screw{background:radial-gradient(circle at 35% 30%,#6a6a6e,#2a2a2d 75%);box-shadow:inset 0 -1px 1px #00000080,0 1px #ffffff0f}.screw:after{content:"";transform:rotate(var(--turn,35deg));background:#00000073;border-radius:1px;position:absolute;inset:4.25px 1.5px}.screw.tl{top:10px;left:10px}.screw.tr{--turn:-20deg;top:10px;right:10px}.screw.bl{--turn:70deg;bottom:10px;left:10px}.screw.br{--turn:10deg;bottom:10px;right:10px}.device-head{color:var(--ink-2);justify-content:space-between;align-items:center;gap:12px;margin:0 8px 14px;display:flex}.device-head>span:first-child{align-items:center;gap:8px;display:inline-flex}.lamps{gap:14px;display:inline-flex}.lamp{color:var(--ink-3);align-items:center;gap:6px;display:inline-flex}.lamp.on{color:var(--ink)}.studio{width:min(1240px, calc(100% - 2 * var(--gutter)));grid-template-columns:minmax(0,1fr) 400px;align-items:start;gap:20px;margin:20px auto 48px;display:grid}.viewer-col{--chrome:72px;--maxh:min(70vh, 760px);justify-content:center;display:flex;position:sticky;top:84px;container-type:inline-size}.viewer{width:100%}.viewer.has-photo{width:fit-content;max-width:100%}.viewer.has-photo .device-head,.viewer.has-photo .viewer-foot{width:0;min-width:calc(100% - 12px)}@media (max-width:900px){.studio{grid-template-columns:minmax(0,1fr)}.viewer-col{position:relative;top:0}}.screen{background:radial-gradient(120% 90% at 50% 0,#17181a,#070708);border-radius:16px;place-items:center;min-height:min(68vh,640px);padding:18px;transition:box-shadow .2s;display:grid;position:relative;overflow:hidden;box-shadow:inset 0 2px 10px #000c,inset 0 0 0 1px #0009,0 1px #ffffff80}:root[data-theme=dark] .screen{box-shadow:inset 0 2px 10px #000c,inset 0 0 0 1px #0009,0 1px #ffffff0f}.screen.is-drag{box-shadow:inset 0 0 0 2px var(--red), inset 0 0 40px color-mix(in srgb, var(--red) 40%, transparent)}.scanlines{pointer-events:none;background:linear-gradient(155deg,#ffffff12,#0000 35%),repeating-linear-gradient(0deg,#ffffff05 0 1px,#0000 1px 3px);position:absolute;inset:0}.viewer.has-photo .screen{min-height:0;padding:14px}.preview{width:min(calc(100cqw - var(--chrome)), calc(var(--maxh) * var(--ar,1.5)));height:auto;display:block;box-shadow:0 10px 30px #0009}.empty{text-align:center;justify-items:center;gap:18px;display:grid}.empty-title{color:#fff3;font-size:clamp(44px,8vw,80px);line-height:1}.empty-hint{color:#ffffff73;font-size:13px}.viewer-foot{justify-content:space-between;align-items:center;gap:12px;margin:14px 6px 0;display:flex}.file-name{overflow-wrap:anywhere;min-width:0;color:var(--ink-2);text-transform:none}.deck{gap:0;padding:26px 22px;display:grid}.module{gap:14px;padding:20px 4px;display:grid}.module+.module{border-top:1px solid var(--groove);box-shadow:inset 0 1px 0 var(--groove-hi)}.module:first-of-type{padding-top:6px}.module-head{align-items:center;gap:10px;display:flex}.module-head h2{font-size:17px;font-weight:600}.module-en{color:var(--ink-3);margin-left:auto}.plate{color:#fff;box-shadow:inset 0 1px 0 #fff3, 0 1px 0 var(--groove-hi);background:linear-gradient(#3a3a3f,#18181b);border-radius:5px;padding:2px 7px;font-weight:700}.row{flex-wrap:wrap;align-items:center;gap:10px 12px;display:flex}.row-label{min-width:56px;color:var(--ink-2);white-space:nowrap;font-size:13px}.logo-controls{background:color-mix(in srgb, var(--well) 45%, transparent);box-shadow:inset 0 1px 3px #0000001f, 0 1px 0 var(--groove-hi);border-radius:16px;gap:14px;padding:14px;display:grid}.slots{grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:10px;display:grid}.slot{text-align:center;background:linear-gradient(180deg, var(--key-top), var(--key-bottom));box-shadow:inset 0 1px 0 #ffffff8c, 0 0 0 1px var(--key-edge), 0 3px 0 var(--key-edge), 0 8px 14px -8px #00000073;border:0;border-radius:12px;grid-template-columns:minmax(0,1fr);align-content:start;gap:6px;padding:7px 7px 8px;transition:transform .12s,box-shadow .12s;display:grid;position:relative}:root[data-theme=dark] .slot{box-shadow:inset 0 1px 0 #ffffff14, 0 0 0 1px var(--key-edge), 0 3px 0 var(--key-edge), 0 8px 14px -8px #000000b3}.slot.on{box-shadow:0 0 0 2px var(--red), 0 1px 0 var(--key-edge), 0 0 16px -4px var(--red);transform:translateY(2px)}.slot.on:after{content:"";background:var(--red);width:6px;height:6px;box-shadow:0 0 6px var(--red);border-radius:50%;position:absolute;top:6px;right:6px}.slot-hit{border-radius:inherit;background:0 0;border:0;position:absolute;inset:0}.slot-well{aspect-ratio:4/3;background:linear-gradient(180deg, var(--lcd-top), var(--lcd-bottom));box-shadow:inset 0 2px 4px #00000047, 0 1px 0 var(--groove-hi);pointer-events:none;border-radius:7px;place-items:center;padding:8px;display:grid}.slot-logo{background:var(--lcd-ink);width:100%;height:100%;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.slot-plus{color:var(--lcd-dim);font-size:22px}.slot-name{color:var(--ink-2);white-space:nowrap;pointer-events:none;font-size:11.5px;line-height:1.25}.slot-add .slot-well{background:repeating-linear-gradient(135deg, transparent 0 6px, var(--groove) 6px 7px), linear-gradient(180deg, var(--lcd-top), var(--lcd-bottom))}.slot-del{z-index:2;color:#fff;opacity:0;background:radial-gradient(circle at 35% 30%,#55555b,#1b1b1e);border:0;border-radius:50%;place-items:center;width:22px;height:22px;padding:0;font-size:14px;line-height:1;transition:opacity .15s;display:grid;position:absolute;top:-7px;left:-7px;box-shadow:0 2px 4px #0006}.slot:hover .slot-del,.slot:focus-within .slot-del{opacity:1}@media (hover:none){.slot-del{opacity:1}}.field{gap:6px;display:grid}.field-label{color:var(--ink-2);font-size:12px}.lcd{width:100%;min-height:44px;color:var(--lcd-ink);background:linear-gradient(180deg, var(--lcd-top), var(--lcd-bottom));box-shadow:inset 0 2px 5px #0000004d, inset 0 0 0 1px #0000001a, 0 1px 0 var(--groove-hi);border:0;border-radius:10px;padding:0 14px;font-size:16px}.lcd::placeholder{color:var(--lcd-dim)}.lcd:focus{box-shadow:inset 0 2px 5px #0000004d, inset 0 0 0 1.5px var(--red), 0 0 0 3px color-mix(in srgb, var(--red) 18%, transparent);outline:none}.cells{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.cell{gap:4px;display:grid}.cell .field-label{white-space:nowrap;font-size:11px}.cell-wide{grid-column:span 2}.lcd-small{min-height:38px;font-family:var(--font-mono), monospace;letter-spacing:0;padding:0 8px;font-size:16px}.shutter-row{align-items:center;gap:18px;display:flex}.shutter{background:repeating-conic-gradient(from 0deg, #c9c9c4 0 4deg, #a9a9a4 4deg 8deg);width:84px;height:84px;box-shadow:inset 0 1px 1px #ffffffb3, 0 0 0 1px var(--key-edge), 0 8px 16px -6px #00000080;border:0;border-radius:50%;flex:none;padding:0;position:relative}:root[data-theme=dark] .shutter{background:repeating-conic-gradient(from 0deg, #3a3a3e 0 4deg, #2a2a2d 4deg 8deg)}.shutter-cap{background:radial-gradient(circle at 35% 30%,#ff5a60,#c4141b 70%);border-radius:50%;transition:transform .1s,box-shadow .1s;position:absolute;inset:11px;box-shadow:inset 0 2px 2px #fff6,inset 0 -3px 5px #0000004d,0 4px #8c0c12,0 6px 10px #0006}.shutter:active:not(:disabled) .shutter-cap,.shutter.is-busy .shutter-cap{transform:translateY(3px);box-shadow:inset 0 2px 2px #ffffff4d,inset 0 -2px 4px #00000059,0 1px #8c0c12}.shutter:disabled .shutter-cap{filter:grayscale()brightness(.9);opacity:.6}.out{gap:4px;min-width:0;display:grid}.out-label{color:var(--ink-2)}.out-size{align-items:baseline;gap:6px;display:flex}.out-size b{font-size:26px;line-height:1.1}.toast{z-index:20;opacity:0;pointer-events:none;border-radius:999px;max-width:calc(100% - 32px);padding:12px 20px;font-size:14px;transition:transform .3s cubic-bezier(.3,1.3,.5,1),opacity .2s;position:fixed;bottom:24px;left:50%;transform:translate(-50%,140%)}.toast.show{opacity:1;transform:translate(-50%)}@media (max-width:520px){.brand-sub{display:none}.deck{padding:22px 16px}.device{padding:18px 14px}.cells{grid-template-columns:repeat(2,minmax(0,1fr))}.screen{min-height:300px;padding:12px}.viewer-col{--chrome:52px;--maxh:62vh}.viewer.has-photo .screen{padding:10px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.face-clean{font-family:var(--font-clean), var(--font-cjk-sans), "PingFang SC", sans-serif}.face-classic{font-family:var(--font-classic), serif;letter-spacing:.18em;font-style:italic;font-weight:700}.face-grotesk{font-family:var(--font-sans), var(--font-cjk-sans), "PingFang SC", sans-serif}.topbar-keys{align-items:center;gap:10px;display:flex}.lang-key{border-radius:999px;justify-content:center;min-width:44px;min-height:34px;padding:0 10px;font-weight:600;text-decoration:none}.field-label{align-items:center;gap:8px;display:flex}.sample-tag{color:var(--red);align-items:center;gap:5px;font-size:10px;display:inline-flex}.sample-tag .led{width:6px;height:6px;animation:1.6s ease-in-out infinite blink}@keyframes blink{50%{opacity:.3}}.field-row{gap:8px;display:flex}.lcd-wrap{flex:1;min-width:0;position:relative}.lcd-wrap .lcd{padding-right:40px}.lcd-clear{width:26px;height:26px;color:var(--lcd-ink);background:color-mix(in srgb, var(--lcd-ink) 10%, transparent);opacity:.55;border:0;border-radius:50%;place-items:center;padding:0;font-size:15px;line-height:1;transition:opacity .15s;display:grid;position:absolute;top:50%;right:8px;transform:translateY(-50%)}.lcd-clear:hover{opacity:1}.locate,.copyright{flex:none;min-height:44px}.copyright{font-size:17px}.field-note{color:var(--ink-3);font-size:12px}:lang(zh) .face-classic{font-family:var(--font-cjk-serif), serif;letter-spacing:.24em;font-style:normal;font-weight:600}.empty-keys,.foot-keys{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.key-icon{flex:none;width:18px;height:18px}.live{width:100%;max-height:var(--maxh,70vh);object-fit:contain;background:#000;border-radius:6px;display:block;transform:scaleX(-1)}.slot-bar{width:100%;min-height:44px;color:var(--key-ink);background:linear-gradient(180deg, var(--key-top), var(--key-bottom));box-shadow:inset 0 1px 0 #ffffff8c, 0 0 0 1px var(--key-edge), 0 3px 0 var(--key-edge), 0 8px 14px -8px #00000073;border:0;border-radius:12px;justify-content:center;align-items:center;gap:8px;font-size:14px;transition:transform .12s,box-shadow .12s;display:flex}:root[data-theme=dark] .slot-bar{box-shadow:inset 0 1px 0 #ffffff14, 0 0 0 1px var(--key-edge), 0 3px 0 var(--key-edge), 0 8px 14px -8px #000000b3}.slot-bar.on{box-shadow:0 0 0 2px var(--red), 0 1px 0 var(--key-edge), 0 0 16px -4px var(--red);transform:translateY(2px)}.slot-bar.on .led{background:var(--red);box-shadow:0 0 8px var(--red)}.screen.can-swipe{touch-action:pan-y;-webkit-user-select:none;user-select:none}.preview{animation:.28s ease-out develop}@keyframes develop{0%{opacity:.4;filter:blur(2px)}}.flip{z-index:2;color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1414168c;border:0;border-radius:50%;place-items:center;width:36px;height:36px;padding:0 0 3px;font-size:24px;line-height:1;transition:opacity .2s;display:grid;position:absolute;top:50%;transform:translateY(-50%);box-shadow:inset 0 1px #fff3,0 2px 8px #0006}.flip:disabled{opacity:0;pointer-events:none}.flip-prev{left:6px}.flip-next{right:6px}.counter{color:var(--ink);align-items:baseline;gap:3px;display:inline-flex}.counter b{font-size:15px}.film{scroll-snap-type:x proximity;background:radial-gradient(circle,#ffffffd9 1.6px,#0000 2px) 0 3px/12px 7px repeat-x,radial-gradient(circle,#ffffffd9 1.6px,#0000 2px) 0 calc(100% - 3px)/12px 7px repeat-x,#1a1612;border-radius:8px;gap:8px;width:0;min-width:calc(100% - 12px);margin:14px 6px 0;padding:12px 10px;display:flex;overflow-x:auto;box-shadow:inset 0 0 0 1px #00000080}.viewer:not(.has-photo) .film{width:auto}.film-frame{scroll-snap-align:center;opacity:.55;background:#000;border:0;border-radius:3px;flex:none;width:58px;height:44px;padding:0;transition:opacity .15s,box-shadow .15s;position:relative;overflow:hidden}.film-frame img{object-fit:cover;width:100%;height:100%;display:block}.film-frame.on{opacity:1;box-shadow:0 0 0 2px var(--red)}.film-frame .led{width:6px;height:6px;position:absolute;top:3px;right:3px}.scope{background:color-mix(in srgb, var(--well) 45%, transparent);box-shadow:inset 0 1px 3px #0000001f, 0 1px 0 var(--groove-hi);border-radius:16px;gap:8px;margin:0 4px 6px;padding:12px 14px;display:grid}.scope.is-one{box-shadow:inset 0 0 0 1.5px var(--red), 0 1px 0 var(--groove-hi)}.solo{color:var(--ink-2);flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:12.5px;display:flex}.link-key{color:var(--red);text-underline-offset:3px;background:0 0;border:0;justify-self:start;padding:0;font-size:12.5px;text-decoration:underline}.link-key:disabled{opacity:.4}.save-all{width:100%;margin-top:14px}.face-dot{font-family:var(--font-dot-photo), var(--font-cjk-sans), monospace;letter-spacing:.06em;font-weight:900}.slot-del.armed{opacity:1;background:var(--red);width:auto;box-shadow:0 0 10px color-mix(in srgb, var(--red) 60%, transparent), 0 2px 4px #0006;border-radius:999px;padding:0 9px;font-size:12px}