.tnt{max-width:920px;margin:0 auto 24px;font-size:1rem;line-height:1.5}
.tnt *{box-sizing:border-box}
.tn-drop{border:2px dashed #8fb3ac;border-radius:18px;background:#fff;padding:52px 20px;text-align:center;cursor:pointer;display:flex;flex-direction:column;gap:6px;align-items:center}
.tn-drop:hover,.tn-drop.over{border-color:var(--brand,#0f6b5e);background:#eef6f4}
.tn-drop strong{font-size:1.35rem;color:var(--ink,#0c2724);font-family:"Bricolage Grotesque","Figtree",system-ui,sans-serif}
.tn-drop small{color:var(--muted,#586a66)}
.tn-panel{background:#fff;border:1px solid var(--line,#d9e5e2);border-radius:14px;padding:18px;margin-top:16px}
.tn-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin-bottom:14px}
.tn-opts.four{grid-template-columns:repeat(4,1fr)}
.tn-f{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:.95rem}
.tn-f small{font-weight:400;color:var(--muted,#586a66)}
.tn-f input[type=text],.tn-f input[type=number],.tn-f select{width:100%;padding:10px 12px;border:1px solid var(--line,#d9e5e2);border-radius:10px;font:inherit;font-weight:400;background:#fff}
.tn-f input[type=color]{width:100%;height:42px;padding:2px;border:1px solid var(--line,#d9e5e2);border-radius:10px;background:#fff}
.tn-f input[type=range]{width:100%;accent-color:var(--brand,#0f6b5e)}
.tn-f input[type=file]{font-weight:400;font-size:.9rem}
.tn-chk{display:flex;align-items:center;gap:8px;font-weight:600;font-size:.95rem;align-self:end;padding-bottom:10px}
.tn-chk input{width:18px;height:18px;accent-color:var(--brand,#0f6b5e)}
.tn-tip{margin:0 0 14px;color:var(--muted,#586a66);font-size:.92rem;grid-column:1/-1}
.tn-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:16px}
.tn-btn{background:var(--brand,#0f6b5e);color:#fff;border:1px solid var(--brand,#0f6b5e);border-radius:12px;padding:12px 22px;font:600 1rem inherit;cursor:pointer}
.tn-btn:hover{background:var(--brand-d,#0a4f45)}
.tn-btn.alt{background:#fff;color:var(--brand,#0f6b5e)}
.tn-btn.alt:hover{background:#eef6f4}
.tn-btn.sm{padding:8px 14px;font-size:.92rem}
.tn-btn:disabled{opacity:.5;cursor:default}
.tn-link{background:none;border:0;color:var(--muted,#586a66);text-decoration:underline;cursor:pointer;font:inherit;padding:8px}
.tn-list{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:10px}
.tn-item{display:flex;gap:12px;align-items:center;padding:10px;border:1px solid var(--line,#d9e5e2);border-radius:12px;background:#fbfdfc}
.tn-item img{width:56px;height:56px;object-fit:cover;border-radius:8px;background:#e8eeed;flex:none}
.tn-item .nm{flex:1;min-width:0}
.tn-item .nm b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tn-item .st{color:var(--muted,#586a66);font-size:.9rem}
.tn-item .st.ok{color:#0a6a3a}
.tn-item .st.bad,.tn-msg.bad{color:#b53350}
.tn-x{background:none;border:0;font-size:1.5rem;line-height:1;color:var(--muted,#586a66);cursor:pointer;padding:6px 10px}
.tn-msg{margin:12px 0 0;min-height:1.2em;color:var(--muted,#586a66)}
canvas.tn-cv{display:block;width:100%;height:auto;border-radius:12px;background:#e8eeed;touch-action:none;margin-bottom:14px;cursor:crosshair}
.tnt-help{max-width:920px;margin:40px auto 0}
.tnt-help h2{font-size:1.5rem;margin:0 0 12px}
.tnt-help ol{padding-left:1.3em;margin:0 0 28px}
.tnt-help li{margin:6px 0}
.tnt-help details{border-top:1px solid var(--line,#d9e5e2);padding:12px 0}
.tnt-help summary{cursor:pointer;font-weight:600}
.tnt-help details p{margin:8px 0 0;color:var(--muted,#586a66)}
@media (max-width:640px){.tn-opts.four{grid-template-columns:1fr 1fr}.tn-drop{padding:40px 16px}}