@font-face{font-family:"TNL";src:url("fonts/TNL-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"TNL";src:url("fonts/TNL-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"TNL";src:url("fonts/TNL-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"TNL";src:url("fonts/TNL-Black.woff2") format("woff2");font-weight:900;font-style:normal;font-display:swap}
*{box-sizing:border-box}body{margin:0;color:#303030;background:#fff;font:16px/1.45 "TNL",Arial,Helvetica,sans-serif}.site-header{position:relative;min-height:100px;padding:24px 170px;border-bottom:1px solid #e8e8e8;text-align:center}.brand strong{display:block;text-transform:uppercase;font-size:15px;line-height:1.5}.brand span{display:block;color:#888;font-size:14px;margin-top:5px}.site-header nav{position:absolute;right:32px;top:39px;display:flex;gap:16px;font-size:13px}a{color:inherit;text-underline-offset:3px}a[aria-current]{font-weight:700}.screen{min-height:calc(100svh - 100px);display:flex;align-items:center;padding:64px 32px}.screen-content{width:100%;margin:0 auto}.screen--access .screen-content{max-width:500px}.screen--details .screen-content{max-width:700px}.screen--preview .screen-content{max-width:930px}.step{margin:0 0 24px;text-transform:uppercase;color:#888;font-size:12px}h1{font-size:28px;line-height:1.2;margin:0 0 20px}p{margin:0 0 20px}.intro{font-size:14px;margin-bottom:24px}label{display:block;margin-bottom:8px;font-size:14px}input,textarea{display:block;width:100%;padding:10px 12px;border:1px solid #dedede;border-radius:6px;background:#fff;color:#303030;font:inherit}input::placeholder,textarea::placeholder{color:#888;opacity:1}button{display:block;width:fit-content;padding:12px 24px;margin-top:20px;border:1px solid #303030;border-radius:6px;background:#303030;color:#fff;font:14px/1.4 "TNL",Arial,Helvetica,sans-serif;cursor:pointer}.details-form{margin-top:40px}.field{margin-bottom:26px}.field label{font-size:20px;font-weight:700}.field--funding,.field--impact{max-width:480px}.currency-input{position:relative}.currency-input span{position:absolute;top:11px;left:12px}.currency-input input{padding-left:27px}.textarea-wrap{position:relative;border:1px solid #dedede;border-radius:6px;overflow:hidden}.textarea-wrap textarea{border:0;border-radius:0;resize:vertical;min-height:140px;padding-bottom:40px}.character-count{position:absolute;bottom:9px;left:12px;margin:0;font-size:11px;pointer-events:none}.details-form>button{margin-top:44px}.preview-layout{display:grid;grid-template-columns:minmax(0,580px) minmax(0,1fr);gap:28px}.asset{min-height:350px;padding:28px;background:#d9d9d9;display:flex;flex-direction:column;justify-content:space-between;overflow-wrap:anywhere}.asset-note{font-size:12px;line-height:1.5;color:#757575;margin:0}.asset-copy{padding:36px 18px}.asset-copy h2{font-size:20px;font-weight:400;margin:0 0 22px}.asset-copy p{font-size:20px;line-height:1.3;margin:0;white-space:pre-line}.preview-actions h2{font-size:18px;margin:0 0 20px}.preview-actions p{font-size:14px;line-height:1.4}.secondary{color:#303030;background:#e7e7e7;border-color:#aaa}.preview-actions button{margin-top:20px}.logout{margin-top:36px}.text-button{background:transparent;border:0;padding:0;color:#777;text-decoration:underline;text-underline-offset:3px;font-size:12px;margin:0}.error,.notice{padding:14px 16px;border:1px solid #ccc;border-radius:4px;font-size:14px}.error{color:#9a1818;border-color:#d5a4a4}.notice{background:#f5f5f5}input:focus-visible,textarea:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid #446bd6;outline-offset:3px}.textarea-wrap:focus-within{outline:3px solid #446bd6;outline-offset:3px}.textarea-wrap textarea:focus-visible{outline:none}@media(max-width:700px){.site-header{padding:22px 20px;min-height:122px}.site-header nav{position:static;justify-content:center;margin-top:14px}.brand strong{font-size:13px}.screen{min-height:calc(100svh - 122px);padding:48px 24px}.preview-layout{grid-template-columns:1fr;gap:32px}.preview-actions form{display:flex;flex-wrap:wrap;gap:16px}.preview-actions button{margin:0}.asset{min-height:300px;padding:22px}.asset-copy{padding:32px 0}h1{font-size:26px}.field--funding,.field--impact{max-width:none}.step{margin-bottom:20px}}

.generated-video{display:block;width:min(100%,360px);max-height:70vh;margin-bottom:24px;background:#090078}.screen--download .screen-content{max-width:930px}

/* Campaign reskin: NL_Wireframe_TNLReskin_v04. Admin retains its existing UI. */
.campaign {
 --tnl-navy: #000080;
 --tnl-blue: #004def;
 color: #fff;
 background: #0024d4 url("brand/tnl-pattern.svg") center / cover fixed no-repeat;
 font-size: 18px;
 line-height: 1.4;
}
.campaign .site-header {
 position: absolute;
 z-index: 1;
 top: 0;
 left: 0;
 width: 100%;
 min-height: 0;
 padding: 0;
 border: 0;
}
.campaign .site-header nav {
 position: absolute;
 top: 28px;
 right: 32px;
 display: flex;
 justify-content: flex-end;
 gap: 20px;
 margin: 0;
 font-size: 15px;
}
.campaign .site-header a { padding: 6px 0; }
.campaign .screen {
 min-height: 100svh;
 padding: 88px 32px 64px;
}
.campaign .screen--access .screen-content { max-width: 560px; }
.campaign .screen--details .screen-content { max-width: 784px; }
.campaign .screen--preview .screen-content { max-width: 1040px; }
.campaign .screen--download .screen-content { max-width: 640px; }
.campaign-brand { margin-bottom: 28px; }
.campaign-brand img { display: block; width: 180px; height: auto; }
.campaign .step {
 display: block;
 width: fit-content;
 max-width: 100%;
 margin: 0 0 24px;
 padding: 7px 22px;
 border-radius: 999px;
 background: var(--tnl-blue);
 color: #fff;
 font-size: 20px;
 font-weight: 900;
 line-height: 1.2;
}
.campaign h1 { margin: 0 0 14px; font-size: 40px; font-weight: 900; line-height: 1.15; }
.campaign .intro { margin: 0 0 24px; font-size: 20px; font-weight: 700; line-height: 1.4; }
.campaign label { margin-bottom: 10px; font-size: 20px; }
.campaign input, .campaign textarea {
 padding: 10px 18px;
 border: 1px solid #fff;
 border-radius: 8px;
 background: #fff;
 color: var(--tnl-navy);
 font-size: 18px;
 line-height: 1.35;
}
.campaign input::placeholder, .campaign textarea::placeholder { color: var(--tnl-navy); }
.campaign button, .campaign .button {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: fit-content;
 min-width: 162px;
 min-height: 44px;
 margin-top: 20px;
 padding: 10px 24px;
 border: 1px solid var(--tnl-navy);
 border-radius: 8px;
 background: var(--tnl-navy);
 color: #fff;
 font: 700 16px/1.3 "TNL", Arial, sans-serif;
 text-align: center;
 text-decoration: none;
 cursor: pointer;
}
.campaign button:hover, .campaign .button:hover { background: #00005f; }
.campaign .secondary { border-color: #fff; background: #fff; color: var(--tnl-navy); }
.campaign .secondary:hover { background: #e8f0ff; }
.campaign .form-note { margin: 0 0 18px; font-size: 14px; }
.campaign .details-form { margin-top: 0; }
.campaign .field { margin-bottom: 24px; }
.campaign .field label { font-size: 28px; font-weight: 700; line-height: 1.2; }
.campaign .field--funding, .campaign .field--impact { max-width: none; }
.campaign .currency-input span { top: 10px; left: 18px; color: var(--tnl-navy); }
.campaign .currency-input input { padding-left: 32px; }
.campaign .textarea-wrap { border: 1px solid #fff; border-radius: 8px; background: #fff; }
.campaign .textarea-wrap textarea { min-height: 156px; padding-bottom: 42px; }
.campaign .character-count { bottom: 12px; left: 18px; color: var(--tnl-navy); font-size: 14px; font-weight: 700; }
.campaign .details-form > button { margin-top: 0; }
.campaign .preview-layout { grid-template-columns: minmax(0, 640px) minmax(0, 340px); gap: 32px; align-items: center; }
.campaign .asset {
 min-height: 390px;
 padding: 32px;
 border-radius: 9px;
 background: #fff;
 color: var(--tnl-navy);
}
.campaign .asset-note { margin: 0; color: var(--tnl-navy); font-size: 16px; font-weight: 700; line-height: 1.35; }
.campaign .asset-copy { padding: 56px 0 64px; }
.campaign .asset-copy h2 { margin: 0 0 20px; font-size: 24px; font-weight: 400; }
.campaign .asset-copy p { font-size: 24px; line-height: 1.25; }
.campaign .preview-actions h2 {
 display: flex;
 align-items: center;
 justify-content: center;
 min-height: 198px;
 margin: 0 0 24px;
 padding: 42px 46px;
 background: url("brand/preview-shape.png") center / 100% 100% no-repeat;
 font-size: 34px;
 font-weight: 900;
 line-height: 1.15;
 text-align: center;
}
.campaign .preview-actions p { margin-bottom: 24px; font-size: 18px; text-align: center; }
.campaign .preview-actions form { display: flex; flex-wrap: wrap; gap: 16px; }
.campaign .preview-actions button { flex: 1 1 150px; min-width: 0; margin: 0; padding: 10px 14px; }
.campaign .download-card { padding: 32px; border-radius: 9px; background: #fff; color: var(--tnl-navy); overflow-wrap: anywhere; }
.campaign .download-card h2 { margin: 0 0 12px; font-size: 28px; font-weight: 900; line-height: 1.2; }
.campaign .download-cause { margin: 0 0 12px; }
.campaign .file-note { margin: 0; font-size: 18px; }
.campaign .generated-video { width: min(100%, 250px); max-height: 45svh; margin: 24px auto 0; border-radius: 4px; }
.campaign .video-preview { margin-top: 20px; }
.campaign .video-preview summary { width: fit-content; cursor: pointer; font-size: 16px; text-underline-offset: 3px; }
.campaign .video-preview summary:hover { text-decoration: underline; }
.campaign .video-preview .generated-video { margin-left: 0; }
.campaign .download-edit button { margin-top: 16px; }
.campaign .render-progress { margin: 28px 0 32px; }
.campaign .render-status { display: flex; align-items: center; gap: 14px; }
.campaign .render-status p { margin: 0; color: #fff; font-size: 17px; font-weight: 500; }
.campaign .render-spinner { flex: 0 0 24px; width: 24px; height: 24px; border: 3px solid rgb(255 255 255 / 30%); border-top-color: #fff; border-radius: 50%; }
.campaign .render-hint { max-width: 480px; margin: 14px 0 0; color: #fff; font-size: 15px; line-height: 1.5; }
.campaign .logout { margin-top: 28px; }
.campaign .text-button { min-width: 0; min-height: 32px; margin: 0; padding: 4px 0; border: 0; border-radius: 0; background: transparent; color: #fff; font-size: 14px; text-decoration: underline; }
.campaign .text-button:hover { background: transparent; text-decoration-thickness: 2px; }
.campaign .error, .campaign .notice { border-color: #fff; background: #fff; color: var(--tnl-navy); font-size: 18px; }
.campaign :is(input,textarea,button,a):focus-visible { outline: 3px solid #00f0dc; outline-offset: 4px; }
.campaign summary:focus-visible { outline: 3px solid #00f0dc; outline-offset: 4px; }
.campaign .textarea-wrap:focus-within { outline: 3px solid #00f0dc; outline-offset: 4px; }
.campaign .textarea-wrap textarea:focus-visible { outline: none; }
@media (max-width: 700px) {
 .campaign .site-header nav { top: 18px; right: 24px; gap: 18px; font-size: 14px; }
 .campaign .screen { min-height: 100svh; padding: 88px 24px 40px; }
 .campaign-brand { margin-bottom: 24px; }
 .campaign-brand img { width: 150px; }
 .campaign .step { margin-bottom: 20px; padding: 7px 18px; font-size: 16px; }
 .campaign h1 { font-size: 32px; }
 .campaign .intro { font-size: 18px; }
 .campaign .field label { font-size: 24px; }
 .campaign input, .campaign textarea { padding-left: 14px; padding-right: 14px; font-size: 16px; }
 .campaign .currency-input span { left: 14px; font-size: 16px; }
 .campaign .currency-input input { padding-left: 28px; }
 .campaign .character-count { left: 14px; font-size: 12px; }
 .campaign .preview-layout { grid-template-columns: minmax(0, 1fr); gap: 28px; }
 .campaign .asset { min-height: 320px; padding: 24px; }
 .campaign .asset-copy { padding: 40px 0; }
 .campaign .asset-copy h2, .campaign .asset-copy p { font-size: 22px; }
 .campaign .asset-note { font-size: 14px; }
 .campaign .preview-actions h2 { width: min(100%, 340px); min-height: 180px; margin-left: auto; margin-right: auto; font-size: 30px; }
 .campaign .preview-actions p { max-width: 340px; margin-left: auto; margin-right: auto; }
 .campaign .download-card { padding: 24px; }
 .campaign .download-card h2 { font-size: 26px; }
}
@media (prefers-reduced-motion: no-preference) {
 .campaign button, .campaign .button { transition: background-color 120ms ease; }
 .campaign .render-spinner { animation: render-spin 900ms linear infinite; }
}
@keyframes render-spin { to { transform: rotate(360deg); } }
.campaign .optional-label { font-size: 16px; font-weight: 400; white-space: nowrap; }
.campaign .field-hint { margin: 8px 0 0; font-size: 15px; line-height: 1.4; }
.campaign .download-consent { margin-top: 24px; }
.campaign .consent-row { display: flex; align-items: flex-start; gap: 12px; }
.campaign .consent-row input[type="checkbox"] { display: block; flex: 0 0 24px; width: 24px; height: 24px; min-height: 0; padding: 0; margin: 2px 0 0; accent-color: #fff; cursor: pointer; }
.campaign .consent-row label { margin: 0; font-size: 17px; line-height: 1.5; font-weight: 400; }
.campaign .consent-row a, .campaign .consent-note a, .campaign .learn-more a { text-underline-offset: 3px; }
.campaign .consent-note, .campaign .learn-more { font-size: 16px; line-height: 1.5; margin: 20px 0; }
.campaign .download-button:disabled { opacity: .55; cursor: not-allowed; }
.campaign .terms-dialog { width: min(720px, calc(100% - 32px)); max-height: 85svh; border: 0; border-radius: 9px; padding: 32px; color: var(--tnl-navy); background: #fff; overflow: auto; }
.campaign .terms-dialog::backdrop { background: rgb(0 0 75 / 75%); }
.campaign .terms-dialog h2 { font-size: 28px; line-height: 1.2; margin: 0 0 24px; }
.campaign .terms-copy { font-size: 17px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.campaign .terms-dialog button { background: var(--tnl-navy); color: #fff; min-width: 100px; margin-top: 24px; }
.campaign .terms-dialog button:hover { background: #0549ff; }
.campaign .terms-document { max-width: 720px; padding: 24px; border-radius: 9px; background: #fff; color: var(--tnl-navy); }
.campaign .screen--terms .screen-content { max-width: 720px; }
@media (max-width: 700px) { .campaign .terms-dialog { padding: 24px; } }

/* 22 October journey updates. */
.campaign .screen--upload .screen-content { max-width: 784px; }
.campaign .campaign-help { margin: 24px 0 0; font-size: 16px; line-height: 1.5; overflow-wrap: anywhere; }
.campaign .how-to { margin-top: 32px; }
.campaign .how-to h2 { font-size: 24px; line-height: 1.25; }
.campaign .how-to__placeholder { aspect-ratio: 16 / 9; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; border: 2px solid rgb(255 255 255 / 60%); border-radius: 9px; background: rgb(0 0 128 / 70%); text-align: center; padding: 24px; }
.campaign .how-to__placeholder p { margin: 0; }
.campaign .how-to__play { font-size: 40px; }
.campaign .image-upload { margin: 28px 0; padding: 24px; border: 1px dashed #fff; border-radius: 9px; }
.campaign .image-upload input:disabled { opacity: .7; cursor: not-allowed; }
.campaign .step-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.campaign .step-actions button { margin-top: 0; }
.campaign .step-actions .campaign-help { flex: 1 1 280px; margin: 0; }
.campaign .preview-layout { align-items: start; }
.campaign .preview-actions .consent-row { flex: 1 1 100%; }
.campaign .preview-actions .campaign-help { font-size: 15px; text-align: left; }
.campaign .generate-form [data-consent-submit] { flex-grow: 0; min-width: 162px; }
.campaign button:disabled { opacity: .55; cursor: not-allowed; }
.campaign .preview-terms { margin-top: 40px; padding-top: 28px; border-top: 1px solid rgb(255 255 255 / 50%); }
.campaign .preview-terms h2 { margin: 0 0 20px; font-size: 28px; }
.campaign .social-handles { list-style: none; margin: 0; padding: 0; font-size: 17px; line-height: 1.6; }
@media (max-width: 700px) {
 .campaign .image-upload { padding: 20px; }
 .campaign .preview-actions .campaign-help { max-width: none; }
 .campaign .preview-actions .consent-row { margin: 8px 0; }
}

/* Analytics is blocked until an explicit choice; the banner does not block the form. */
[hidden]{display:none!important}
.cookie-footer{padding:16px 32px 24px}
.cookie-banner{position:fixed;z-index:20;bottom:16px;left:16px;right:16px;max-width:760px;margin:auto;padding:20px 24px;background:#fff;color:#000080;border:2px solid #000080;border-radius:9px;box-shadow:0 4px 24px #0005}
.cookie-banner h2{font-size:22px;margin:0 0 10px}
.cookie-banner p{font-size:15px;margin:0}
.cookie-actions{display:flex;gap:12px;flex-wrap:wrap}
.campaign .cookie-actions button{flex:1 1 230px;font-size:15px;min-width:0;background:#000080;color:#fff}
.cookie-banner-open{padding-bottom:270px}
.campaign .screen--holding .screen-content{max-width:620px}
.photo-preview{display:block;width:min(100%,260px);max-height:380px;object-fit:contain;margin:20px 0;border-radius:8px}
@media(max-width:600px){.cookie-banner{padding:16px;bottom:8px;left:8px;right:8px}.cookie-banner p{font-size:13px}.cookie-actions{gap:0}.campaign .cookie-actions button{margin-top:10px;flex-basis:100%}.cookie-banner-open{padding-bottom:330px}}
