*,*:before,*:after{box-sizing:border-box}:root{--bg: #ffffff;--bg-alt: #f5f7fb;--surface: #ffffff;--primary: #2563eb;--primary-dark: #1d4ed8;--primary-hover: #1d4ed8;--accent: #0ea5e9;--text: #0f172a;--muted: #5b6577;--text-muted: #5b6577;--border: #e5e8f0;--border-light: #eef1f7;--danger: #dc2626;--danger-hover: #b91c1c;--success: #16a34a;--radius: 14px;--radius-sm: 10px;--shadow: 0 10px 30px -12px rgba(15,23,42,.18);--shadow-sm: 0 2px 8px rgba(15,23,42,.06);font-synthesis:none}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg-alt);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}html,body{overflow-x:hidden}header.site{position:sticky;top:0;z-index:50;background:#ffffffd1;backdrop-filter:saturate(160%) blur(12px);border-bottom:1px solid var(--border)}header.site .nav{display:flex;align-items:center;gap:16px;height:64px;max-width:1400px;margin:0 auto;padding:0 24px}.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:-.02em;font-size:1.06rem;color:var(--text)}.brand .logo{width:30px;height:30px;border-radius:9px;background:var(--primary);display:grid;place-items:center;flex:0 0 auto}.nav-right{margin-left:auto;display:flex;align-items:center;gap:12px}.lang{display:flex;gap:2px;background:var(--bg-alt);border:1px solid var(--border);border-radius:10px;padding:3px}.lang a{display:inline-flex;align-items:center;line-height:normal;padding:5px 9px;border-radius:7px;cursor:pointer;font-size:.85rem;font-weight:650;color:var(--muted);font-family:inherit;text-decoration:none}.lang a.active{background:#fff;color:var(--text);box-shadow:var(--shadow-sm)}.builder-intro{max-width:1400px;margin:0 auto;padding:28px 24px 4px}.builder-intro h1{margin:0;font-size:clamp(1.5rem,3vw,2rem);font-weight:820;letter-spacing:-.02em;line-height:1.15}.builder-intro p{margin:8px 0 0;color:var(--muted);font-size:1.02rem}main{display:flex;gap:24px;max-width:1400px;margin:0 auto;padding:24px}.form-column{flex:1;min-width:0}.output-column{width:420px;flex-shrink:0}fieldset{border:1px solid var(--border);border-radius:var(--radius);padding:18px;margin:0 0 16px;background:var(--surface);box-shadow:var(--shadow-sm)}legend{font-weight:600;font-size:1rem;padding:0 8px}label{display:block;font-size:.85rem;font-weight:500;margin-bottom:4px;color:var(--text)}input[type=text],input[type=url],textarea,select{width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:6px;font-size:.9rem;font-family:inherit;background:var(--surface);color:var(--text);transition:border-color .15s}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #2563eb1a}.draft-banner{display:none;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;padding:10px 12px;background:var(--bg-alt);border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm)}.draft-banner.is-visible{display:flex}.draft-banner-msg{display:flex;align-items:center;gap:8px;font-size:.9rem;color:var(--text)}.draft-banner-icon{color:var(--primary);font-size:1.05rem;line-height:1}.draft-banner-time{color:var(--muted)}.draft-banner-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}.draft-banner-dismiss{border:none;background:transparent;color:var(--muted);font-size:1.25rem;line-height:1;cursor:pointer;padding:4px 6px;border-radius:var(--radius-sm);min-width:32px;min-height:32px}.draft-banner-dismiss:hover{color:var(--text)}.draft-banner .btn:focus-visible,.draft-banner-dismiss:focus-visible{outline:none;box-shadow:0 0 0 3px #2563eb59}.field{margin-bottom:12px;position:relative}.char-count{position:absolute;right:4px;bottom:-18px;font-size:.75rem;color:var(--text-muted)}.field.has-counter{margin-bottom:28px}details{margin:0}details>summary{cursor:pointer;user-select:none;font-weight:500;padding:4px 0}.set-all-row{display:flex;align-items:center;gap:8px;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--border-light)}.set-all-row label{margin:0;white-space:nowrap}.set-all-row select{width:140px}.perm-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px}.perm-item{display:flex;align-items:center;gap:8px}.perm-item label{flex:1;margin:0;font-size:.83rem;font-weight:400}.perm-item select{width:110px;flex-shrink:0}select option[value=""]{color:var(--text-muted)}.card{border:1px solid var(--border-light);border-radius:var(--radius);padding:12px;margin-bottom:10px;background:var(--bg);position:relative}.card-header{display:flex;align-items:center;gap:8px}.card-header .field{flex:1;margin-bottom:0}.card-fields{display:flex;gap:8px;align-items:flex-end}.card-fields .field{margin-bottom:0}.topic-title-field{flex:2}.topic-icon-field{flex:1;max-width:160px}.icon-picker{position:relative}.icon-picker-toggle{display:flex;align-items:center;gap:6px;width:100%;padding:6px 10px;border:1px solid var(--border);border-radius:6px;background:var(--surface);cursor:pointer;font-size:.9rem;min-height:36px;transition:border-color .15s}.icon-picker-toggle:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #2563eb1a}.icon-picker-toggle img{width:24px;height:24px;object-fit:contain}.icon-picker-toggle .icon-picker-placeholder{color:var(--text-muted);font-size:.85rem}.icon-picker-toggle .icon-picker-clear{margin-left:auto;color:var(--text-muted);font-size:.8rem;line-height:1}.icon-picker-dropdown{display:none;position:absolute;top:100%;left:0;z-index:50;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 4px 16px #00000026;padding:8px;margin-top:4px;width:280px;max-height:240px;overflow-y:auto}.icon-picker-dropdown.open{display:block}.icon-picker-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}.icon-picker-option{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid transparent;border-radius:6px;cursor:pointer;padding:4px;transition:background .1s,border-color .1s}.icon-picker-option:hover{background:var(--bg);border-color:var(--border)}.icon-picker-option.selected{border-color:var(--primary);background:#2563eb14}.icon-picker-option img{width:28px;height:28px;object-fit:contain}.topic-closed-field{display:flex;align-items:center;gap:6px;padding-bottom:2px}.topic-closed-field input[type=checkbox]{width:16px;height:16px;margin:0}.topic-closed-field label{margin:0;font-size:.85rem;white-space:nowrap}.topic-hidden-field{display:none;align-items:center;gap:6px;padding-bottom:2px}.topic-hidden-field input[type=checkbox]{width:16px;height:16px;margin:0}.topic-hidden-field label{margin:0;font-size:.85rem;white-space:nowrap}.message-card{background:var(--surface);border:1px solid var(--border-light);border-radius:6px;padding:10px;margin-bottom:8px;position:relative}.message-card .field.has-counter{margin-bottom:24px}.message-text{min-height:80px;resize:vertical;font-family:inherit}.message-header{display:flex;align-items:flex-start;gap:8px}.message-header .field{flex:1}.message-checkboxes{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin-top:8px}.message-format{display:flex;align-items:center;gap:8px}.message-format>.message-format-label{margin:0;font-size:.85rem;color:var(--text-muted);white-space:nowrap}.format-selector{display:inline-flex;background:var(--bg-alt);border:1px solid var(--border);border-radius:var(--radius-sm);padding:3px;gap:2px}.format-selector input[type=radio]{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}.format-selector label{margin:0;cursor:pointer;font-size:.8rem;line-height:1;padding:5px 10px;border-radius:8px;color:var(--text-muted);user-select:none;transition:background .15s cubic-bezier(.4,0,.2,1),color .15s;white-space:nowrap}.format-selector label:hover{background:#e9eefb}.format-selector input[type=radio]:checked+label{background:var(--primary);color:#fff;box-shadow:var(--shadow-sm)}.format-selector input[type=radio]:focus-visible+label{box-shadow:0 0 0 3px #2563eb59}.rich-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:6px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:8px}.rich-tb-btn{min-width:36px;height:36px;padding:0 8px;border:1px solid transparent;background:transparent;border-radius:8px;color:var(--text-muted);cursor:pointer;font-size:.9rem;line-height:1;display:inline-flex;align-items:center;justify-content:center;transition:background .15s cubic-bezier(.4,0,.2,1),color .15s}.rich-tb-btn:hover{background:#eef2f9;color:var(--text)}.rich-tb-btn:active{background:#e0e8fb;color:var(--primary)}.rich-tb-btn:focus-visible{outline:none;box-shadow:0 0 0 3px #2563eb59}.rich-toolbar-sep{width:1px;align-self:stretch;background:var(--border-light);margin:2px}.plain-format-hint{margin-top:8px;padding:7px 10px;font-size:.8rem;color:#92600b;background:#fff7ed;border:1px solid #fed7aa;border-radius:8px}.plain-hint-switch{margin-left:4px;padding:2px 8px;font-size:.78rem;font-weight:600;color:var(--primary);background:#fff;border:1px solid var(--primary);border-radius:6px;cursor:pointer}.plain-hint-switch:hover{background:var(--primary);color:#fff}.plain-hint-switch:focus-visible{outline:none;box-shadow:0 0 0 3px #2563eb59}@media (max-width: 720px){.message-checkboxes{gap:10px}.message-format{flex-wrap:wrap;gap:6px}.format-selector{flex-wrap:wrap}.rich-toolbar{gap:3px;padding:5px}.rich-tb-btn{min-width:36px;height:36px}.message-preview{overflow-x:auto}.message-preview pre{white-space:pre-wrap;word-break:break-word}.message-preview a{word-break:break-all}.draft-banner{flex-wrap:wrap}.draft-banner-actions{width:100%}.draft-banner-actions .btn{min-height:36px}}.message-checkbox-field{display:flex;align-items:center;gap:6px}.message-checkbox-field input[type=checkbox]{width:16px;height:16px;margin:0}.message-checkbox-field label{margin:0;font-size:.85rem;white-space:nowrap}.markdown-panels{display:none;margin-top:8px}.markdown-help{background:#f0f4ff;border:1px solid var(--border-light);border-radius:6px;font-size:.82rem;line-height:1.6;margin-bottom:8px}.markdown-help summary{padding:8px 12px;cursor:pointer;user-select:none;font-weight:500;font-size:.83rem;color:var(--text-muted)}.markdown-help .markdown-help-body{padding:0 12px 10px}.markdown-help code{background:#e2e8f0;padding:1px 4px;border-radius:3px;font-family:SF Mono,Fira Code,Menlo,Consolas,monospace;font-size:.8rem}.markdown-help dt{font-weight:500;float:left;clear:left;width:140px}.markdown-help dd{margin-left:148px;margin-bottom:2px}.message-preview{background:var(--surface);border:1px solid var(--border-light);border-radius:6px;padding:10px 12px;font-size:.9rem;line-height:1.5;word-break:break-word}.message-preview-label{font-size:.78rem;font-weight:500;color:var(--text-muted);margin-bottom:4px}.message-preview b{font-weight:600}.message-preview u{text-decoration:underline}.message-preview s{text-decoration:line-through}.message-preview .tg-spoiler{background:var(--text);color:var(--text);border-radius:2px;padding:0 2px;cursor:pointer;transition:color .2s}.message-preview .tg-spoiler.revealed{color:#fff}.message-preview code{background:#e2e8f0;padding:1px 4px;border-radius:3px;font-family:SF Mono,Fira Code,Menlo,Consolas,monospace;font-size:.85em}.message-preview pre{background:#1e1e2e;color:#cdd6f4;padding:8px 10px;border-radius:6px;font-family:SF Mono,Fira Code,Menlo,Consolas,monospace;font-size:.82rem;overflow-x:auto;margin:4px 0}.message-preview pre code{background:none;padding:0;color:inherit;font-size:inherit}.message-preview a{color:var(--primary);text-decoration:none}.message-preview a:hover{text-decoration:underline}.message-preview blockquote{border-left:3px solid var(--primary);margin:4px 0;padding:2px 8px;color:var(--text-muted)}.message-preview p{margin:0 0 8px}.message-preview p:last-child{margin-bottom:0}.message-preview h1,.message-preview h2,.message-preview h3{margin:10px 0 6px;font-weight:700;line-height:1.25;color:var(--text)}.message-preview h1:first-child,.message-preview h2:first-child,.message-preview h3:first-child{margin-top:0}.message-preview h1{font-size:1.35rem}.message-preview h2{font-size:1.15rem}.message-preview h3{font-size:1.02rem}.message-preview ul,.message-preview ol{margin:4px 0;padding-left:22px}.message-preview li{margin:2px 0}.message-preview hr{border:none;border-top:1px solid var(--border);margin:10px 0}.message-preview h4{font-size:.98rem}.message-preview h5{font-size:.92rem}.message-preview h6{font-size:.88rem;color:var(--text-muted)}.message-preview mark{background:#fef08a;padding:0 2px;border-radius:3px}.message-preview sub,.message-preview sup{font-size:.72em}.message-preview .tg-math{font-family:Georgia,serif;font-style:italic;background:#f1f5f9;padding:0 3px;border-radius:3px}.message-preview .tg-math-block{display:block;text-align:center;padding:8px;margin:8px 0}.message-preview .tg-spoiler{background:#cbd3e1;color:transparent;border-radius:3px;cursor:pointer}.message-preview .tg-spoiler.revealed{color:inherit;background:#e9eefb}.message-preview .tg-emoji{display:inline-block}.message-preview .tg-time{color:var(--primary);border-bottom:1px dotted var(--primary)}.message-preview .tg-fnref{color:var(--primary);font-size:.7em}.message-preview .tg-fndef{font-size:.82rem;color:var(--text-muted);margin:4px 0}.message-preview table{border-collapse:collapse;margin:8px 0;font-size:.88rem}.message-preview th,.message-preview td{border:1px solid var(--border);padding:4px 8px}.message-preview th{background:var(--bg-alt)}.message-preview figure{margin:8px 0}.message-preview figcaption{font-size:.82rem;color:var(--text-muted);margin-top:4px}.message-preview cite{display:block;font-size:.82rem;color:var(--text-muted);font-style:normal;margin-top:4px}.message-preview .tg-pullquote{border:none;border-left:3px solid var(--accent);font-style:italic}.message-preview details{border:1px solid var(--border);border-radius:8px;padding:6px 10px;margin:8px 0}.message-preview summary{cursor:pointer;font-weight:600}.message-preview .tg-media-ph{display:inline-flex;align-items:center;gap:4px;background:var(--bg-alt);border:1px dashed var(--border);border-radius:8px;padding:6px 10px;font-size:.82rem;color:var(--text-muted);margin:2px}.message-preview .tg-map-ph{background:#eef3fe;border:1px dashed var(--primary);border-radius:8px;padding:10px;text-align:center;font-size:.82rem;margin:8px 0}.message-preview .tg-collage,.message-preview .tg-slideshow{display:flex;flex-wrap:wrap;gap:4px;margin:8px 0}.message-preview .tg-slideshow{flex-wrap:nowrap;overflow-x:auto}.message-preview .tg-tasklist{list-style:none;padding-left:4px}.message-preview .tg-tasklist li{display:flex;align-items:baseline;gap:6px}.message-preview input[type=checkbox]{margin:0}.validation-error{color:var(--danger);font-size:.78rem;margin-top:4px;display:none}.char-count.over-limit{color:var(--danger);font-weight:600}.btn{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border:1px solid transparent;border-radius:12px;font-size:.9rem;font-family:inherit;font-weight:650;cursor:pointer;white-space:nowrap;transition:transform .12s ease,box-shadow .2s ease,background .2s ease,border-color .2s ease}.btn:active{transform:translateY(1px)}.btn-sm{padding:7px 12px;font-size:.85rem}.btn-primary{background:var(--primary);color:#fff;box-shadow:0 8px 20px -8px #2563ebb3}.btn-primary:hover{background:var(--primary-dark)}.btn-ghost{background:#fff;color:var(--text);border-color:var(--border);box-shadow:var(--shadow-sm)}.btn-ghost:hover{border-color:#cdd4e3}.btn-danger{background:transparent;color:var(--danger);padding:4px 8px;font-size:1.1rem;line-height:1}.btn-danger:hover{background:#dc262614}.btn-secondary{background:var(--surface);color:var(--text);border:1px solid var(--border)}.btn-secondary:hover{background:var(--bg)}.btn-success{background:var(--success);color:#fff}.output-panel{position:sticky;top:88px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}.output-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--border-light)}.output-header h2{margin:0;font-size:1rem}.output-actions{display:flex;gap:6px}.output-actions .btn{font-size:.8rem;padding:5px 10px}#yamlOutput{margin:0;padding:16px;font-family:SF Mono,Fira Code,Fira Mono,Menlo,Consolas,monospace;font-size:.82rem;line-height:1.6;white-space:pre-wrap;word-break:break-word;max-height:calc(100vh - 210px);overflow-y:auto;background:#fafbfc;color:var(--text)}.toast{position:fixed;bottom:24px;right:24px;background:var(--text);color:#fff;padding:10px 20px;border-radius:6px;font-size:.85rem;opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s;pointer-events:none;z-index:100}.toast.show{opacity:1;transform:translateY(0)}.empty-hint{color:var(--text-muted);font-size:.85rem;font-style:italic;padding:8px 0}.import-section{border:1px solid var(--border);border-radius:var(--radius);padding:18px;margin:0 0 16px;background:var(--surface);box-shadow:var(--shadow-sm)}.import-section summary{font-weight:600;font-size:1rem;cursor:pointer;user-select:none}.import-body{margin-top:12px}.import-body textarea{font-family:SF Mono,Fira Code,Fira Mono,Menlo,Consolas,monospace;font-size:.82rem;line-height:1.5;min-height:120px;resize:vertical}.import-actions{display:flex;align-items:center;gap:8px;margin-top:10px;flex-wrap:wrap}.import-actions .separator{color:var(--text-muted);font-size:.85rem}.import-file-label{display:inline-flex;align-items:center;gap:4px;padding:7px 14px;border:1px solid var(--border);border-radius:6px;font-size:.85rem;font-weight:500;cursor:pointer;background:var(--surface);color:var(--text);transition:background .15s}.import-file-label:hover{background:var(--bg)}.import-file-label input[type=file]{display:none}.import-error{color:var(--danger);font-size:.85rem;margin-top:8px}.photo-preview{display:none;margin-top:8px}.photo-preview img{max-width:100%;max-height:200px;border-radius:6px;border:1px solid var(--border-light);object-fit:contain}.gallery-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;background:var(--primary);color:#fff;border:none;border-radius:6px;font-size:.85rem;font-weight:500;cursor:pointer;transition:background .15s;font-family:inherit;white-space:nowrap}.gallery-btn:hover{background:var(--primary-hover)}.gallery-overlay{position:fixed;inset:0;background:#0000004d;z-index:200;opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}.gallery-overlay.open{opacity:1;visibility:visible}.gallery-panel{position:fixed;top:0;right:0;width:480px;max-width:90vw;height:100vh;background:var(--surface);box-shadow:-4px 0 24px #00000026;z-index:201;transform:translate(100%);transition:transform .3s ease;display:flex;flex-direction:column;overflow:hidden}.gallery-overlay.open .gallery-panel{transform:translate(0)}.gallery-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border-light);flex-shrink:0}.gallery-header h2{margin:0;font-size:1.1rem}.gallery-close{background:none;border:none;font-size:1.4rem;cursor:pointer;color:var(--text-muted);padding:4px 8px;line-height:1;border-radius:4px;transition:background .15s}.gallery-close:hover{background:var(--bg)}.gallery-body{flex:1;overflow-y:auto;padding:16px 20px}.gallery-card{border:1px solid var(--border-light);border-radius:var(--radius);padding:16px;margin-bottom:12px;background:var(--bg);transition:border-color .15s}.gallery-card:hover{border-color:var(--primary)}.gallery-card h3{margin:0 0 6px;font-size:.95rem}.gallery-card p{margin:0 0 12px;font-size:.83rem;color:var(--text-muted);line-height:1.4}.gallery-card .btn{font-size:.8rem;padding:6px 12px}.confirm-overlay{position:fixed;inset:0;background:#0006;z-index:300;display:none;align-items:center;justify-content:center}.confirm-overlay.open{display:flex}.confirm-dialog{background:var(--surface);border-radius:var(--radius);padding:24px;max-width:400px;width:90%;box-shadow:0 8px 32px #0003}.confirm-dialog p{margin:0 0 16px;font-size:.9rem;line-height:1.5}.confirm-actions{display:flex;gap:8px;justify-content:flex-end}@media (max-width: 820px){main{flex-direction:column;padding:16px}.output-column{width:100%}.output-panel{position:static}#yamlOutput{max-height:50vh}.perm-grid{grid-template-columns:1fr}.gallery-panel{width:100vw;max-width:100vw}}@media (max-width: 560px){header.site .nav{flex-wrap:wrap;height:auto;padding:10px 16px;gap:10px}.brand{font-size:1rem;white-space:nowrap;flex:0 0 auto}.nav-right{gap:8px;flex-wrap:wrap;justify-content:flex-end}.nav-right .btn-primary{display:none}.builder-intro{padding:20px 16px 4px}}