:root{--red:#ff474f;--ink:#17171b;--text:#686b75;--line:#e5e6ea;--soft:#f7f8fa;--sidebar:248px}*{box-sizing:border-box}html{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#fff}body{margin:0}a{color:inherit;text-decoration:none}button,input{font:inherit}.campaign-app{min-height:100vh;display:flex;background:#fff}.campaign-sidebar{width:var(--sidebar);height:100vh;padding:25px 18px;display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;z-index:30;border-right:1px solid var(--line);background:#fafbfc}.sidebar-head{height:54px;display:flex;align-items:center;justify-content:space-between;padding:0 10px}.campaign-brand img{display:block;width:105px}.sidebar-close{display:none;border:0;background:none;font-size:27px}.sidebar-nav{display:grid;gap:8px;margin-top:34px}.sidebar-nav a,.sidebar-logout{height:49px;padding:0 14px;display:flex;align-items:center;gap:13px;border-radius:11px;color:#777b85;font-size:13px;font-weight:600;transition:.2s}.sidebar-nav a span,.sidebar-logout span{width:21px;color:#8e97a8;text-align:center;font-size:18px}.sidebar-nav a:hover,.sidebar-logout:hover{color:var(--ink);background:#f0f1f3}.sidebar-nav a.active{color:var(--red);background:#fff0f0;box-shadow:inset 3px 0 var(--red)}.sidebar-nav a.active span{color:var(--red)}.sidebar-logout{margin-top:12px}.sidebar-help{margin-top:auto;padding:18px;border:1px solid #ece8e3;border-radius:14px;background:#fff}.sidebar-help span{font-size:12px;font-weight:800}.sidebar-help p{margin:5px 0 12px;color:var(--text);font-size:11px;line-height:1.5}.sidebar-help a{color:var(--red);font-size:11px;font-weight:800}.campaign-shell{width:calc(100% - var(--sidebar));min-height:100vh;margin-left:var(--sidebar);display:flex;flex-direction:column}.campaign-header{height:76px;padding:0 34px;display:flex;align-items:center;justify-content:flex-end;border-bottom:1px solid var(--line);background:rgba(255,255,255,.96)}.menu-toggle{display:none;border:0;background:none}.menu-toggle span{width:23px;height:2px;margin:5px;display:block;background:var(--ink)}.header-actions{display:flex;align-items:center;gap:13px}.support-email,.wallet-chip,.user-chip{min-height:42px;padding:0 17px;display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:24px;background:#fff;font-size:12px;font-weight:650}.wallet-chip{color:#fff;background:#17171b;border-color:#17171b}.user-chip{padding-left:6px;border-color:transparent}.avatar{width:31px;height:31px;display:grid;place-items:center;border-radius:50%;color:var(--red);background:#fff0ef;font-weight:800}.campaign-main{width:min(calc(100% - 60px),1100px);margin:0 auto;padding:70px 0 65px}.campaign-heading{max-width:720px}.campaign-kicker{margin:0 0 12px;color:var(--red);text-transform:uppercase;letter-spacing:.14em;font-size:10px;font-weight:800}.campaign-heading h1{margin:0 0 17px;font-size:43px;line-height:1.03;letter-spacing:-.04em}.campaign-heading>p:last-child{margin:0;color:var(--text);font-size:14px;line-height:1.65}.campaign-entry-card{margin-top:42px;padding:28px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 18px 48px rgba(27,29,36,.08)}.entry-card-top{margin-bottom:25px;display:flex;align-items:center;justify-content:space-between}.entry-card-top>div{display:flex;align-items:center;gap:9px;font-size:13px}.google-dot{width:13px;height:13px;border-radius:50%;background:conic-gradient(#4285f4 0 25%,#34a853 0 50%,#fbbc04 0 75%,#ea4335 0)}.safe-badge{padding:6px 10px;border-radius:20px;color:#16804b;background:#eaf8f0;font-size:10px;font-weight:750}.campaign-entry-card label{display:block;margin-bottom:9px;font-size:12px;font-weight:750}.video-input-row{display:grid;grid-template-columns:1fr 175px;gap:13px}.video-input-wrap{height:62px;display:flex;align-items:center;border:1px solid #dfe1e6;border-radius:12px;background:#fff;transition:.2s}.video-input-wrap:focus-within{border-color:var(--red);box-shadow:0 0 0 3px rgba(255,71,79,.1)}.youtube-icon{width:50px;color:var(--red);text-align:center;font-size:17px}.video-input-wrap input{width:100%;height:100%;padding:0 18px 0 0;border:0;outline:0;color:var(--ink);background:transparent;font-size:14px}.video-input-wrap input.invalid{color:#c7272f}.video-input-row button{border:0;border-radius:12px;color:#fff;background:var(--red);cursor:pointer;font-size:13px;font-weight:800;box-shadow:0 12px 25px rgba(255,71,79,.23);transition:.2s}.video-input-row button:hover{transform:translateY(-2px);box-shadow:0 17px 30px rgba(255,71,79,.3)}.video-input-row button span{margin-left:7px;font-size:18px}.form-error{min-height:18px;margin:8px 0 0;color:#c7272f;font-size:11px}.input-help{margin:2px 0 0;color:#92959e;font-size:10px}.campaign-benefits{margin-top:25px;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.campaign-benefits article{padding:18px;display:flex;gap:13px;border:1px solid var(--line);border-radius:13px;background:#fafafa}.campaign-benefits article>span{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;color:var(--red);background:#fff0ef;font-weight:800}.campaign-benefits strong{display:block;font-size:12px}.campaign-benefits p{margin:4px 0 0;color:var(--text);font-size:10px;line-height:1.5}.campaign-steps{margin-top:65px;padding-top:29px;display:grid;grid-template-columns:1fr 80px 1fr 80px 1fr;align-items:start;border-top:1px solid var(--line)}.step{display:flex;gap:13px}.step>span{width:31px;height:31px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;color:#fff;background:#c7cad1;font-size:11px;font-weight:800}.step.active>span{background:var(--red);box-shadow:0 7px 16px rgba(255,71,79,.25)}.step strong{font-size:12px}.step p{margin:4px 0 0;color:var(--text);font-size:10px;line-height:1.5}.step-line{height:1px;margin-top:15px;background:#dfe1e6}.campaign-footer{margin-top:auto;padding:20px 34px;display:flex;justify-content:space-between;border-top:1px solid var(--line);background:#fafbfc;color:#858993;font-size:10px}.campaign-footer p{margin:0}.campaign-footer div{display:flex;gap:22px}.sidebar-overlay{display:none;position:fixed;inset:0;z-index:25;background:rgba(20,20,22,.42)}
@media(max-width:900px){.campaign-sidebar{transform:translateX(-100%);transition:transform .25s}.campaign-sidebar.open{transform:translateX(0)}.sidebar-close{display:block}.campaign-shell{width:100%;margin-left:0}.campaign-header{justify-content:space-between}.menu-toggle{display:block}.sidebar-overlay.show{display:block}.campaign-main{width:min(calc(100% - 36px),760px);padding-top:45px}.campaign-heading h1{font-size:37px}.support-email{display:none}.campaign-benefits{grid-template-columns:1fr}.campaign-steps{grid-template-columns:1fr;gap:18px}.step-line{display:none}}
@media(max-width:600px){.campaign-header{height:68px;padding:0 15px}.wallet-chip{padding:0 13px}.user-chip>span:last-child{display:none}.campaign-main{width:calc(100% - 28px);padding:35px 0 50px}.campaign-heading h1{font-size:34px}.campaign-entry-card{padding:19px}.entry-card-top{align-items:flex-start;gap:12px;flex-direction:column}.video-input-row{grid-template-columns:1fr}.video-input-row button{min-height:54px}.campaign-footer{padding:20px;gap:13px;align-items:center;flex-direction:column}.campaign-footer div{gap:15px}}

/* Prominent campaign progress */
.campaign-steps{margin-top:55px;padding:25px 24px;display:grid;grid-template-columns:1fr 70px 1fr 70px 1fr;align-items:center;border:1px solid #ffd7d5;border-radius:16px;background:linear-gradient(105deg,#fff8f7,#fff 52%,#fffaf0);box-shadow:0 16px 36px rgba(34,28,24,.08)}
.step{min-height:70px;padding:10px;display:flex;align-items:center;gap:14px;border-radius:12px;transition:background .2s,transform .2s}
.step:hover{background:#fff;transform:translateY(-2px)}
.step>span{width:42px;height:42px;display:grid;place-items:center;flex:0 0 auto;border:2px solid #fff;border-radius:50%;color:#777d89;background:#e6e8ed;box-shadow:0 5px 14px rgba(25,28,35,.1);font-size:13px;font-weight:800}
.step.active{background:#fff}
.step.active>span{color:#fff;background:var(--red);box-shadow:0 9px 20px rgba(255,71,79,.3)}
.step strong{display:block;font-size:13px}
.step p{margin:5px 0 0;color:var(--text);font-size:10px;line-height:1.5}
.step-line{height:3px;margin-top:0;border-radius:4px;background:linear-gradient(90deg,var(--red),#ffc3bf)}
@media(max-width:900px){.campaign-steps{grid-template-columns:1fr;gap:10px;padding:18px}.step{background:#fff}.step-line{display:none}}

/* Campaign setup state */
.campaign-setup-body {
    background: #f6f7fb;
}

.campaign-app-setup {
    background: #f6f7fb;
}

.campaign-app-setup .campaign-shell {
    background: linear-gradient(180deg, #ffffff 0%, #f6f7fb 100%);
}

.campaign-setup-main {
    width: min(1240px, calc(100% - 60px));
    margin: 0 auto;
    padding: 30px 0 36px;
}

.campaign-link-card,
.campaign-preview-card,
.campaign-views-card,
.campaign-config-card {
    border: 1px solid var(--line);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 18px 40px rgba(27, 31, 41, .06);
}

.campaign-link-card {
    padding: 18px 20px;
}

.campaign-link-pill {
    height: 70px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 18px;
    border: 1px solid #e5e7ef;
    border-radius: 20px;
    background: #fbfcff;
}

.campaign-link-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: #ffedf0;
}

.campaign-link-icon span {
    width: 20px;
    height: 14px;
    display: block;
    border-radius: 4px;
    background: #ff1a1a;
    position: relative;
}

.campaign-link-icon span::after {
    content: "";
    position: absolute;
    inset: 3px 7px 3px 7px;
    border-left: 6px solid #fff;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
}

.campaign-link-pill input {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--ink);
    font-size: 14px;
}

.campaign-setup-grid {
    margin-top: 18px;
    display: grid;
    grid-template-columns: 420px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
}

.campaign-preview-panel {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.campaign-preview-card {
    padding: 16px;
}

.campaign-preview-thumb {
    overflow: hidden;
    aspect-ratio: 16 / 10;
    border-radius: 18px;
    background: #111;
}

.campaign-preview-thumb img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.campaign-preview-title {
    margin: 14px 0 2px;
    font-size: 14px;
    line-height: 1.45;
    font-weight: 700;
}

.campaign-views-card {
    min-height: 172px;
    display: grid;
    place-items: center;
    padding: 20px;
    text-align: center;
    background: #f7f9fc;
}

.campaign-views-icon {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: var(--red);
    background: #fff1f1;
    font-size: 18px;
}

.campaign-views-card strong {
    margin-top: 8px;
    color: var(--red);
    font-size: 28px;
    line-height: 1;
}

.campaign-views-card span:last-child {
    margin-top: 5px;
    color: var(--text);
    font-size: 12px;
}

.campaign-config-stack {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.campaign-config-card {
    padding: 18px 20px;
}

.campaign-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.campaign-card-head h2 {
    margin: 0;
    font-size: 16px;
    line-height: 1.2;
}

.campaign-provider {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    border-radius: 999px;
    background: #edf3ff;
    color: #3b5bd6;
    font-size: 11px;
    font-weight: 800;
}

.provider-mark {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    background: conic-gradient(#4285f4 0 25%, #34a853 0 50%, #fbbc04 0 75%, #ea4335 0);
}

.campaign-budget-value {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 20px;
    font-weight: 800;
}

.campaign-budget-range {
    width: 100%;
    margin-top: 12px;
    accent-color: var(--red);
}

.campaign-budget-actions {
    margin-top: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.campaign-step-btn {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 8px;
    background: #24262d;
    color: #fff;
    cursor: pointer;
    font-size: 20px;
    line-height: 1;
}

.campaign-budget-note {
    margin: 0;
    color: var(--red);
    font-size: 12px;
    font-weight: 700;
}

.required-star {
    color: var(--red);
    font-weight: 800;
}

.campaign-token-field {
    min-height: 56px;
    padding: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    border: 1px solid #e2e6ef;
    border-radius: 18px;
    background: #fbfcff;
}

.campaign-token {
    padding: 7px 12px;
    border-radius: 999px;
    border: 1px solid #8ab0ff;
    background: #edf3ff;
    color: #3f6df4;
    font-size: 12px;
    font-weight: 800;
}

.campaign-token-input {
    min-width: 180px;
    flex: 1;
    border: 0;
    outline: 0;
    background: transparent;
    font-size: 13px;
}

.campaign-field-note {
    margin: 8px 0 0;
    color: var(--text);
    font-size: 11px;
    line-height: 1.55;
}

.campaign-select {
    width: 100%;
    min-height: 54px;
    padding: 0 16px;
    border: 1px solid #e2e6ef;
    border-radius: 18px;
    background: #fff;
    color: var(--ink);
    font-size: 14px;
}

.campaign-keyword-select {
    min-height: 120px;
    padding: 12px 14px;
}

.campaign-keyword-hint {
    margin-top: 8px;
    color: var(--text);
    font-size: 11px;
    line-height: 1.55;
}

.campaign-wallet-warning {
    margin: 4px 0 0;
    color: var(--red);
    font-size: 12px;
    line-height: 1.55;
}

.campaign-submit-row {
    margin-top: 10px;
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.campaign-primary-btn,
.campaign-secondary-btn {
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    border-radius: 999px;
    font-weight: 800;
}

.campaign-primary-btn {
    border: 0;
    background: #2b0f12;
    color: #fff;
    box-shadow: 0 12px 24px rgba(43, 15, 18, .22);
}

.campaign-secondary-btn {
    border: 1px solid #4c393b;
    color: #4c393b;
    background: #fff;
}

@media (max-width: 1080px) {
    .campaign-setup-main {
        width: min(calc(100% - 36px), 1000px);
    }

    .campaign-setup-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .campaign-setup-main {
        width: calc(100% - 28px);
        padding: 16px 0 48px;
    }

    .campaign-link-card,
    .campaign-preview-card,
    .campaign-config-card {
        border-radius: 16px;
    }

    .campaign-link-pill {
        height: auto;
        padding: 14px;
        align-items: flex-start;
    }

    .campaign-preview-panel {
        gap: 12px;
    }

    .campaign-card-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .campaign-submit-row {
        flex-direction: column;
        align-items: stretch;
    }

    .campaign-primary-btn,
    .campaign-secondary-btn {
        width: 100%;
    }
}