/* Round 4: the three talking points, the Discover competitor card, and the seven tool replicas.
   Inside each .screen the tool's own look rules: system fonts, its colours, its layout. Ours stays outside.
   The only thing of ours inside a screen is .mia-mark. */

/* three talking points */
.three{padding:72px 0 40px;border-top:1px solid var(--border)}
.tp{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.tp>div{padding:34px 28px 34px 0;border-right:1px solid var(--border);display:flex;flex-direction:column;gap:10px}
.tp>div:not(:first-child){padding-left:28px}.tp>div:last-child{border-right:0;padding-right:0}
.tp .n{font:800 56px/1 var(--sans);letter-spacing:-.05em;color:var(--fg)}.tp .n::after{content:"";display:inline-block;width:12px;height:12px;border-radius:50%;background:var(--primary);margin-left:6px;vertical-align:baseline}
.tp h3{font-size:24px;letter-spacing:-.025em;line-height:1.1}.tp p{margin:0;color:var(--muted-fg);font-size:15px}
@media(max-width:820px){.tp{grid-template-columns:1fr}.tp>div{border-right:0;border-bottom:1px solid var(--border);padding:24px 0}.tp>div:not(:first-child){padding-left:0}}

/* competitor card in the wave */
.pc.cmp{width:300px}.pc.cmp>div{width:100%}
.pc.cmp .row{display:flex;justify-content:space-between;padding:6px 0;border-top:1px solid var(--border);font-size:13px}
.pc.cmp .row:first-of-type{margin-top:8px}
.pc.cmp .row i{font:500 12px var(--mono);color:var(--accent-fg)}

/* tools section shell */
.tools{padding:110px 0 100px;border-top:1px solid var(--border)}
.tools h2{margin:16px 0 0}
.tool{padding:64px 0}.tool+.tool{border-top:1px solid var(--border)}
.tool-row{display:grid;grid-template-columns:300px 1fr;gap:48px;align-items:center}
.tool-copy h3{font-size:26px;letter-spacing:-.025em;line-height:1.1;margin:10px 0 12px}
.tool-copy p{margin:0 0 10px;color:var(--muted-fg);font-size:15px}
.tool-copy .said{font:italic 15px var(--serif);color:var(--fg);border-left:2px solid var(--primary);padding-left:12px}
.toggle{display:inline-flex;align-items:center;gap:10px;margin-top:10px;font:500 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted-fg);cursor:pointer}
.toggle input{appearance:none;width:38px;height:22px;border-radius:999px;background:#ddd;position:relative;cursor:pointer;transition:background .2s}
.toggle input::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:left .2s}
.toggle input:checked{background:var(--primary)}.toggle input:checked::after{left:19px}
.screen{border-radius:12px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.18),0 0 0 1px rgba(0,0,0,.06);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:#202223;font-size:13px;line-height:1.4;background:#fff}
.mia-mark{display:inline-flex;align-items:center;gap:6px;background:#e11d48;color:#fff;font:600 10.5px/1 var(--sans);letter-spacing:.02em;padding:5px 9px;border-radius:999px;box-shadow:0 4px 14px rgba(225,29,72,.35);white-space:nowrap;vertical-align:middle}
.mia-mark::before{content:"";width:6px;height:6px;border-radius:50%;background:#fff}
@media(max-width:900px){.tool-row{grid-template-columns:1fr;gap:24px}}

/* 6a storefront (Dawn-like) */
.store{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;color:#121212}
.st-head{display:flex;align-items:center;gap:20px;padding:16px 26px;border-bottom:1px solid #e5e5e5;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.st-logo{font-weight:700;letter-spacing:.14em}.st-nav{color:#666}.st-cart{margin-left:auto}
.st-body{display:grid;grid-template-columns:1.1fr 1fr;gap:34px;padding:30px 26px 36px}
.st-img{background:#f6f6f6;display:grid;place-items:center;padding:20px}.st-img img{max-height:320px;object-fit:contain}
.st-crumb{font-size:11px;color:#777;text-transform:uppercase;letter-spacing:.1em}
.st-info h4{font:400 26px/1.15 "Helvetica Neue",Helvetica,Arial,sans-serif;letter-spacing:-.01em;margin:8px 0 8px}
.st-price{font-size:18px;margin-bottom:14px}
.st-line{min-height:44px;background:#fff7e6;border:1px solid #ffd27a;border-radius:4px;padding:9px 12px;font-size:13.5px;margin-bottom:14px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;transition:opacity .3s,transform .3s}
.st-line .caret{display:inline-block;width:2px;height:16px;background:#121212;animation:blink 1s infinite}
.st-line .mia-mark{margin-left:auto}
body.before .st-line{opacity:0;transform:translateY(-6px);pointer-events:none}
.st-qty{font-size:12px;color:#555;margin-bottom:10px}.st-qty span{display:inline-block;border:1px solid #121212;padding:4px 12px;margin-left:8px}
.st-btn{border:1px solid #121212;background:#fff;text-align:center;padding:12px;font-size:13px;letter-spacing:.06em;text-transform:uppercase;margin-bottom:8px}
.st-btn.pulse{animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(18,18,18,0)}50%{box-shadow:0 0 0 6px rgba(18,18,18,.12)}}
.st-btn2{background:#121212;color:#fff;text-align:center;padding:12px;font-size:13px;letter-spacing:.06em;text-transform:uppercase;margin-bottom:14px}
.st-desc{font-size:12.5px;color:#555}
@media(max-width:700px){.st-body{grid-template-columns:1fr}}

/* 6b Shopify admin (Polaris) */
.shopify{background:#f1f2f4;font-size:12.5px}
.sh-top{display:flex;align-items:center;gap:10px;background:#1a1a1a;color:#e3e3e3;padding:9px 14px}
.sh-top img{width:18px;height:18px;filter:invert(1)}.sh-name{font-weight:700;font-size:14px;margin-right:8px;color:#fff}
.sh-search{flex:1;max-width:420px;background:#303030;border-radius:8px;padding:6px 12px;color:#b5b5b5;font-size:12px}
.sh-unsaved{margin-left:auto;background:#303030;border-radius:8px;padding:6px 10px;font-size:11.5px}
.sh-btn{border:1px solid #616161;border-radius:8px;padding:5px 10px;font-size:11.5px}.sh-btn.dark{background:#fff;color:#1a1a1a;border-color:#fff;font-weight:600}
.sh-frame{display:grid;grid-template-columns:150px 1fr}
.sh-nav{background:#ebebeb;padding:14px 8px;display:flex;flex-direction:column;gap:2px;font-size:12px;color:#303030;font-weight:500}
.sh-nav span{padding:6px 10px;border-radius:8px}.sh-nav .on{background:#fff;font-weight:600}.sh-nav .sub{padding-left:26px;font-weight:400;color:#616161}.sh-nav .gap{margin-top:14px;font-size:11px;color:#616161;text-transform:none}
.sh-main{padding:18px 20px 22px}
.sh-title{font-size:15px;margin-bottom:14px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.sh-status{border-radius:8px;padding:2px 8px;font-size:11px;font-weight:500}.sh-status.draft{background:#e3e3e3;color:#303030}.sh-status.active{background:#cdfee1;color:#0c5132}
.sh-cols{display:grid;grid-template-columns:1fr 240px;gap:14px}
.sh-card{background:#fff;border-radius:12px;padding:14px 16px;box-shadow:0 1px 0 rgba(0,0,0,.05),0 0 0 1px rgba(0,0,0,.06);margin-bottom:14px}
.sh-card label{display:block;font-size:12px;font-weight:600;margin:6px 0 6px}.sh-card label:first-child{margin-top:0}
.sh-input{border:1px solid #8a8a8a;border-radius:8px;padding:7px 10px;font-size:12.5px;background:#fff}.sh-input.tall{min-height:64px;border-top-left-radius:0;border-top-right-radius:0}
.sh-toolbar{border:1px solid #8a8a8a;border-bottom:0;border-radius:8px 8px 0 0;padding:6px 10px;font-size:11.5px;color:#616161;background:#fafafa}.sh-toolbar b,.sh-toolbar i,.sh-toolbar u{margin-right:8px;color:#303030}
.sh-media{display:flex;gap:10px}.sh-media img{width:96px;height:96px;object-fit:cover;border-radius:8px;border:1px solid #e3e3e3}.sh-media span{width:60px;height:96px;border:1px dashed #b5b5b5;border-radius:8px;display:grid;place-items:center;color:#616161;font-size:20px}
.sh-price{display:flex;gap:14px;align-items:center}.sh-price span:first-child{border:1px solid #8a8a8a;border-radius:8px;padding:7px 10px;min-width:110px}
.sh-select{border:1px solid #8a8a8a;border-radius:8px;padding:7px 10px;font-size:12px;margin-bottom:8px;background:#fff}
.muted{color:#616161;font-size:12px}
@media(max-width:1100px){.sh-cols{grid-template-columns:1fr}}
@media(max-width:700px){.sh-frame{grid-template-columns:1fr}.sh-nav{display:none}}

/* 6c Facebook */
.fb{background:#f0f2f5;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:#050505}
.fb-top{display:flex;align-items:center;gap:12px;background:#fff;padding:8px 14px;border-bottom:1px solid #dddfe2}
.fb-logo{width:36px;height:36px;border-radius:50%;background:#1877f2;color:#fff;font:800 24px/36px Helvetica,Arial;text-align:center}
.fb-search{flex:1;max-width:240px;background:#f0f2f5;border-radius:999px;padding:8px 14px;color:#65676b;font-size:13px}
.fb-av{margin-left:auto;width:32px;height:32px;border-radius:50%;background:#bcc0c4}
.fb-post{background:#fff;margin:18px auto;max-width:520px;border-radius:8px;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.fb-h{display:flex;align-items:center;gap:8px;padding:12px 16px 8px}.fb-pav{width:40px;height:40px;border-radius:50%;background:#050505;color:#fff;display:grid;place-items:center;font-weight:700}
.fb-h b{display:block;font-size:14px}.fb-h span{font-size:12px;color:#65676b}.fb-dots{margin-left:auto;color:#65676b;font-weight:700}
.fb-text{padding:0 16px 10px;font-size:14.5px;line-height:1.35}
.fb-img img{width:100%;height:260px;object-fit:cover;display:block;background:#eee}
.fb-link{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#f0f2f5;padding:10px 16px}
.fb-dom{font-size:12px;color:#65676b;text-transform:uppercase;display:block}.fb-link b{display:block;font-size:15px}.fb-link span:not(.fb-dom):not(.fb-cta){font-size:13px;color:#65676b}
.fb-cta{background:#e4e6eb;border-radius:6px;padding:8px 14px;font-weight:600;font-size:14px;white-space:nowrap}
.fb-react{display:flex;justify-content:space-between;padding:10px 16px;font-size:13px;color:#65676b;border-bottom:1px solid #ced0d4;margin:0 16px}
.fb-actions{display:flex;justify-content:space-around;padding:6px 8px;font-size:14px;font-weight:600;color:#65676b}

/* 6d YouTube */
.yt{background:#fff;font-family:Roboto,Arial,sans-serif;color:#0f0f0f}
.yt-top{display:flex;align-items:center;gap:16px;padding:8px 16px}
.yt-logo{display:flex;align-items:center;gap:4px;font:700 17px/1 Roboto,Arial;letter-spacing:-.06em}.yt-logo i{width:26px;height:18px;background:#ff0033;border-radius:5px;position:relative;display:inline-block}.yt-logo i::after{content:"";position:absolute;left:10px;top:4px;border:5px solid transparent;border-left:8px solid #fff}
.yt-search{flex:1;max-width:340px;margin:0 auto;border:1px solid #ccc;border-radius:999px;padding:7px 16px;color:#888;font-size:14px}
.yt-av{width:30px;height:30px;border-radius:50%;background:#ff0033}
.yt-body{display:grid;grid-template-columns:1fr 210px;gap:18px;padding:6px 16px 18px}
.yt-player{position:relative;background:#000;border-radius:12px;overflow:hidden;height:250px}.yt-player img{width:100%;height:100%;object-fit:cover;opacity:.85}
.yt-play{position:absolute;left:50%;top:50%;width:64px;height:44px;margin:-22px 0 0 -32px;background:rgba(0,0,0,.6);border-radius:12px}.yt-play::after{content:"";position:absolute;left:26px;top:12px;border:10px solid transparent;border-left:16px solid #fff}
.yt-bar{position:absolute;left:12px;right:12px;bottom:10px;height:3px;background:rgba(255,255,255,.3)}.yt-bar i{display:block;height:100%;width:38%;background:#ff0033}
.yt-title{font:600 17px/1.3 Roboto,Arial;margin:12px 0 8px}
.yt-ch{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.yt-chav{width:38px;height:38px;border-radius:50%;background:#ddd}
.yt-ch b{display:block;font-size:14px}.yt-ch div span{font-size:12px;color:#606060}
.yt-sub{background:#0f0f0f;color:#fff;border-radius:999px;padding:8px 16px;font-weight:600;font-size:13px}
.yt-pill{background:#f2f2f2;border-radius:999px;padding:8px 14px;font-size:13px;font-weight:500}
.yt-desc{background:#f2f2f2;border-radius:12px;padding:10px 12px;font-size:13px;margin-top:12px;color:#0f0f0f}
.yt-dm{margin-top:12px;border:1px solid #e11d48;border-radius:12px;padding:12px 14px;font-size:13px;position:relative;background:#fff}
.yt-dm b{display:block;font-size:13px;margin:6px 0 4px}.yt-dm .mia-mark{position:absolute;top:-12px;right:12px}
.yt-side{display:flex;flex-direction:column;gap:10px}.yt-thumb{display:flex;gap:8px}.yt-thumb i{width:94px;height:54px;background:#e5e5e5;border-radius:8px;flex:0 0 94px}
.yt-thumb b{display:block;font-size:12px;line-height:1.25;font-weight:500}.yt-thumb span{font-size:11px;color:#606060}
@media(max-width:700px){.yt-body{grid-template-columns:1fr}.yt-side{display:none}}

/* 6e Google */
.google{background:#fff;font-family:Arial,Helvetica,sans-serif;color:#1f1f1f;padding-bottom:20px}
.g-top{display:flex;align-items:center;gap:22px;padding:14px 22px 8px}
.g-logo{font:700 26px/1 "Product Sans",Arial,sans-serif;letter-spacing:-.03em}.g-logo .b1{color:#4285f4}.g-logo .b2{color:#ea4335}.g-logo .b3{color:#fbbc05}.g-logo .b4{color:#34a853}
.g-search{flex:1;max-width:560px;border:1px solid #dfe1e5;border-radius:999px;padding:11px 18px;font-size:15px;box-shadow:0 1px 6px rgba(32,33,36,.18);display:flex;justify-content:space-between}
.g-tabs{display:flex;gap:22px;padding:8px 22px 0 138px;border-bottom:1px solid #ebebeb;font-size:13px;color:#5f6368}.g-tabs span{padding-bottom:10px}.g-tabs .on{color:#1f1f1f;border-bottom:3px solid #1f1f1f}
.g-ad,.g-org{padding:18px 22px 6px 138px;max-width:760px}
.g-spons{font-size:13px;font-weight:700;color:#1f1f1f;margin-bottom:8px;display:flex;gap:10px;align-items:center}
.g-src{display:flex;align-items:center;gap:10px;margin-bottom:4px}.g-fav{width:26px;height:26px;border-radius:50%;background:#e8f0fe;color:#1a0dab;display:grid;place-items:center;font-weight:700;font-size:13px}.g-fav.g{background:#fee;color:#d33}
.g-src b{display:block;font-size:14px;font-weight:400}.g-src span{font-size:12px;color:#4d5156}
.g-h{font-size:20px;color:#1a0dab;line-height:1.3;margin:2px 0 4px}.g-h.dim{color:#1a0dab;opacity:.75}
.g-d{font-size:14px;color:#4d5156;line-height:1.5}.g-d.dim{opacity:.7}
@media(max-width:700px){.g-tabs,.g-ad,.g-org{padding-left:22px}}

/* 6f TikTok */
.tiktok{background:transparent;box-shadow:none;display:grid;place-items:center;padding:10px 0}
.tk-phone{position:relative;width:300px;height:620px;border-radius:38px;background:#000;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.35),0 0 0 8px #111,0 0 0 9px #333;font-family:-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:#fff}
.tk-phone>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tk-tabs{position:absolute;top:44px;left:0;right:0;display:flex;justify-content:center;gap:22px;font-size:16px;font-weight:600;color:#ffffffaa;text-shadow:0 1px 4px #000;z-index:2}.tk-tabs .on{color:#fff;border-bottom:2px solid #fff;padding-bottom:4px}
.tk-rail{position:absolute;right:10px;bottom:120px;display:flex;flex-direction:column;gap:16px;align-items:center;z-index:2;font-size:22px;text-shadow:0 1px 4px #000}
.tk-rail span{display:flex;flex-direction:column;align-items:center;gap:2px}.tk-rail b{font-size:11px;font-weight:600}
.tk-av{width:44px;height:44px;border-radius:50%;background:#ddd;border:2px solid #fff;position:relative}.tk-av i{position:absolute;left:50%;bottom:-9px;transform:translateX(-50%);width:18px;height:18px;border-radius:50%;background:#fe2c55;font:700 13px/18px Arial;text-align:center;font-style:normal}
.tk-disc{width:40px;height:40px;border-radius:50%;background:radial-gradient(circle,#333 30%,#111 31%,#111 60%,#444 61%);animation:spin2 4s linear infinite}
@keyframes spin2{to{transform:rotate(360deg)}}
.tk-cap{position:absolute;left:12px;right:70px;bottom:78px;z-index:2;text-shadow:0 1px 6px #000;font-size:13px;line-height:1.35}.tk-cap b{display:block;font-size:15px;margin-bottom:4px}.tk-cap span{display:block}.tk-sound{margin-top:8px;font-size:12px}
.tk-bar{position:absolute;left:0;right:0;bottom:0;height:64px;background:#000;display:flex;justify-content:space-around;align-items:center;font-size:10px;color:#fff;z-index:2;padding-bottom:10px}
.tk-plus{width:42px;height:28px;border-radius:8px;background:#fff;color:#000;font:700 22px/28px Arial;text-align:center;box-shadow:-3px 0 0 #25f4ee,3px 0 0 #fe2c55}
.float-mark{position:absolute;top:80px;left:12px;z-index:3}

/* 6g Klaviyo */
.kl{display:grid;grid-template-columns:44px 1fr;background:#fff;font-family:-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:#1f1f1f;font-size:12.5px}
.kl-side{background:#fff;border-right:1px solid #e6e6e6;display:flex;flex-direction:column;align-items:center;gap:16px;padding-top:16px}.kl-side i{width:18px;height:18px;border-radius:5px;background:#e6e6e6}.kl-side i:first-child{background:#1f1f1f;border-radius:4px}
.kl-main{padding:16px 22px 22px}
.kl-back{color:#2f65ff;font-size:12.5px;margin-bottom:12px}
.kl-cols{display:grid;grid-template-columns:230px 1fr;gap:22px}
.kl-left h4{font:600 17px/1.25 inherit;margin:0 0 8px}.kl-left p{color:#555;margin:0 0 12px;font-size:12px}
.kl-left label{display:block;font-size:12px;font-weight:600;margin:10px 0 4px}
.kl-chip{display:inline-block;border:1px solid #d0d0d0;border-radius:6px;padding:5px 8px;font-size:12px;background:#f7f7f7}
.kl-field{border:1px solid #d0d0d0;border-radius:6px;padding:6px 10px;font-size:12px}
.kl-btns{display:flex;gap:8px;margin:16px 0 12px}.kl-launch{background:#1f1f1f;color:#fff;border-radius:6px;padding:7px 14px;font-weight:600}.kl-btn{border:1px solid #d0d0d0;border-radius:6px;padding:7px 12px}
.kl-prev{background:#f7f7f7;border-radius:10px;padding:14px;border:1px solid #ececec}
.kl-meta{display:grid;grid-template-columns:90px 1fr;gap:4px 10px;font-size:11.5px;margin-bottom:12px}.kl-meta span{color:#777}.kl-meta b{font-weight:500}
.kl-mail{background:#fff;border:1px solid #e6e6e6;padding:22px;text-align:center}.kl-brand{font:700 11px/1 Arial;letter-spacing:.2em;margin-bottom:14px}
.kl-mail h5{font:700 20px/1.2 Georgia,serif;margin:0 0 10px}.kl-mail p{font:14px/1.5 Georgia,serif;color:#333;margin:0 0 14px}
.kl-cta{display:inline-block;background:#1f1f1f;color:#fff;padding:9px 18px;font-size:12px;font-weight:600}
@media(max-width:700px){.kl-cols{grid-template-columns:1fr}}
