
* { box-sizing: border-box;}
body { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color: #0f172a; margin: 0; line-height: 1.6; background: #fff;}
a { color: #2563eb;}
header.site { border-bottom: 1px solid #e2e8f0; padding: 14px 20px;}
header.site .wrap { max-width: 1080px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 10px 24px; align-items: center; justify-content: space-between;}
.brand { font-size: 22px; font-weight: 800; color: #0f172a; text-decoration: none;}
nav.main a { margin-right: 14px; text-decoration: none; color: #334155; font-size: 15px;}
nav.main a:hover { color: #2563eb;}
main { max-width: 1080px; margin: 0 auto; padding: 24px 20px 40px;}
h1 { font-size: 32px; line-height: 1.25;}
h2 { font-size: 24px; margin-top: 36px;}
h3 { font-size: 18px;}
.lead { color: #475569; font-size: 18px;}
.grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px;}
.card { border: 1px solid #e2e8f0; border-radius: 12px; padding: 16px;}
.card a { text-decoration: none; color: #0f172a; font-weight: 700;}
.card p { color: #64748b; margin: 6px 0 0; font-size: 14px;}
.examples { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px;}
.examples li { border: 1px solid #e2e8f0; border-radius: 10px; padding: 12px; display: flex; justify-content: space-between; gap: 10px; align-items: center;}
.examples .txt { font-size: 19px; word-break: break-all; overflow-wrap: anywhere;}
.examples button,.copybtn { border: 0; border-radius: 8px; background: #2563eb; color: #fff; padding: 8px 12px; cursor: pointer; font-weight: 700; white-space: nowrap;}
.examples button:hover,.copybtn:hover { background: #1d4ed8;}
.namelist { columns: 4; column-gap: 24px; list-style: none; padding: 0;}
.namelist li { margin-bottom: 6px;}
.namelist a { text-decoration: none;}
details { border: 1px solid #e2e8f0; border-radius: 10px; padding: 12px 16px; margin-bottom: 10px;}
details summary { font-weight: 700; cursor: pointer;}
footer.site { background: #0f172a; color: #cbd5e1; padding: 30px 20px;}
footer.site .wrap { max-width: 1080px; margin: 0 auto;}
footer.site a { color: #e2e8f0; text-decoration: none; margin-right: 12px; font-size: 14px;}
footer.site p { font-size: 13px; color: #94a3b8;}

























@media (max-width: 640px) {.grid { grid-template-columns: 1fr;}.examples { grid-template-columns: 1fr;}.namelist { columns: 2;} h1 { font-size: 26px;}}
@media (min-width: 641px) and (max-width: 900px) {.grid { grid-template-columns: repeat(2, 1fr);}.namelist { columns: 3;}}


.ftg3{--ftg3-brand:#2563eb;--ftg3-brand-dark:#1d4ed8;--ftg3-border:#e2e8f0;--ftg3-text:#0f172a;--ftg3-muted:#64748b;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ftg3-text);max-width:1080px;margin:0 auto;line-height:1.5}
.ftg3 *{box-sizing:border-box}
.ftg3 .ftg3-title{font-size:30px;font-weight:800;margin:0 0 6px;text-align:center}
.ftg3 .ftg3-sub{color:var(--ftg3-muted);text-align:center;margin:0 0 6px}
.ftg3 .ftg3-steps{text-align:center;font-weight:700;margin:0 0 18px}
.ftg3 .ftg3-panel{border:1px solid var(--ftg3-border);border-radius:14px;padding:16px;margin:0 0 16px;background:#fff}
.ftg3 .ftg3-label{font-size:13px;font-weight:700;color:var(--ftg3-muted);display:block;margin:0 0 6px}
.ftg3 .ftg3-input{width:100%;font-size:19px;padding:14px 16px;border:2px solid #cbd5e1;border-radius:12px;outline:none}
.ftg3 .ftg3-input:focus{border-color:var(--ftg3-brand)}
.ftg3 .ftg3-counter{color:var(--ftg3-muted);font-size:14px;margin:8px 0 0}
.ftg3 .ftg3-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.ftg3 .ftg3-field{flex:1;min-width:150px}
.ftg3 .ftg3-select{width:100%;font-size:15px;padding:11px 12px;border:1px solid var(--ftg3-border);border-radius:10px;background:#fff}
.ftg3 .ftg3-check{display:flex;align-items:center;gap:8px;font-size:15px;padding:11px 4px}
.ftg3 .ftg3-btn{appearance:none;font-family:inherit;border:1px solid var(--ftg3-border);background:#fff;color:var(--ftg3-text);border-radius:10px;padding:11px 16px;font-size:15px;font-weight:700;cursor:pointer}
.ftg3 .ftg3-btn-primary{appearance:none;font-family:inherit;border:0;border-radius:10px;background:var(--ftg3-brand);color:#fff;padding:11px 16px;font-size:15px;font-weight:700;cursor:pointer}
.ftg3 .ftg3-btn-primary:hover{background:var(--ftg3-brand-dark)}
.ftg3 .ftg3-search{width:100%;margin:0 0 10px;font-size:15px;padding:11px 14px;border:1px solid var(--ftg3-border);border-radius:10px}
.ftg3 .ftg3-cats{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.ftg3 .ftg3-cat{appearance:none;font-family:inherit;border:1px solid var(--ftg3-border);background:#fff;color:var(--ftg3-text);border-radius:999px;padding:7px 14px;cursor:pointer;font-size:14px}
.ftg3 .ftg3-cat.ftg3-active{background:var(--ftg3-brand);color:#fff;border-color:var(--ftg3-brand)}
.ftg3 .ftg3-count{color:var(--ftg3-muted);font-size:14px;margin:0 0 12px}
.ftg3 .ftg3-empty{display:none;border:1px dashed #cbd5e1;border-radius:12px;padding:20px;text-align:center;color:var(--ftg3-muted)}
.ftg3 .ftg3-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.ftg3 .ftg3-card{border:1px solid var(--ftg3-border);border-radius:12px;padding:14px;background:#fff}
.ftg3 .ftg3-card-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.ftg3 .ftg3-name{font-size:13px;font-weight:700;color:var(--ftg3-muted)}
.ftg3 .ftg3-fav{border:0;background:transparent;font-size:20px;line-height:1;cursor:pointer;color:#94a3b8;padding:4px}
.ftg3 .ftg3-fav.ftg3-on{color:#e11d48}
.ftg3 .ftg3-out{font-size:21px;word-break:break-all;overflow-wrap:anywhere;min-height:34px;margin:10px 0 12px}
.ftg3 .ftg3-copy{appearance:none;font-family:inherit;width:100%;border:0;border-radius:9px;background:var(--ftg3-brand);color:#fff;padding:10px;font-size:15px;font-weight:700;cursor:pointer}
.ftg3 .ftg3-copy:hover{background:var(--ftg3-brand-dark)}
.ftg3 .ftg3-copy.ftg3-done{background:#15803d}
.ftg3 .ftg3-share{display:none;border:1px solid var(--ftg3-border);border-radius:12px;padding:14px;margin-top:12px;background:#f8fafc}
.ftg3 .ftg3-share-link{display:inline-block;margin:4px 8px 4px 0;color:var(--ftg3-brand);font-weight:700;text-decoration:none}
.ftg3 .ftg3-mix{border:1px solid var(--ftg3-border);border-radius:12px;padding:14px;margin-top:12px;background:#eff6ff}
.ftg3 .ftg3-mix-out{font-size:22px;word-break:break-all;overflow-wrap:anywhere;margin:10px 0 12px;min-height:34px}
.ftg3 .ftg3-section{border:1px solid var(--ftg3-border);border-radius:14px;padding:16px;margin:0 0 16px;background:#fff}
.ftg3 .ftg3-section-title{font-size:20px;font-weight:800;margin:0 0 6px}
.ftg3 .ftg3-alpha-grid{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.ftg3 .ftg3-alpha-btn{appearance:none;font-family:inherit;border:1px solid var(--ftg3-border);background:#fff;border-radius:8px;padding:8px 10px;font-size:17px;cursor:pointer;min-width:42px}
.ftg3 .ftg3-inv-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.ftg3 .ftg3-inv-btn{appearance:none;font-family:inherit;border:1px solid var(--ftg3-border);background:#fff;border-radius:10px;padding:10px 14px;font-size:15px;font-weight:700;cursor:pointer}
.ftg3 .ftg3-inv-input{font-size:15px;padding:10px 12px;border:1px solid var(--ftg3-border);border-radius:10px;width:90px}
.ftg3 .ftg3-symbol-grid{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.ftg3 .ftg3-symbol-btn{appearance:none;font-family:inherit;border:1px solid var(--ftg3-border);background:#fff;border-radius:8px;padding:8px 12px;font-size:19px;cursor:pointer}
.ftg3 .ftg3-kaomoji-grid{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.ftg3 .ftg3-kaomoji-btn{appearance:none;font-family:inherit;border:1px solid var(--ftg3-border);background:#fff;border-radius:8px;padding:8px 12px;font-size:17px;cursor:pointer}
.ftg3 .ftg3-phrase-grid{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.ftg3 .ftg3-phrase-btn{appearance:none;font-family:inherit;border:1px solid var(--ftg3-border);background:#fff;border-radius:999px;padding:8px 14px;font-size:14px;cursor:pointer}
.ftg3 .ftg3-note{color:var(--ftg3-muted);font-size:13px;text-align:center;margin-top:16px}
.ftg3 .ftg3-load-row{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:14px}
@media(max-width:640px){.ftg3 .ftg3-grid{grid-template-columns:1fr}.ftg3 .ftg3-title{font-size:25px}}
