:root{--bg:#121821;--surface:#1b2330;--ink:#f4f1ea;--muted:#a9b1bd;--line:#2e3949;--accent:#ffc83d;--on-accent:#121821;--warn:#ffb35a;color:var(--ink);background:var(--bg);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;-webkit-text-size-adjust:100%;font-family:Noto Sans TC,PingFang TC,Heiti TC,system-ui,sans-serif}*,:before,:after{box-sizing:border-box}body{background:var(--bg);margin:0}button,input,textarea{font:inherit;color:inherit}.app{max-width:1120px;padding:16px 16px calc(16px + env(safe-area-inset-bottom));grid-template-areas:"masthead""preview""editor""actions";gap:16px;margin:0 auto;display:grid}.masthead{grid-area:masthead}.masthead h1{color:var(--accent);margin:0;font-size:1.5rem;font-weight:900}.masthead p{color:var(--muted);margin:4px 0 0;font-size:.9rem;line-height:1.5}.preview{grid-area:preview}.preview-canvas{width:100%;box-shadow:0 0 0 1px var(--line), 0 2px 12px #0006;background:var(--line);border-radius:8px;display:block}.editor{grid-area:editor;gap:16px;display:grid}.segmented{border:1px solid var(--line);background:var(--surface);border-radius:10px;grid-template-columns:1fr 1fr;padding:3px;display:grid}.segmented button{cursor:pointer;background:0 0;border:0;border-radius:7px;padding:10px}.segmented button.active{background:var(--accent);color:var(--on-accent);font-weight:700}.field{gap:8px;display:grid}.field>span{color:var(--muted);font-size:.9rem}.field input,.field textarea{border:1px solid var(--line);background:var(--surface);resize:vertical;border-radius:10px;width:100%;padding:12px;font-size:18px}.field input:focus,.field textarea:focus{outline:2px solid var(--accent);outline-offset:1px}.chips{flex-wrap:wrap;gap:8px;display:flex}.chip{border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:999px;padding:8px 14px}.chip.active{border-color:var(--accent);color:var(--accent);font-weight:700}.segmented.three{grid-template-columns:repeat(3,1fr)}.templates{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.template{border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:10px;align-content:start;justify-items:center;gap:6px;padding:8px 4px;display:grid}.template canvas{border-radius:4px;width:72px;max-width:100%;height:auto;box-shadow:0 1px 4px #00000026}.template b{font-size:.8rem}.template.active{border-color:var(--accent);outline:2px solid var(--accent);color:var(--accent)}.palettes{grid-template-columns:repeat(7,1fr);gap:8px;display:grid}.palette{border:1px solid var(--line);cursor:pointer;border-radius:10px;justify-items:center;gap:2px;padding:10px 2px 6px;display:grid;position:relative}.palette i{border-radius:50%;width:18px;height:18px}.palette small{font-size:.7rem;font-weight:700}.palette.active{outline:3px solid var(--accent);outline-offset:1px}.custom-colors{flex-wrap:wrap;align-items:center;gap:12px;font-size:.9rem;display:flex}.custom-colors label{cursor:pointer;align-items:center;gap:6px;display:inline-flex}.custom-colors input[type=color]{border:1px solid var(--line);background:0 0;border-radius:8px;width:36px;height:36px;padding:0}.link{color:var(--accent);cursor:pointer;background:0 0;border:0;padding:4px;text-decoration:underline}.sizes{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.size{border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:10px;align-content:end;justify-items:center;gap:4px;padding:10px 4px;display:grid}.size i{opacity:.6;border:2px solid;border-radius:3px;height:32px;display:block}.size b{font-size:.75rem;line-height:1.3}.size small{color:var(--muted);font-size:.7rem}.size.active{border-color:var(--accent);color:var(--accent)}.size.active i{opacity:1}.actions{grid-area:actions;grid-template-columns:1fr auto;gap:8px;display:grid}.actions .warn{grid-column:1/-1}.primary,.secondary{cursor:pointer;border-radius:12px;justify-content:center;align-items:center;min-height:48px;padding:0 20px;font-weight:700;text-decoration:none;display:inline-flex}.primary{background:var(--accent);color:var(--on-accent);border:0}.primary:disabled{opacity:.5;cursor:progress}.secondary{border:1px solid var(--line);background:var(--surface);color:var(--ink)}.warn{color:var(--warn);margin:8px 0 0;font-size:.85rem}.mini-preview{top:calc(12px + env(safe-area-inset-top));z-index:5;cursor:pointer;background:0 0;border:0;border-radius:6px;padding:0;animation:.15s ease-out mini-in;position:fixed;right:12px;box-shadow:0 4px 16px #0000004d}.mini-preview canvas{border-radius:6px;height:auto;display:block}@keyframes mini-in{0%{opacity:0;transform:translateY(-8px)}}@media (prefers-reduced-motion:reduce){.mini-preview{animation:none}}.manual{z-index:10;color:#fff;padding:16px 16px calc(16px + env(safe-area-inset-bottom));text-align:center;background:#000000e0;flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:fixed;inset:0}.manual img{object-fit:contain;-webkit-touch-callout:default;max-width:100%;max-height:65vh}.manual p{margin:0}.manual .hint{color:#f0c36a;font-size:.9rem}.manual-actions{gap:8px;display:flex}@media (width>=900px){.app{grid-template:"masthead preview""editor preview""actions preview"1fr/minmax(320px,400px) 1fr;align-items:start;column-gap:32px;padding-top:32px}.preview{position:sticky;top:32px}.mini-preview{display:none}.preview-canvas{max-width:calc((100vh - 64px) * var(--ar));margin:0 auto}}.preset-group{gap:4px;display:grid}.preset-group small{color:var(--muted);font-size:.75rem}.chip.preset{text-align:left;font-size:.85rem;line-height:1.4}.actions .invite{grid-column:1/-1;display:grid}.manual-actions{flex-wrap:wrap;justify-content:center}.copy-fallback{left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:20;background:var(--surface);color:var(--ink);border-radius:12px;gap:8px;padding:16px;display:grid;position:fixed;box-shadow:0 8px 32px #00000059}.copy-fallback p{margin:0;font-size:.9rem}.copy-fallback textarea{border:1px solid var(--line);-webkit-user-select:text;user-select:text;border-radius:8px;width:100%;padding:10px;font-size:16px}.toast{left:50%;bottom:calc(24px + env(safe-area-inset-bottom));z-index:30;background:var(--ink);color:var(--bg);pointer-events:none;border-radius:999px;padding:10px 18px;font-size:.9rem;position:fixed;transform:translate(-50%)}.preview .hint{color:var(--muted);margin:8px 0 0;font-size:.85rem}.selection{border:1px solid var(--line);background:var(--surface);border-radius:12px;gap:10px;margin-top:10px;padding:12px;display:grid}.selection-head{justify-content:space-between;align-items:center;display:flex}.selection-actions,.photo-actions{flex-wrap:wrap;gap:8px;display:flex}.selection-actions>*,.photo-actions>*{flex:1}.secondary.danger{color:var(--warn)}.slider{grid-template-columns:3em 1fr;align-items:center;gap:8px;font-size:.9rem;display:grid}.field .slider input{accent-color:var(--accent);background:0 0;border:0;padding:0}.secondary.file{position:relative;overflow:hidden}.secondary.file input{opacity:0;cursor:pointer;font-size:0;position:absolute;inset:0}.emojis{grid-template-columns:repeat(8,1fr);gap:6px;display:grid}.emoji{aspect-ratio:1;border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:10px;padding:0;font-size:1.6rem;line-height:1}.emoji-custom{grid-template-columns:1fr auto;gap:8px;display:grid}.emoji-custom button{border-radius:10px;padding:0 16px}.stickers{grid-template-columns:repeat(5,1fr);gap:8px;display:grid}.sticker{border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:10px;justify-items:center;gap:4px;padding:8px 2px 6px;display:grid}.sticker img{width:44px;height:44px}.sticker i{background:var(--line);width:44px;height:44px;color:var(--muted);border-radius:8px;place-items:center;font-size:.65rem;font-style:normal;display:grid}.sticker small{font-size:.7rem}.sticker:disabled{opacity:.5;cursor:not-allowed;filter:grayscale()}