:root{--fg-hi: rgba(255, 255, 255, .9);--fg-mid: rgba(255, 255, 255, .6);--fg-lo: rgba(255, 255, 255, .35);--fg-faint: rgba(255, 255, 255, .22);--line: rgba(255, 255, 255, .14);--line-hover: rgba(255, 255, 255, .25);--font: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--sat: env(safe-area-inset-top, 0px);--sar: env(safe-area-inset-right, 0px);--sab: env(safe-area-inset-bottom, 0px);--sal: env(safe-area-inset-left, 0px);color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;background:#000;color:var(--fg-hi);font-family:var(--font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden;overscroll-behavior:none}body{height:100dvh}#c{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}noscript{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:24px;text-align:center;color:var(--fg-mid);font-size:14px}#ui{position:fixed;top:0;right:0;bottom:0;left:0;height:100dvh;pointer-events:none;z-index:10;font-family:var(--font);font-size:13px;line-height:1.4;color:var(--fg-hi);transition:opacity .35s ease}#ui.is-hidden>:not(.toast-stack){opacity:0;visibility:hidden;pointer-events:none!important;transition:opacity .3s ease,visibility 0s linear .3s}#ui button,#ui input,#ui a{pointer-events:auto;font-family:inherit;-webkit-tap-highlight-color:transparent}#ui button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;margin:0;padding:0;color:inherit;cursor:pointer;font-size:inherit}#ui button:focus-visible,#ui input:focus-visible,#ui a:focus-visible{outline:1px solid var(--line-hover);outline-offset:2px}#ui a{color:inherit;text-decoration:none}.intro{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 24px;opacity:1;transition:opacity 1.2s ease}.intro.is-gone{opacity:0;visibility:hidden;transition:opacity 1.2s ease,visibility 0s linear 1.2s}.intro-title{margin:0;font-size:clamp(22px,5vw,44px);font-weight:300;letter-spacing:.32em;text-indent:.32em;color:var(--fg-hi);text-shadow:0 0 1px rgba(0,0,0,.6)}.intro-sub{margin:14px 0 0;font-size:clamp(13px,1.6vw,15px);font-weight:400;color:var(--fg-mid);text-shadow:0 0 1px rgba(0,0,0,.6)}.brand{position:absolute;top:calc(16px + var(--sat));left:calc(20px + var(--sal));display:flex;flex-direction:column;gap:2px}.brand-name{font-size:11px;font-weight:500;letter-spacing:.22em;color:var(--fg-hi)}.brand-count{font-size:12px;font-variant-numeric:tabular-nums;color:var(--fg-lo)}.tools{position:absolute;top:calc(12px + var(--sat));right:calc(14px + var(--sar));display:flex;align-items:center;gap:2px}.icon-btn{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;color:var(--fg-mid);transition:color .15s ease,background-color .15s ease}.icon-btn svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;fill:none;display:block}.icon-btn:hover{color:var(--fg-hi);background:#ffffff0f}.icon-btn.is-on,.icon-btn[data-flash="1"]{color:var(--fg-hi)}.icon-btn .ico-alt,.icon-btn.is-on .ico-main{display:none}.icon-btn.is-on .ico-alt{display:block}.composer{position:absolute;left:50%;bottom:calc(26px + var(--sab));transform:translate(-50%);width:min(720px,calc(100% - 32px));display:flex;flex-direction:column;align-items:center;gap:14px}.text-wrap{position:relative;width:100%;display:flex;justify-content:center}.text-input{width:100%;max-width:640px;background:transparent;border:0;border-bottom:1px solid var(--line);padding:8px 4px 10px;text-align:center;font-size:clamp(22px,4.2vw,34px);font-weight:300;letter-spacing:.01em;color:var(--fg-hi);caret-color:var(--fg-hi);outline:none;border-radius:0;transition:border-color .2s ease}.text-input::placeholder{color:var(--fg-lo)}.text-input:hover{border-bottom-color:var(--line-hover)}.text-input:focus{border-bottom-color:var(--line-hover)}.text-input:focus-visible{outline:none}.pills{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;max-width:100%}.pill{font-size:12px;line-height:1;padding:6px 12px;border-radius:999px;border:1px solid var(--line);color:var(--fg-mid);white-space:nowrap;transition:border-color .15s ease,color .15s ease}.pill:hover,.pill.is-active{border-color:var(--line-hover);color:var(--fg-hi)}.pill-next{color:var(--fg-lo)}.hint{position:absolute;left:calc(20px + var(--sal));bottom:calc(14px + var(--sab));font-size:11px;color:var(--fg-faint);max-width:50%}.hint-touch{display:none}.credit{position:absolute;right:calc(20px + var(--sar));bottom:calc(14px + var(--sab));font-size:11px;color:var(--fg-faint);white-space:nowrap}.credit a{color:var(--fg-faint);border-bottom:1px solid transparent;transition:color .15s ease,border-color .15s ease}.credit a:hover{color:var(--fg-mid);border-bottom-color:var(--line-hover)}.toast-stack{position:absolute;left:50%;top:calc(64px + var(--sat));transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;width:max-content;max-width:calc(100% - 32px)}.toast{display:inline-flex;align-items:center;gap:10px;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:#0000008c;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--fg-mid);font-size:12px;opacity:0;transform:translateY(-6px);transition:opacity .25s ease,transform .25s ease}.toast.is-in{opacity:1;transform:translateY(0)}.toast-close{width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;color:var(--fg-lo)}.toast-close:hover{color:var(--fg-hi)}.toast-close svg{width:12px;height:12px;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;fill:none}@media(hover:none)and (pointer:coarse){.hint-desktop{display:none}.hint-touch{display:inline}.icon-btn:hover{background:transparent}}@media(max-width:560px){#ui{font-size:12px}.brand{top:calc(14px + var(--sat));left:calc(16px + var(--sal))}.brand-name{font-size:10px}.brand-count{font-size:11px}.tools{top:calc(8px + var(--sat));right:calc(8px + var(--sar));gap:0}.icon-btn{width:34px;height:34px}.icon-btn svg{width:17px;height:17px}.composer{bottom:calc(44px + var(--sab));width:calc(100% - 24px);gap:12px}.text-input{font-size:22px;padding:6px 4px 8px}.pill{padding:6px 11px}.hint{left:calc(16px + var(--sal));bottom:calc(12px + var(--sab));max-width:58%;font-size:10px}.credit{right:calc(16px + var(--sar));bottom:calc(12px + var(--sab));font-size:10px}.toast-stack{top:calc(56px + var(--sat))}}@media(max-height:460px){.intro-title{font-size:22px}.composer{bottom:calc(10px + var(--sab));gap:8px}.hint,.credit{display:none}}@media(prefers-reduced-motion:reduce){#ui,.intro,.toast,.pill,.icon-btn,.text-input{transition:none}}
