/* Shared by the editor, draft preview and official website. */
.tn-banner-host { position:relative !important; display:block !important; width:100%; min-height:0 !important; padding:0 !important; aspect-ratio:auto !important; overflow:hidden; background:#0d3145 !important; }
.tn-banner-host::before,.tn-banner-host::after { display:none !important; }
.tn-banner-stage { position:relative; margin:0 auto; transform-origin:top left; font-family:Arial,"Microsoft JhengHei",sans-serif; color:#fff; isolation:isolate; }
.tn-banner-stage * { box-sizing:border-box; }
.tn-banner-media,.tn-banner-shade { position:absolute; inset:0; pointer-events:none; }
.tn-banner-media { background:#0d3145; overflow:hidden; }
.tn-banner-media img,.tn-banner-media video,.tn-banner-media iframe { display:block; width:100%; height:100%; object-fit:contain; border:0; }
.tn-banner-shade { background:linear-gradient(90deg,rgba(0,31,58,.78),rgba(0,0,0,.18)); opacity:var(--tn-overlay,.45); }
.tn-banner-stage [data-banner-element] { position:absolute !important; transform:translate(-50%,-50%); margin:0 !important; width:max-content; min-width:0; font-family:Arial,"Microsoft JhengHei",sans-serif !important; overflow-wrap:anywhere; white-space:pre-wrap; letter-spacing:0; text-transform:none; text-align:left; overflow:auto; z-index:2; }
.tn-banner-stage .tn-banner-title { padding:0 0 .2em; font-weight:900; line-height:1.2; text-shadow:0 12px 36px rgba(0,0,0,.24); }
.tn-banner-stage .tn-banner-subtitle { font-weight:500; line-height:1.6; opacity:.94; text-shadow:0 8px 28px rgba(0,0,0,.2); }
.tn-banner-stage .tn-banner-button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:10px 24px; border:0; border-radius:999px; font-weight:800; line-height:1.4; text-decoration:none; box-shadow:0 16px 34px rgba(0,0,0,.2); }
.tn-banner-stage [hidden] { display:none !important; }
.tn-banner-safe { display:none;position:absolute; border:1px dashed #fff; outline:1px dashed #006882; pointer-events:none;z-index:3; }
.tn-banner-editor .tn-banner-safe { display:block; }
.tn-banner-editor [data-banner-element] { cursor:grab; touch-action:none; user-select:none; }
.tn-banner-editor [data-banner-element]:hover,.tn-banner-editor [data-banner-element]:focus-visible { outline:2px solid #ffdb6e; outline-offset:3px; }
.tn-banner-status { position:absolute; bottom:4px; left:8px; right:8px; z-index:4; pointer-events:none; font-size:14px; line-height:1.4; color:#fff; text-shadow:0 1px 3px #000; }
.tn-banner-status:empty { display:none; }
.tn-banner-host:has(.tn-banner-editor) .tn-banner-stage { margin:0; left:calc((100% - var(--tn-stage-display-width,100%))/2); }
.tn-banner-toolbar { display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:12px; }
.tn-banner-toolbar label { margin:0;font-size:13px; }
.tn-banner-toolbar select { width:auto;max-width:100%; }
.tn-banner-dots { position:absolute;bottom:8px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:5; }
.tn-banner-dots button { width:32px;height:24px;border:0;border-radius:8px;background:rgba(0,31,58,.65);cursor:pointer; }
.tn-banner-dots button::after { content:'';display:block;height:4px;background:#aaa;border-radius:4px; }
.tn-banner-dots button[aria-current="true"]::after { background:#fff; }