:root {
  --ink: #182e26;
  --forest: #1e4535;
  --green: #c7e77c;
  --lime: #d9fb86;
  --cream: #f7f4ec;
  --paper: #fffdf8;
  --clay: #edb59e;
  --muted: #708078;
  --line: rgba(24, 46, 38, .10);
  --soft-shadow: 0 22px 60px rgba(28, 47, 38, .12), 0 3px 10px rgba(28, 47, 38, .06);
  font-family: "DM Sans", sans-serif;
  color: var(--ink);
  background: var(--cream);
}

* { box-sizing: border-box; }
body { margin: 0; min-height: 100dvh; background: radial-gradient(circle at 74% 18%, rgba(213, 243, 142, .46), transparent 25rem), var(--cream); }
button, input, textarea { font: inherit; }
button { cursor: pointer; border: 0; color: inherit; }
.grain { position: fixed; z-index: 5; inset: 0; pointer-events: none; opacity: .045; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.72'/%3E%3C/svg%3E"); }

.app-shell { min-height: 100dvh; max-width: 1220px; margin: auto; display: grid; grid-template-columns: 1fr 490px; align-items: center; gap: 100px; padding: 60px 42px; }
.desktop-intro { max-width: 520px; animation: float-up .85s cubic-bezier(.32,.72,0,1) both; }
.eyebrow, .mini-label { text-transform: uppercase; letter-spacing: .18em; font: 500 10px "DM Mono", monospace; }
.eyebrow { display: flex; align-items: center; gap: 9px; color: var(--forest); }
.eyebrow span { width: 7px; height: 7px; border-radius: 50%; background: #f36946; }
h1 { margin: 22px 0 24px; max-width: 540px; font-size: clamp(46px, 5vw, 76px); letter-spacing: -.075em; line-height: .94; }
h1 em { font-family: "Playfair Display", serif; font-weight: 600; letter-spacing: -.075em; }
.desktop-intro > p { color: #53645b; max-width: 410px; line-height: 1.55; font-size: 17px; }
.intro-steps { margin-top: 52px; border-top: 1px solid var(--line); display: grid; gap: 14px; padding-top: 17px; }
.intro-steps div { display: flex; gap: 18px; align-items: center; }
.intro-steps b { color: #f36946; font: 500 11px "DM Mono", monospace; }
.intro-steps span { font-size: 13px; line-height: 1.25; }

.phone-wrap { animation: float-up .9s .14s cubic-bezier(.32,.72,0,1) both; }
.phone-bezel { padding: 10px; border-radius: 48px; background: #d4d4ce; box-shadow: 0 42px 80px rgba(26, 47, 36, .22), inset 0 1px 1px rgba(255,255,255,.8); }
.phone { width: 470px; height: min(800px, calc(100dvh - 96px)); min-height: 600px; overflow: auto; scrollbar-width: none; position: relative; border-radius: 40px; background: var(--paper); box-shadow: inset 0 0 0 1px rgba(24,46,38,.08); }
.phone::-webkit-scrollbar { display: none; }
.screen { min-height: 100%; padding: 30px 25px 34px; display: flex; flex-direction: column; animation: screen-in .48s cubic-bezier(.32,.72,0,1) both; }
.top-row { display: flex; align-items: center; justify-content: space-between; min-height: 34px; }
.wordmark { display: flex; align-items: center; gap: 7px; font-weight: 700; letter-spacing: -.055em; font-size: 16px; }
.wordmark .brand-mark { width: 28px; height: 28px; object-fit: contain; flex: 0 0 auto; }
.icon-button { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: #eef0e8; font-size: 21px; transition: transform .45s cubic-bezier(.32,.72,0,1), background .45s cubic-bezier(.32,.72,0,1); }
.icon-button:hover { transform: rotate(-9deg) scale(1.05); background: var(--lime); }
.back { font-size: 21px; background: none; padding: 0; }

.welcome { padding-top: 57px; }
.welcome .mini-label { color: #e66d4a; }
.welcome h2, .screen-title { font-size: 39px; letter-spacing: -.065em; line-height: .98; margin: 13px 0; }
.welcome h2 em { font-family: "Playfair Display", serif; font-weight: 600; }
.welcome p { color: var(--muted); margin: 0; line-height: 1.5; max-width: 320px; }

.soko-home { padding-top:25px; background:radial-gradient(circle at 104% -2%,rgba(235,177,84,.18),transparent 36%),#fff9eb; }
.soko-home .top-row { align-items:flex-start; }.soko-home .wordmark { margin-left:-4px; font-size:20px; }.soko-home .wordmark .brand-mark { width:31px;height:31px; }.soko-home .icon-button { width:33px;height:33px;background:transparent;color:#50310e; }
.brand-intro { margin:15px 0 25px 39px;display:flex;justify-content:space-between;align-items:flex-start; }.intro-kicker { display:block;margin-bottom:5px;color:#a5672b;font:500 7px "DM Mono",monospace;letter-spacing:.15em;text-transform:uppercase; }.brand-intro b { display:block;color:#513113;font-size:22px;font-weight:650;line-height:.97;letter-spacing:-.07em; }.brand-intro small { display:flex;align-items:center;gap:5px;color:#836745;margin-top:11px;font-size:9px; }.brand-intro small span { color:#1f7244;font-size:7px; }.brand-intro small strong { color:#bf5712; }.notify { margin:5px 5px 0 0;color:#57401d;font-size:19px; }
.home-grid { display:grid;grid-template-columns:1fr 1fr;gap:12px; }.home-tile { min-height:174px;padding:15px;position:relative;overflow:hidden;border-radius:25px;text-align:left;color:#fffdf3;box-shadow:inset 0 1px 1px rgba(255,255,255,.2),0 9px 17px rgba(83,49,13,.13);transition:transform .45s cubic-bezier(.32,.72,0,1),box-shadow .45s cubic-bezier(.32,.72,0,1);isolation:isolate; }.home-tile:before,.home-tile:after { content:"";position:absolute;pointer-events:none; }.home-tile:before { z-index:-1;right:-22px;bottom:-25px;width:114px;height:114px;opacity:.25;transform:rotate(45deg);background:repeating-linear-gradient(90deg,transparent 0 12px,rgba(255,255,255,.62) 12px 16px,transparent 16px 25px),repeating-linear-gradient(0deg,transparent 0 12px,rgba(255,255,255,.62) 12px 16px,transparent 16px 25px);mask-image:linear-gradient(135deg,#000 0 50%,transparent 50%); }.home-tile:after { z-index:-1;left:-25px;top:-36px;width:113px;height:113px;border:1px solid rgba(255,255,255,.35);border-radius:48% 52% 46% 54%;box-shadow:0 0 0 17px rgba(255,255,255,.055),0 0 0 34px rgba(255,255,255,.045); }.home-tile:hover { transform:translateY(-4px) rotate(-.45deg);box-shadow:inset 0 1px 1px rgba(255,255,255,.22),0 18px 27px rgba(77,48,12,.18); }.home-tile:active { transform:scale(.98); }
.tile-icon { position:relative;z-index:1;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:rgba(255,251,241,.96);color:var(--tile);box-shadow:inset 0 1px 1px rgba(255,255,255,.72),0 5px 10px rgba(23,24,12,.1); }.tile-icon svg { width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2.35;stroke-linecap:round;stroke-linejoin:round; }.home-tile b { position:relative;z-index:1;display:block;margin-top:21px;font-size:16px;letter-spacing:-.055em;line-height:.95;text-transform:capitalize; }.home-tile small { position:relative;z-index:1;display:block;margin-top:7px;font-size:10px;line-height:1.22;opacity:.9; }.tile-arrow { position:absolute;z-index:1;right:14px;bottom:14px;width:29px;height:29px;display:grid;place-items:center;border-radius:50%;background:rgba(37,28,11,.23);font-size:28px;font-weight:300;line-height:1;transition:transform .45s cubic-bezier(.32,.72,0,1),background .45s cubic-bezier(.32,.72,0,1); }.home-tile:hover .tile-arrow { transform:translate(2px,-2px);background:rgba(37,28,11,.34); }
.tile-brand { --tile:#1a5736;background:radial-gradient(circle at 100% 0,rgba(83,166,83,.38),transparent 43%),linear-gradient(145deg,#174830,#1d6a41); }.tile-page { --tile:#c9570a;background:radial-gradient(circle at 12% 110%,rgba(251,188,74,.28),transparent 48%),linear-gradient(145deg,#c75208,#e37b0b); }.tile-print { --tile:#623a8a;background:radial-gradient(circle at 100% 8%,rgba(190,139,226,.28),transparent 40%),linear-gradient(145deg,#4d2c75,#79519e); }.tile-products { --tile:#c27500;background:radial-gradient(circle at 5% 100%,rgba(255,239,125,.32),transparent 42%),linear-gradient(145deg,#d18400,#e8aa08); }
.home-footer { margin-top:auto;padding-top:24px;display:flex;align-items:center;justify-content:space-between;color:#775f3e;font-size:10px; }.home-footer button { display:flex;align-items:center;gap:5px;padding:8px 9px 8px 11px;border-radius:14px;background:#efe1c7;color:#8a4a13;font-size:10px;font-weight:700; }.home-footer button span { font-size:13px;line-height:0; }
.starter-card { margin-top: 39px; min-height: 215px; padding: 20px; border-radius: 29px; color: #f8f7ef; position: relative; overflow: hidden; background: var(--forest); box-shadow: inset 0 1px 1px rgba(255,255,255,.15); }
.starter-card:after { content:""; position:absolute; width: 235px; height: 235px; right: -63px; bottom: -108px; border: 1px solid rgba(218,251,134,.55); border-radius: 48% 52% 47% 53%; transform: rotate(28deg); box-shadow: 0 0 0 27px rgba(218,251,134,.08), 0 0 0 54px rgba(218,251,134,.06); }
.starter-card small { font: 500 10px "DM Mono", monospace; letter-spacing: .12em; text-transform: uppercase; color: var(--green); }
.starter-card strong { display: block; max-width: 195px; font-size: 26px; letter-spacing: -.06em; line-height: 1; margin-top: 11px; }
.starter-card span { position: absolute; z-index: 1; bottom: 18px; left: 20px; display: grid; place-items: center; width: 39px; height: 39px; border-radius: 50%; background: var(--lime); color: var(--forest); }
.cta { min-height: 59px; width: 100%; border-radius: 999px; margin-top: auto; padding: 6px 7px 6px 23px; display: flex; align-items: center; justify-content: space-between; color: #f9faed; background: var(--forest); font-weight: 600; transition: transform .45s cubic-bezier(.32,.72,0,1), box-shadow .45s cubic-bezier(.32,.72,0,1); }
.cta:hover { transform: translateY(-3px); box-shadow: 0 12px 25px rgba(30,69,53,.22); }
.cta:active { transform: scale(.98); }
.cta .arrow { width: 45px; height: 45px; border-radius: 50%; display: grid; place-items: center; background: var(--lime); color: var(--forest); font-size: 20px; transition: transform .45s cubic-bezier(.32,.72,0,1); }
.cta:hover .arrow { transform: translate(2px,-2px) scale(1.04); }
.secondary { margin-top: 12px; background: #edf0e8; color: var(--forest); }
.secondary .arrow { background: #fffdf8; }

.progress { margin: 26px 0 30px; display: flex; gap: 5px; }
.progress i { height: 4px; flex: 1; border-radius: 4px; background: #e5e5dc; }
.progress i.on { background: #e66d4a; }
.field-label { font-size: 12px; font-weight: 600; margin: 18px 0 8px; }
.text-field { width: 100%; border: 0; outline: 0; border-radius: 18px; padding: 18px 17px; background: #f1f1e9; color: var(--ink); font-size: 15px; transition: box-shadow .45s cubic-bezier(.32,.72,0,1), background .45s cubic-bezier(.32,.72,0,1); }
.text-field:focus { background: #fffef9; box-shadow: 0 0 0 2px var(--green); }
.style-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 11px; }
.style-card { text-align:left; min-height: 97px; padding: 14px; border-radius: 22px; background: #edf0e8; position: relative; overflow: hidden; transition: transform .45s cubic-bezier(.32,.72,0,1), box-shadow .45s cubic-bezier(.32,.72,0,1); }
.style-card::after { content:""; position:absolute; width: 69px; height: 69px; border-radius: 40% 60% 43% 57%; right: -17px; bottom: -20px; background: var(--shape, #e7b29d); }
.style-card b { position: relative; z-index: 1; font-size: 14px; letter-spacing: -.035em; }
.style-card.active { background: var(--forest); color: #fffdf8; box-shadow: 0 10px 24px rgba(30,69,53,.17); transform: translateY(-2px); }
.style-card.active:before { content: "✓"; position: absolute; right: 12px; top: 10px; z-index: 1; width: 20px; height: 20px; display:grid; place-items:center; border-radius:50%; background: var(--lime); color:var(--forest); font-size:12px; font-weight:bold; }
.choose-me { margin-top: 14px; padding: 14px; width: 100%; text-align: left; border-radius: 16px; background: #f8e7d9; color: #914b35; font-size: 13px; font-weight: 600; }

.ref-onboarding { padding-top:25px; background:#fff9ed; }.ref-onboarding .wordmark { position:absolute; left:75px; top:34px; opacity:0; }.ref-onboarding .top-row { justify-content:flex-start; }.stepper { margin:17px 16px 0; display:flex; align-items:center; gap:9px; }.stepper span { width:20px; height:20px; border-radius:50%; display:grid; place-items:center; background:#f1ede3; color:#9d927e; font:500 10px "DM Mono"; }.stepper span.active { background:#1e603d;color:#fff; }.stepper i { height:1px; flex:1; background:#d8d0c1; }.step-copy { margin: -16px 0 18px 48px; font-size:9px; color:#356846; }.ref-title { margin:0; font-size:20px; letter-spacing:-.045em; }.ref-onboarding .section-note { margin:4px 0 12px; font-size:10px; }.details-card { padding:5px; border-radius:14px; background:#fffefa; box-shadow:0 4px 13px rgba(65,43,18,.09); }.ref-field { min-height:45px; display:flex; align-items:center; gap:10px; padding:5px 9px; border-bottom:1px solid #eee9df; }.ref-field:last-child { border-bottom:0; }.ref-field > i { width:23px; color:#1e603d; font-style:normal; font-size:15px; text-align:center; }.ref-field:nth-child(2) > i,.ref-field:nth-child(4) > i { color:#d66b12; }.ref-field:nth-child(5) > i { color:#70448f; }.ref-field span { flex:1; color:#7f7464; font-size:8px; line-height:1.1; }.ref-field em { font-style:normal; opacity:.7; }.ref-field input { display:block; margin-top:3px; width:100%; padding:0; border:0; outline:0; color:#2e281d; background:transparent; font-size:11px; }.style-panel { margin-top:10px; padding:12px; border-radius:14px; background:#fffefa; box-shadow:0 4px 13px rgba(65,43,18,.07); }.style-panel > b { display:block; font-size:12px; }.style-panel > small { display:block;margin:3px 0 9px;color:#887b68;font-size:8px; }.compact-style-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; }.compact-style { min-height:55px; padding:5px 3px; border-radius:8px; color:#3b3328; background:#fff; box-shadow:inset 0 0 0 1px #efede7; transition:transform .4s cubic-bezier(.32,.72,0,1),box-shadow .4s cubic-bezier(.32,.72,0,1); }.compact-style i { display:block; color:var(--style-color); font-style:normal; font-size:19px; height:25px; }.compact-style span { display:block;font-size:8px; }.compact-style.active { box-shadow:inset 0 0 0 1px #1e603d;background:#f1f7e9;transform:translateY(-1px); }.ref-onboarding .choose-me { margin-top:8px; padding:8px; text-align:center; border-radius:8px; background:#fff; box-shadow:inset 0 0 0 1px #8c877c; color:#314a39; font-size:9px; }.ref-onboarding .cta { min-height:42px; margin-top:10px; justify-content:center; padding:8px; border-radius:9px; font-size:12px; }.ref-onboarding .cta .arrow { display:none; }

/* Visual logo studies: a single wordmark receives eight clearly different art directions. */
.style-studies { padding: 8px; background: #f0eadf; box-shadow: inset 0 0 0 1px rgba(100, 76, 39, .08), 0 10px 28px rgba(75, 48, 16, .07); }
.style-panel-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; padding:6px 5px 10px; }
.style-panel-heading b { display:block; color:#2b3e31; font-size:12px; letter-spacing:-.025em; }
.style-panel-heading small { display:block; margin-top:3px; color:#766d60; font-size:8px; }
.style-panel-heading > span { padding:4px 6px; border-radius:999px; background:#fffaf0; color:#8a7659; font:500 7px "DM Mono"; text-transform:uppercase; letter-spacing:.1em; }
.style-study-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:7px; }
.style-showcase { min-width:0; padding:4px; border-radius:13px; background:rgba(255,255,255,.55); box-shadow:inset 0 0 0 1px rgba(100,76,39,.08); color:#2f2a24; text-align:left; transition:transform .58s cubic-bezier(.32,.72,0,1), box-shadow .58s cubic-bezier(.32,.72,0,1), background .58s cubic-bezier(.32,.72,0,1); }
.style-showcase:active { transform:scale(.975); }
.style-showcase.active { background:#fffdf8; box-shadow:inset 0 0 0 1.5px var(--style-accent), 0 8px 18px color-mix(in srgb, var(--style-accent) 20%, transparent); transform:translateY(-2px); }
.style-study { min-height:98px; display:grid; place-items:center; position:relative; overflow:hidden; border-radius:10px; background:#f7f3eb; isolation:isolate; }
.style-study:has(.style-study-image) { min-height:126px; padding:4px; background:#fffdf8; }
.style-study-image { display:block; width:100%; height:126px; object-fit:contain; object-position:center; transition:transform .7s cubic-bezier(.32,.72,0,1); }
.style-showcase:hover .style-study-image { transform:scale(1.018); }
.study-halo { position:absolute; width:76px; height:76px; border-radius:50%; background:color-mix(in srgb, var(--style-accent) 18%, #fff); z-index:-1; transition:transform .7s cubic-bezier(.32,.72,0,1); }
.style-showcase:hover .study-halo { transform:scale(1.15) rotate(12deg); }
.study-mark { display:grid; place-items:center; width:39px; height:39px; border-radius:14px; background:var(--style-accent); color:#fffdf7; font:700 22px Georgia,serif; line-height:1; box-shadow:0 7px 12px color-mix(in srgb, var(--style-accent) 26%, transparent); }
.study-wordmark { position:absolute; bottom:13px; max-width:82%; overflow:hidden; color:#2c332d; font-weight:700; font-size:9px; line-height:1; letter-spacing:-.055em; text-overflow:ellipsis; white-space:nowrap; }
.style-study-footer { display:grid; grid-template-columns:1fr auto; gap:1px 5px; align-items:center; padding:7px 5px 5px; }
.style-study-footer b { font-size:9px; letter-spacing:-.025em; }.style-study-footer small { color:#817664; font-size:7px; }.style-study-footer i { grid-area:1 / 2 / 3; display:grid; place-items:center; width:18px; height:18px; border-radius:50%; color:var(--style-accent); background:color-mix(in srgb, var(--style-accent) 12%, #fff); font-style:normal; font-size:10px; }
.style-showcase--modern .style-study { background:#eef3ee; }.style-showcase--modern .study-mark { border-radius:10px 16px 10px 16px; font-family:"DM Sans",sans-serif; }.style-showcase--modern .study-wordmark { text-transform:uppercase; letter-spacing:.13em; font-size:7px; }
.style-showcase--african .style-study { background:#fbefe0; }.style-showcase--african .study-halo { border:7px double color-mix(in srgb, var(--style-accent) 55%, #fff); background:transparent; }.style-showcase--african .study-mark { border-radius:50% 50% 40% 40%; transform:rotate(45deg); }.style-showcase--african .study-mark::first-letter { transform:rotate(-45deg); }
.style-showcase--elegant .style-study { background:#f8f0f7; }.style-showcase--elegant .study-mark { width:43px; height:43px; border-radius:50%; border:1px solid rgba(255,255,255,.65); background:transparent; color:var(--style-accent); box-shadow:inset 0 0 0 3px rgba(255,255,255,.5); font-size:25px; }.style-showcase--elegant .study-wordmark { font-family:Georgia,serif; font-weight:600; letter-spacing:.03em; }
.style-showcase--bold .style-study { background:#fbeee2; }.style-showcase--bold .study-halo { width:130%; height:45px; border-radius:0; transform:rotate(-12deg); }.style-showcase--bold .study-mark { width:46px; height:36px; border-radius:4px; font-family:"DM Sans",sans-serif; font-size:24px; }.style-showcase--bold .study-wordmark { font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.style-showcase--fun .style-study { background:#f7eef8; }.style-showcase--fun .study-halo { width:66px; height:48px; border-radius:50% 35% 55% 35%; transform:rotate(-17deg); }.style-showcase--fun .study-mark { border-radius:50% 42% 50% 42%; transform:rotate(-8deg); }.style-showcase--fun .study-wordmark { font-weight:700; letter-spacing:0; }
.style-showcase--natural .style-study { background:#edf3e7; }.style-showcase--natural .study-halo { border-radius:78% 22% 75% 25%; transform:rotate(-35deg); }.style-showcase--natural .study-mark { border-radius:80% 18% 80% 18%; transform:rotate(-22deg); }.style-showcase--natural .study-wordmark { font-family:Georgia,serif; }
.style-showcase--luxury .style-study { background:#22261f; }.style-showcase--luxury .study-halo { width:67px; height:67px; border-radius:5px; border:1px solid color-mix(in srgb, var(--style-accent) 85%, #fff); background:transparent; transform:rotate(45deg); }.style-showcase--luxury .study-mark { width:35px; height:35px; border-radius:0; background:transparent; color:#f4d387; box-shadow:none; font-size:24px; }.style-showcase--luxury .study-wordmark { color:#f8f2df; font-family:Georgia,serif; letter-spacing:.12em; font-size:7px; text-transform:uppercase; }
.style-showcase--simple .style-study { background:#fffdf8; }.style-showcase--simple .study-halo { width:56px; height:1px; border-radius:0; }.style-showcase--simple .study-mark { width:31px; height:31px; border-radius:50%; font-family:"DM Sans",sans-serif; font-size:16px; }.style-showcase--simple .study-wordmark { font-weight:500; letter-spacing:.16em; font-size:7px; text-transform:uppercase; }

.generating { justify-content: center; align-items: center; text-align: center; padding-bottom: 75px; }
.orbital { width: 176px; height: 176px; margin-bottom: 40px; position:relative; border-radius: 50%; border: 1px dashed rgba(30,69,53,.35); animation: spin 9s cubic-bezier(.45,.05,.55,.95) infinite; }
.orbital:before, .orbital:after { content:""; position:absolute; border-radius: 50%; }
.orbital:before { width: 114px; height: 114px; inset: 30px; background: var(--lime); box-shadow: inset 0 0 0 11px #e7f6bd; }
.orbital:after { width: 31px; height: 31px; top: 6px; left: 67px; background: #ec8e69; }
.generating h2 { font-size: 31px; letter-spacing: -.06em; margin: 0; }
.generating p { color: var(--muted); max-width: 270px; line-height: 1.5; }
.prompt-echo { width: 274px; margin: 6px auto 0; padding: 10px 12px; border: 1px solid #dfe8cc; border-radius: 12px; background: #f5f8e9; color: #3d5545; text-align: left; }
.prompt-echo span { display: block; margin-bottom: 4px; color: #8c462b; font: 700 9px "DM Mono", monospace; letter-spacing: .08em; text-transform: uppercase; }
.prompt-echo b { display: block; font-size: 11px; line-height: 1.35; font-weight: 600; }

.logo-grid { display:grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 8px 0 18px; }
.logo-option { aspect-ratio: 1; padding: 10px; display:flex; align-items:center; justify-content:center; border-radius: 18px; background: var(--swatch, #eeeee7); position: relative; overflow:hidden; transition: transform .42s cubic-bezier(.32,.72,0,1), box-shadow .42s cubic-bezier(.32,.72,0,1); }
.logo-option:hover { transform: translateY(-3px) rotate(-1deg); box-shadow: 0 10px 20px rgba(30,69,53,.12); }
.logo-option.selected { outline: 3px solid var(--forest); outline-offset: 2px; }
.mark { text-align:center; font-size: 17px; font-weight: 700; letter-spacing: -.08em; line-height: .86; color: var(--mark, var(--forest)); }
.mark small { display:block; font: 500 7px "DM Mono"; letter-spacing: .06em; margin-top: 5px; }
.mark.symbol { font-size: 34px; font-family: "Playfair Display", serif; }
.section-note { color: var(--muted); line-height: 1.4; font-size: 13px; margin: 0 0 17px; }
.price-pill { display: inline-flex; align-items:center; gap:5px; border-radius: 99px; padding: 7px 11px; color: #754232; background: #f9e3d5; font: 500 10px "DM Mono"; }

.logo-reference { padding:22px 18px 14px; background:#fffaf0; }.logo-reference .top-row { min-height:20px; }.logo-reference .wordmark,.logo-reference .icon-button { display:none; }.logo-reference .back { font-size:25px; }.logo-heading { display:flex; align-items:center; justify-content:space-between; margin-top:5px; }.logo-heading h2 { margin:0; font-size:23px; letter-spacing:-.06em; }.logo-heading span { width:21px;height:21px;display:grid;place-items:center;border-radius:50%;box-shadow:inset 0 0 0 1px #352e22;font-size:12px;font-weight:700; }.logo-reference > .section-note { margin:0 0 10px 35px; font-size:10px; }.direction-pills { display:flex; gap:6px; margin:0 0 10px; }.direction-pills span { flex:1; padding:7px 5px; text-align:center; border-radius:8px; background:#edf2e8; color:#407150; font-size:8px; white-space:nowrap; }.direction-pills span:nth-child(2) { background:#f8ebe2;color:#b85f2c; }.direction-pills span:nth-child(3) { background:#f0eaf4;color:#70448f; }.logo-reference .logo-grid { gap:7px; margin:0; }.logo-reference .logo-option { border-radius:9px; padding:5px; }.logo-reference .mark { font-size:15px; }.logo-reference .mark.symbol { font-size:29px; }.logo-reference .logo-option.selected { outline:2px solid #1e603d; outline-offset:-2px; }.logo-preview { margin-top:10px; padding:9px; display:grid; grid-template-columns:48px 1fr 88px; gap:8px; align-items:center; border-radius:10px; background:#fbf6eb; box-shadow:inset 0 0 0 1px #eee6d8; }.preview-mark { width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#1e603d;font:20px "Playfair Display";box-shadow:inset 0 0 0 2px #8d4d2e; }.preview-mark small { display:none; }.logo-preview b { display:block; font-size:9px; }.logo-preview span { display:block;margin-top:2px;color:#aa8e67;font-size:7px; }.logo-preview p { margin:5px 0 0;color:#6b604f;font-size:7px;line-height:1.2; }.mockup-stack { display:flex;align-items:center; }.mockup-stack i { width:37px;height:37px;border-radius:5px;margin-left:-8px;background:linear-gradient(135deg,#613820,#d6b37e);border:2px solid #fff; }.mockup-stack i:nth-child(2){background:linear-gradient(135deg,#294731,#e7c983)}.mockup-stack i:nth-child(3){background:linear-gradient(135deg,#bd754e,#4b2e19)}.logo-actions { display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px; }.logo-actions button { min-height:38px;border-radius:8px;background:#f4efe5;color:#29583b;font-size:10px;font-weight:600; }.logo-actions .use-logo { color:#fff;background:#1e603d; }.bottom-nav { display:flex;justify-content:space-around;margin-top:auto;padding-top:11px;border-top:1px solid #ece5d9; }.bottom-nav button { display:grid;gap:3px;place-items:center;color:#867c6b;background:transparent;font-size:17px; }.bottom-nav button:first-child { color:#1e603d; }.bottom-nav span { font-size:8px; }

.logo-focus { background:#fff9ed; }.logo-focus .wordmark,.logo-focus .icon-button { display:none; }.logo-focus .top-row { min-height:20px; }.logo-focus .back { font-size:25px; }.logo-focus .mini-label { margin-top:17px;color:#a46841; }.logo-focus .screen-title { margin:7px 0; font-size:31px; }.logo-focus .section-note { margin:0; font-size:11px; }.focus-logo { min-height:134px;margin:17px 0 12px;padding:17px;border-radius:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--focus-bg);color:var(--focus-ink);position:relative;overflow:hidden; }.focus-logo:before,.focus-logo:after { content:"";position:absolute;border:1px solid currentColor;border-radius:50%;opacity:.22; }.focus-logo:before { width:170px;height:170px;right:-78px;top:-70px; }.focus-logo:after { width:145px;height:145px;left:-72px;bottom:-85px; }.focus-symbol { position:relative;z-index:1;font:33px "Playfair Display";line-height:.8; }.focus-logo b { position:relative;z-index:1;margin-top:10px;font-size:21px;letter-spacing:-.07em; }.focus-logo small { position:relative;z-index:1;margin-top:4px;font:500 8px "DM Mono";letter-spacing:.1em;text-transform:uppercase; }.mockup-gallery { display:grid;grid-template-columns:1.18fr .82fr;grid-template-rows:92px 69px;gap:9px; }.mockup { border-radius:16px;overflow:hidden;position:relative; }.storefront { grid-row:span 2;background:linear-gradient(155deg,#583823 0 21%,#d4aa70 21% 27%,#f7e9cb 27%);padding:12px; }.storefront > span { position:absolute;right:8px;top:7px;padding:3px 5px;border-radius:3px;background:#d2602d;color:#fff;font:6px "DM Mono"; }.storefront > div { position:absolute;left:18px;right:18px;bottom:17px;padding:12px 8px;text-align:center;border-radius:6px;background:var(--focus-bg);color:var(--focus-ink);box-shadow:0 5px 14px rgba(20,15,7,.2); }.storefront i { display:block;font:19px "Playfair Display";font-style:normal; }.storefront b { display:block;margin-top:4px;font-size:10px;line-height:.87;letter-spacing:-.07em; }.card { padding:11px;background:var(--focus-ink);color:var(--focus-bg); }.card:after { content:"";position:absolute;width:95px;height:95px;right:-40px;bottom:-40px;border:10px solid var(--focus-bg);border-radius:50%;opacity:.65; }.card i { font:22px "Playfair Display";font-style:normal; }.card b { display:block;margin-top:9px;font-size:11px;line-height:.85;letter-spacing:-.06em; }.card small { position:absolute;bottom:9px;left:11px;font:6px "DM Mono";opacity:.78; }.avatar { display:flex;align-items:center;gap:8px;padding:9px;background:#efe9dc;color:#514333; }.avatar i { width:34px;height:34px;display:grid;place-items:center;border-radius:50%;font:18px "Playfair Display";font-style:normal;color:var(--focus-ink);background:var(--focus-bg); }.avatar span { max-width:40px;font-size:8px;line-height:1.1; }.logo-detail-note { display:flex;gap:10px;margin:12px 0;padding:10px;border-radius:12px;background:#f1eee6;color:#746a5d; }.logo-detail-note > span { width:23px;height:23px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:#dceaa9;color:#34623f;font-size:13px; }.logo-detail-note p { margin:0;font-size:9px;line-height:1.35; }.logo-detail-note b { display:block;color:#3e372d;margin-bottom:2px; }.logo-focus .cta { min-height:48px;margin-top:auto; }.focus-back { margin-top:9px;padding:10px;background:transparent;color:#775f3e;font-size:11px;font-weight:600; }

.brand-card { margin: 20px 0; min-height: 225px; padding: 22px; position:relative; overflow:hidden; border-radius: 30px; background: #2e5644; color: #eff4d9; }
.brand-card:after { content:""; position:absolute; width: 200px; height: 200px; right: -86px; bottom: -80px; border: 19px solid #d8f087; border-radius: 50%; }
.brand-card .tiny { font: 500 9px "DM Mono"; letter-spacing:.13em; text-transform:uppercase; color: #b9d184; }
.brand-card h3 { position: relative; z-index:1; margin: 34px 0 0; font: 600 42px/ .83 "Playfair Display"; letter-spacing: -.07em; }
.brand-card p { font-size: 11px; margin-top: 18px; color: #ccddab; }
.kit-row { display:flex; gap: 9px; }
.kit-row div { flex:1; padding: 12px 10px; border-radius: 15px; background:#f0f0e8; font-size: 10px; font-weight:600; text-align:center; }
.kit-row span { display:block; width: 19px; height:19px; border-radius:50%; margin:0 auto 7px; background:var(--color); }

.site-card { margin-top: 15px; border-radius: 27px; overflow:hidden; background:#e6e1cc; }
.site-hero { min-height: 175px; padding: 18px; display:flex; flex-direction:column; justify-content:space-between; color: #fffdf8; background: linear-gradient(135deg,rgba(16,51,39,.15),rgba(16,51,39,.35)), #bd7252; }
.site-brand { font: 600 30px/ .8 "Playfair Display"; letter-spacing:-.06em; }
.site-hero span { align-self:start; background:#eff5d2; color:var(--forest); padding:8px 12px; border-radius:20px; font-size:10px; font-weight:700; }
.site-details { padding:17px; background:#fffdf8; display:flex; align-items:center; justify-content:space-between; }
.site-details b { font-size:12px; }.site-details small { display:block; margin-top:4px; color:var(--muted); font-size:10px; }
.qr { width:42px; height:42px; background: repeating-linear-gradient(90deg,#1c3028 0 5px,transparent 5px 8px), repeating-linear-gradient(#1c3028 0 5px,#fdfbf4 5px 8px); }

.business-page { padding:22px 0 28px; background:#fffdf8; }.business-page > .top-row { padding:0 20px; }.business-page .wordmark { font-size:14px; }.business-page .wordmark i { width:21px;height:21px;font-size:14px; }.business-page .icon-button { width:31px;height:31px;background:#f4f0e8;font-size:17px; }.public-label { display:flex;justify-content:space-between;align-items:center;margin:17px 20px 8px;color:#429052;font-size:9px;font-weight:700; }.public-label button { width:26px;height:26px;border-radius:50%;background:#f0eee6;color:#264b35;font-size:16px; }.public-hero { min-height:196px;padding:25px 22px 17px;position:relative;overflow:hidden;text-align:center;color:#fffbed;background:#26543d; }.hero-pattern { position:absolute;inset:0;opacity:.14;background-image:repeating-linear-gradient(45deg,transparent 0 15px,#e1efaf 15px 17px,transparent 17px 31px); }.hero-pattern:after { content:"";position:absolute;width:225px;height:225px;right:-95px;top:-78px;border:18px solid #d9ee94;border-radius:50%; }.public-logo { position:relative;z-index:1;width:56px;height:56px;margin:0 auto 10px;display:grid;place-items:center;border-radius:50%;background:#f9e99f;color:#31543b;font:30px "Playfair Display";box-shadow:0 0 0 5px rgba(249,233,159,.14); }.public-hero h2 { position:relative;z-index:1;margin:0;font:600 29px/.87 "Playfair Display";letter-spacing:-.065em; }.public-hero p { position:relative;z-index:1;margin:7px 0 0;color:#d8e7bd;font-size:10px; }.public-meta { position:relative;z-index:1;display:flex;justify-content:center;gap:14px;margin-top:17px;color:#e8f0d7;font-size:9px; }.public-url { display:flex;align-items:center;justify-content:space-between;margin:-12px 18px 0;padding:9px 10px 9px 13px;position:relative;z-index:1;border-radius:11px;background:#fffdf8;box-shadow:0 7px 19px rgba(32,48,35,.13);font:9px "DM Mono";color:#62594d; }.public-url button { padding:6px 9px;border-radius:7px;background:#e9f0d3;color:#315b3b;font-size:9px;font-weight:700; }.public-tabs { display:flex;justify-content:space-around;margin:18px 20px 0;border-bottom:1px solid #eeeae1; }.public-tabs button { padding:8px 11px 10px;position:relative;background:transparent;color:#92877a;font-size:10px; }.public-tabs button.active { color:#1e603d;font-weight:700; }.public-tabs button.active:after { content:"";position:absolute;bottom:-1px;left:8px;right:8px;height:2px;border-radius:2px;background:#1e603d; }.product-section { margin:16px 20px 0; }.section-heading { display:flex;align-items:center;justify-content:space-between; }.section-heading b { display:block;font-size:13px;letter-spacing:-.035em; }.section-heading small { display:block;margin-top:2px;color:#958a7b;font-size:9px; }.section-heading button { background:transparent;color:#b35e1d;font-size:9px;font-weight:700; }.product-strip { display:flex;gap:9px;margin-top:10px;overflow:hidden; }.product-card { min-width:101px; }.product-art { height:73px;display:grid;place-items:center;border-radius:12px;color:#fff5d6;font:30px "Playfair Display"; }.art-cake { background:linear-gradient(135deg,#c87958,#f0c993); }.art-chops { background:linear-gradient(135deg,#d59138,#8d4e24); }.art-box { background:linear-gradient(135deg,#a47a50,#4c6148); }.product-card b { display:block;margin-top:6px;font-size:9px;letter-spacing:-.025em; }.product-card small { display:block;margin-top:2px;color:#9a8f82;font-size:8px; }.whatsapp-button { width:calc(100% - 40px);margin:18px 20px 0;padding:10px 11px;display:flex;align-items:center;gap:10px;text-align:left;border-radius:13px;background:#e7f3cc;color:#255939; }.whatsapp-button i { width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:#2d9e58;color:#fff;font-style:normal;font-size:18px; }.whatsapp-button span { flex:1; }.whatsapp-button b,.whatsapp-button small { display:block; }.whatsapp-button b { font-size:10px; }.whatsapp-button small { margin-top:2px;color:#578168;font-size:8px; }.whatsapp-button em { font-size:17px;font-style:normal; }.qr-panel { margin:14px 20px 0;padding:12px;display:grid;grid-template-columns:66px 1fr;gap:11px;align-items:center;border-radius:16px;background:#f5f0e7;position:relative;overflow:hidden; }.qr-panel > div:nth-child(2) .mini-label { display:block;color:#ab673a;font-size:7px; }.qr-panel > div:nth-child(2) > b { display:block;margin-top:4px;color:#3b3328;font-size:12px;letter-spacing:-.04em;line-height:1.02; }.qr-panel > div:nth-child(2) > small { display:block;margin-top:5px;color:#83786a;font-size:8px;line-height:1.2; }.qr-large { width:65px;height:65px;padding:7px;display:grid;place-items:center;background:#fff;position:relative;background-image:repeating-linear-gradient(90deg,#1c3028 0 4px,transparent 4px 7px),repeating-linear-gradient(#1c3028 0 4px,#fff 4px 7px); }.qr-large i { position:absolute;inset:15px;background:#fff;border-radius:50%; }.qr-large b { position:relative;z-index:1;color:#d76a13;font:17px "Playfair Display"; }.qr-panel > button { grid-column:1/-1;margin-top:0;padding:7px;border-radius:8px;background:#1e603d;color:#fff;font-size:9px;font-weight:700; }

.print-sample { margin: 15px 0 18px; min-height: 145px; padding: 18px; border-radius: 27px; color:#fffdf8; background:#e68362; position:relative; overflow:hidden; }
.print-sample:after { content:""; position:absolute; width: 180px; height:180px; border: 25px solid #f4d4a0; border-radius:50%; right:-56px; bottom:-88px; }
.print-sample strong { display:block; font: 600 29px/ .8 "Playfair Display"; letter-spacing:-.06em; margin-top:24px; }.print-sample small { font:500 9px "DM Mono"; letter-spacing:.1em; }
.quantity-row { display:grid; grid-template-columns: repeat(4,1fr); gap:8px; }.quantity { min-height:54px; border-radius:15px; background:#edf0e8; font-size:12px; font-weight:600; }.quantity.active { color:#fffdf8; background:var(--forest); }
.success { justify-content:center; text-align:center; align-items:center; padding-bottom:75px; }.success-mark { width:102px;height:102px;border-radius:34px;display:grid;place-items:center;background:var(--lime);font-size:44px;transform:rotate(-8deg);margin-bottom:28px;box-shadow:0 15px 28px rgba(136,172,49,.22); }.success h2 { font-size:36px;letter-spacing:-.07em;line-height:.94;margin:0; }.success p{ color:var(--muted);max-width:300px;line-height:1.5; }.recap{ width:100%; margin-top:18px;padding:15px;text-align:left;border-radius:19px;background:#f0f0e8;font-size:12px;line-height:1.6; }.recap b { display:block;font-size:14px; }

.catalogue-plan { margin:17px 20px 0;padding:12px;display:grid;grid-template-columns:1fr auto;gap:7px;border-radius:14px;background:#f7ebd6;color:#53391e; }.catalogue-plan .mini-label { display:block;color:#b25e21;font-size:7px; }.catalogue-plan b { display:block;margin-top:4px;font-size:12px;letter-spacing:-.04em; }.catalogue-plan small { display:block;margin-top:3px;color:#8a704f;font-size:8px; }.catalogue-plan > strong { align-self:center;color:#a34f16;font-size:13px;letter-spacing:-.045em; }.tier-picker { grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:3px; }.tier-picker button { min-height:29px;border-radius:7px;background:#fff8ec;color:#94633d;font-size:8px;font-weight:700; }.tier-picker button.active { background:#1e603d;color:#fff; }

.print-checkout { background:#fff9ed; }.print-preview { margin:15px 0 16px;padding:17px;border-radius:24px;background:#e6c493;position:relative;overflow:hidden; }.print-preview:after { content:"";position:absolute;width:180px;height:180px;border:17px solid rgba(255,249,237,.42);border-radius:50%;right:-76px;bottom:-104px; }.card-face { position:relative;z-index:1;min-height:105px;padding:15px;border-radius:10px;color:#1f5139;background:#f8f4e6;box-shadow:0 12px 18px rgba(79,48,20,.2);transform:rotate(-2.5deg); }.card-face span { display:block;font:25px "Playfair Display"; }.card-face b { display:block;margin-top:17px;font:600 21px/.86 "Playfair Display";letter-spacing:-.065em; }.card-face small { display:block;margin-top:8px;font:500 8px "DM Mono";letter-spacing:.08em;text-transform:uppercase; }.preview-caption { position:relative;z-index:1;margin-top:16px;color:#5f3a18; }.preview-caption b { display:block;font-size:11px; }.preview-caption span { display:block;margin-top:3px;font-size:8px;opacity:.75; }.print-item-row { display:grid;grid-template-columns:repeat(3,1fr);gap:7px; }.print-item-row button { min-height:55px;padding:6px;border-radius:11px;background:#fffdf6;color:#796b59;font-size:9px;box-shadow:inset 0 0 0 1px #ece4d8; }.print-item-row button i { display:block;margin-bottom:4px;color:#b86424;font-style:normal;font-size:18px; }.print-item-row button.active { color:#fff;background:#1e603d;box-shadow:none; }.print-item-row button.active i { color:#dff19b; }.print-checkout .quantity-row { gap:7px; }.print-checkout .quantity { min-height:40px;border-radius:10px;background:#fffdf6;color:#786957;box-shadow:inset 0 0 0 1px #ece4d8; }.print-checkout .quantity.active { color:#fff;background:#1e603d;box-shadow:none; }.choice-row { display:grid;grid-template-columns:1fr 1fr;gap:8px; }.choice-row button { min-height:38px;border-radius:10px;background:#fffdf6;color:#786957;font-size:10px;box-shadow:inset 0 0 0 1px #ece4d8; }.choice-row button.active { color:#1e603d;background:#e7f0d5;box-shadow:inset 0 0 0 1px #77a35d;font-weight:700; }.fulfilment-row i { margin-right:4px;font-style:normal;font-size:14px; }.order-total { margin-top:17px;padding:12px;display:flex;align-items:center;justify-content:space-between;border-radius:14px;background:#efe9dc; }.order-total span,.order-total b,.order-total small { display:block; }.order-total span { color:#8a7a67;font-size:8px; }.order-total b { margin-top:3px;color:#31533b;font-size:17px;letter-spacing:-.05em; }.order-total small { margin-top:4px;color:#8b7c68;font-size:8px; }.order-total i { width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#d5eb92;color:#345a38;font-style:normal;font-size:17px; }

.paid-tag { display:inline-block;margin-left:5px;padding:3px 5px;border-radius:5px;background:#e5f0cf;color:#397343;font-size:7px;letter-spacing:0;font-weight:700; }.print-paid { margin-top:14px;padding:9px 11px;display:flex;align-items:center;justify-content:space-between;border-radius:10px;background:#e6f0d5;color:#397043;font-size:9px; }.print-paid b { font-size:8px;text-transform:uppercase;letter-spacing:.08em; }

.payment-screen { background:#fff9ed; }.payment-order { margin:18px 0;padding:12px;display:grid;grid-template-columns:42px 1fr auto;gap:10px;align-items:center;border-radius:14px;background:#f2ede1; }.order-chip { width:42px;height:42px;display:grid;place-items:center;border-radius:9px;background:#1e603d;color:#e5f19d;font:23px "Playfair Display"; }.payment-order b,.payment-order small { display:block; }.payment-order b { font-size:11px;letter-spacing:-.03em; }.payment-order small { margin-top:3px;color:#8b7b68;font-size:8px; }.payment-order strong { color:#31563e;font-size:12px;letter-spacing:-.04em; }.payment-methods { display:grid;gap:8px; }.payment-method { display:flex;align-items:center;gap:10px;padding:10px;border-radius:12px;background:#fffdf6;color:#665b4d;text-align:left;box-shadow:inset 0 0 0 1px #ebe4d8; }.payment-method.active { box-shadow:inset 0 0 0 1.5px #2d7042;background:#f7fcf0; }.payment-method i { width:31px;height:31px;display:grid;place-items:center;border-radius:50%;color:#fff;font-style:normal;font-weight:700;font-size:16px; }.payment-method i.mtn { background:#efc40c;color:#2e3517; }.payment-method i.orange { background:#f27a19; }.payment-method span { flex:1; }.payment-method b,.payment-method small { display:block; }.payment-method b { font-size:10px; }.payment-method small { margin-top:2px;color:#9b8e7f;font-size:8px; }.payment-method em { width:19px;height:19px;display:grid;place-items:center;border-radius:50%;background:#d8ef9b;color:#24583a;font-size:10px;font-style:normal; }.payment-number { display:flex;align-items:center;border-radius:10px;background:#fffdf6;box-shadow:inset 0 0 0 1px #e9e2d6; }.payment-number span { padding:12px 10px;color:#896a47;font:10px "DM Mono";border-right:1px solid #e7dfd1; }.payment-number input { flex:1;padding:11px;border:0;outline:0;background:transparent;color:#40382e;font-size:12px; }.payment-note { display:flex;gap:9px;margin-top:15px;padding:10px;border-radius:10px;background:#f7e9d3;color:#806344; }.payment-note span { width:20px;height:20px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:#f0c68b;color:#714519;font-size:12px; }.payment-note p { margin:0;font-size:9px;line-height:1.35; }.payment-note b { display:block;color:#634122;margin-bottom:2px; }.payment-screen .cta { margin-top:16px; }.payment-foot { margin:10px 18px 0;text-align:center;color:#9e9180;font-size:8px;line-height:1.35; }

.owner-dashboard { background:#fff9ed; }.owner-dashboard .top-row { margin-bottom:31px; }.owner-dashboard .mini-label { color:#9d632f; }.owner-dashboard .screen-title { margin:7px 0; }.owner-dashboard .section-note { margin:0; }.live-card { margin:19px 0 10px;padding:15px;display:flex;align-items:center;justify-content:space-between;border-radius:18px;background:#1e603d;color:#f7f2dd;position:relative;overflow:hidden; }.live-card:after { content:"";position:absolute;width:160px;height:160px;right:-96px;bottom:-104px;border:13px solid #d8ef95;border-radius:50%;opacity:.6; }.live-card span,.live-card b,.live-card small { position:relative;z-index:1;display:block; }.live-card span { color:#d9ee99;font-size:8px;font-weight:700; }.live-card b { margin-top:8px;font:600 21px/.88 "Playfair Display";letter-spacing:-.055em; }.live-card small { margin-top:7px;color:#d0debd;font:8px "DM Mono"; }.live-card button { position:relative;z-index:1;padding:8px 10px;border-radius:9px;background:#e1f09e;color:#235137;font-size:9px;font-weight:700; }.owner-grid { display:grid;grid-template-columns:1fr 1fr;gap:9px; }.owner-grid button { min-height:108px;padding:13px;text-align:left;position:relative;border-radius:15px;background:#fffdf7;color:#3f382e;box-shadow:inset 0 0 0 1px #eee7dc; }.owner-grid i { width:29px;height:29px;display:grid;place-items:center;border-radius:9px;background:#e6f0d1;color:#346a42;font-style:normal;font-size:17px; }.owner-grid button:nth-child(2) i { color:#b05f25;background:#f8e6d5; }.owner-grid button:nth-child(3) i { color:#72518a;background:#ece2f0; }.owner-grid button:nth-child(4) i { color:#b2700e;background:#f8edca; }.owner-grid span { display:block;margin-top:12px; }.owner-grid b,.owner-grid small { display:block; }.owner-grid b { font-size:10px;letter-spacing:-.03em; }.owner-grid small { margin-top:3px;color:#928579;font-size:8px;line-height:1.15; }.owner-grid em { position:absolute;right:10px;bottom:9px;color:#b5aa9b;font-style:normal;font-size:17px; }.plan-status { margin-top:13px;padding:13px;display:flex;align-items:center;justify-content:space-between;border-radius:14px;background:#f1eadc; }.plan-status span,.plan-status b,.plan-status small { display:block; }.plan-status span { color:#aa6934;font-size:7px; }.plan-status b { margin-top:4px;font-size:11px;letter-spacing:-.035em; }.plan-status small { margin-top:4px;color:#8d806f;font-size:8px; }.plan-status button { padding:8px;border-radius:8px;background:#fffaf0;color:#8b5325;font-size:8px;font-weight:700; }.products-screen { background:#fff9ed; }.products-title { display:flex;align-items:start;justify-content:space-between; }.products-title .screen-title { margin:7px 0 0; }.products-title p { margin:5px 0 14px;color:#927f6a;font-size:9px; }.products-title > button { width:35px;height:35px;margin-top:5px;border-radius:50%;background:#1e603d;color:#fff;font-size:23px;line-height:1; }.product-manager-list { display:grid;gap:9px; }.product-manager-list article { display:grid;grid-template-columns:43px minmax(0,1fr) auto 20px;gap:8px;align-items:center;padding:9px;border-radius:13px;background:#fffdf7;box-shadow:inset 0 0 0 1px #eee7dc; }.product-manager-list article > i { width:43px;height:43px;display:grid;place-items:center;border-radius:10px;color:#7c4b2d;background:#f3d3b5;font:22px "Playfair Display";font-style:normal; }.product-manager-list article:nth-child(2) > i { background:#eedca0;color:#8c5928; }.product-manager-list article:nth-child(3) > i { background:#dce8c6;color:#3f6746; }.product-manager-list b,.product-manager-list small { display:block; }.product-manager-list b { font-size:10px; }.product-manager-list small { margin-top:3px;color:#928476;font-size:8px; }.product-manager-list > article > button:last-child { padding:4px 0;background:transparent;color:#918474;font-size:13px;letter-spacing:-1px; }.availability-toggle { display:flex;align-items:center;gap:4px;padding:4px 5px;border-radius:7px;background:#e7f1d3;color:#3b7646;font-size:7px;font-weight:700;white-space:nowrap; }.availability-toggle i { width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:none; }.availability-toggle.unavailable { background:#f2e8df;color:#a06436; }.availability-toggle:focus-visible { outline:2px solid #1e603d;outline-offset:2px; }.add-product { width:100%;margin-top:13px;padding:12px;border-radius:11px;background:#1e603d;color:#fff;font-size:10px;font-weight:700; }.products-tip { display:flex;gap:9px;margin-top:12px;padding:10px;border-radius:10px;background:#f2eadb;color:#826f5d; }.products-tip span { width:20px;height:20px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:#dceea3;color:#37633d;font-size:11px; }.products-tip p { margin:0;font-size:8px;line-height:1.35; }.products-tip b { display:block;color:#645240;margin-bottom:2px; }.product-description { min-height:72px;resize:none; }.availability-field { display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:17px;padding:11px 12px;border-radius:13px;background:#f0eadf;color:#524739; }.availability-field span { flex:1; }.availability-field b,.availability-field small { display:block; }.availability-field b { font-size:10px; }.availability-field small { margin-top:3px;color:#8f806f;font-size:8px;line-height:1.25; }.availability-field input { position:absolute;inline-size:1px;block-size:1px;opacity:0; }.availability-field i { width:35px;height:20px;position:relative;flex:0 0 auto;border-radius:20px;background:#c9bdac;transition:background .3s cubic-bezier(.32,.72,0,1); }.availability-field i:after { content:"";position:absolute;width:14px;height:14px;top:3px;left:3px;border-radius:50%;background:#fffdf7;box-shadow:0 2px 4px rgba(60,43,25,.16);transition:transform .3s cubic-bezier(.32,.72,0,1); }.availability-field input:checked + i { background:#2f7847; }.availability-field input:checked + i:after { transform:translateX(15px); }.availability-field:has(input:focus-visible) { outline:2px solid #1e603d;outline-offset:2px; }.product-photo-placeholder { height:77px;margin-top:17px;display:grid;place-items:center;align-content:center;gap:5px;border-radius:13px;background:#f0ebe0;color:#a66d3d;font-size:20px; }.product-photo-placeholder span { color:#836f5c;font-size:9px; }

.brand-kit-screen { background:#fff9ed; }.brand-kit-screen .section-note { margin:0; }.kit-hero { min-height:164px;margin:17px 0;padding:17px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:24px;color:var(--kit-ink);background:var(--kit-bg);position:relative;overflow:hidden; }.kit-hero:before { content:"";position:absolute;width:190px;height:190px;right:-90px;top:-90px;border:17px solid currentColor;border-radius:50%;opacity:.2; }.kit-hero:after { content:"";position:absolute;width:125px;height:125px;left:-64px;bottom:-71px;border:11px solid currentColor;border-radius:50%;opacity:.16; }.kit-logo { position:relative;z-index:1;font:39px "Playfair Display";line-height:.8; }.kit-hero b { position:relative;z-index:1;margin-top:11px;font-size:25px;letter-spacing:-.075em; }.kit-hero small { position:relative;z-index:1;margin-top:5px;font:500 8px "DM Mono";letter-spacing:.09em;text-transform:uppercase; }.kit-hero > span { position:absolute;z-index:1;top:12px;right:12px;padding:5px 7px;border-radius:6px;background:rgba(255,255,255,.55);font-size:7px;font-weight:700; }.asset-heading { display:flex;align-items:center;justify-content:space-between;margin:18px 0 8px; }.asset-heading b { font-size:12px;letter-spacing:-.035em; }.asset-heading button { padding:5px 7px;border-radius:7px;background:#f0eadf;color:#a05f2d;font-size:8px;font-weight:700; }.asset-list { display:grid;gap:7px; }.asset-list button { display:flex;align-items:center;gap:10px;padding:9px;border-radius:11px;text-align:left;background:#fffdf7;box-shadow:inset 0 0 0 1px #eee7dc; }.asset-list i { width:31px;height:31px;display:grid;place-items:center;border-radius:7px;font-size:8px;font-style:normal;font-weight:700; }.asset-png { color:#1e603d;background:#e2f0d1; }.asset-svg { color:#9a4f23;background:#f7dfc8; }.asset-bw { color:#423a31;background:#e7e5e1; }.asset-list span { flex:1; }.asset-list b,.asset-list small { display:block; }.asset-list b { color:#514739;font-size:9px; }.asset-list small { margin-top:2px;color:#9b8e7d;font-size:7px; }.asset-list em { color:#8a7b69;font-size:15px;font-style:normal; }.brand-look { display:grid;grid-template-columns:1fr 1fr;gap:8px; }.colour-set,.type-sample { min-height:82px;padding:11px;border-radius:12px;background:#f1ece1; }.colour-set i { width:25px;height:25px;display:inline-block;margin-right:-5px;border:2px solid #f1ece1;border-radius:50%;background:var(--colour); }.colour-set span,.type-sample span { display:block;margin-top:10px;color:#8c7e6b;font-size:8px; }.type-sample b { display:block;font:600 17px/.87 "Playfair Display";letter-spacing:-.065em;color:#31563e; }.social-assets { margin-top:14px;padding:13px;display:flex;align-items:center;justify-content:space-between;border-radius:15px;background:#70448f;color:#fcf5e9;position:relative;overflow:hidden; }.social-assets:after { content:"";position:absolute;width:110px;height:110px;border-radius:50%;right:-39px;top:-47px;border:13px solid #e8c179;opacity:.4; }.social-assets span,.social-assets b,.social-assets small { position:relative;z-index:1;display:block; }.social-assets span { color:#e6d4ef;font-size:7px; }.social-assets b { margin-top:5px;font-size:12px;letter-spacing:-.04em;line-height:.95; }.social-assets small { max-width:175px;margin-top:6px;color:#dfd3e7;font-size:8px;line-height:1.2; }.social-assets i { position:relative;z-index:1;width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:#f7efd8;color:#70448f;font:25px "Playfair Display";transform:rotate(-6deg); }

.page-settings { background:#fff9ed; }.page-settings .section-note { margin:0; }.settings-preview { display:flex;align-items:center;gap:9px;margin:17px 0;padding:10px;border-radius:13px;background:#e2efd3;color:#31543d; }.settings-preview > div { width:35px;height:35px;display:grid;place-items:center;border-radius:10px;background:#1e603d;color:#e0ef9b;font:20px "Playfair Display"; }.settings-preview span { flex:1; }.settings-preview b,.settings-preview small { display:block; }.settings-preview b { font-size:10px; }.settings-preview small { margin-top:3px;color:#5f8266;font-size:8px; }.settings-preview i { color:#38914d;font-size:11px;font-style:normal; }.page-settings .cta { margin-top:17px; }.settings-view { width:100%;margin-top:9px;padding:10px;background:transparent;color:#925a2c;font-size:10px;font-weight:700; }.orders-screen { background:#fff9ed; }.orders-title { display:flex;align-items:start;justify-content:space-between; }.orders-title .screen-title { margin:7px 0 0; }.orders-title p { margin:5px 0 16px;color:#938471;font-size:9px; }.orders-title > button { width:35px;height:35px;margin-top:6px;border-radius:50%;background:#1e603d;color:#fff;font-size:22px; }.order-list { display:grid;gap:9px; }.order-list article { display:grid;grid-template-columns:42px 1fr auto;column-gap:9px;row-gap:3px;padding:10px;border-radius:13px;background:#fffdf7;box-shadow:inset 0 0 0 1px #eee6d9; }.order-thumb { grid-row:span 2;width:42px;height:42px;display:grid;place-items:center;border-radius:9px;background:#1e603d;color:#e0ee9f;font:21px "Playfair Display"; }.order-list span,.order-list b,.order-list small { display:block; }.order-list span { color:#9a8b79;font:7px "DM Mono"; }.order-list b { margin-top:3px;font-size:10px; }.order-list small { margin-top:3px;color:#8e8070;font-size:8px; }.order-list strong { padding:4px 5px;align-self:start;border-radius:5px;background:#e8f2d4;color:#3b7748;font-size:7px; }.order-list em { grid-column:2/-1;color:#5e503f;font-size:9px;font-style:normal;font-weight:700; }.empty-orders { padding:27px 23px;text-align:center;border-radius:16px;background:#f1ece1;color:#847663; }.empty-orders i,.empty-orders b,.empty-orders span { display:block; }.empty-orders i { color:#b16a2f;font-size:27px;font-style:normal; }.empty-orders b { margin-top:8px;color:#514638;font-size:11px; }.empty-orders span { margin-top:5px;font-size:8px;line-height:1.4; }.printer-note { display:flex;gap:9px;margin-top:13px;padding:10px;border-radius:11px;background:#f6e9d5;color:#846647; }.printer-note > span { width:21px;height:21px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:#edc58c;color:#8f5821;font-size:10px; }.printer-note p { margin:0;font-size:8px;line-height:1.35; }.printer-note b { display:block;color:#664728;margin-bottom:2px; }

.existing-seller { width:100%;margin-top:12px;padding:10px;display:flex;align-items:center;gap:8px;text-align:left;border-radius:12px;background:#f4ead7;color:#725132; }.existing-seller i { width:25px;height:25px;display:grid;place-items:center;border-radius:8px;background:#d9e99b;color:#31583b;font-style:normal; }.existing-seller span { flex:1; }.existing-seller b,.existing-seller small { display:block; }.existing-seller b { font-size:9px; }.existing-seller small { margin-top:2px;color:#967852;font-size:7px; }.existing-seller em { color:#956a3d;font-size:17px;font-style:normal; }.install-app { width:100%;margin-top:12px;padding:10px;display:flex;align-items:center;gap:8px;text-align:left;border-radius:12px;background:#e7f1d0;color:#31583b;box-shadow:inset 0 0 0 1px #cfe0a6; }.install-app i { width:25px;height:25px;display:grid;place-items:center;border-radius:8px;background:#315e3c;color:#fffdf7;font-style:normal;font-size:16px; }.install-app span { flex:1; }.install-app b,.install-app small { display:block; }.install-app b { font-size:9px; }.install-app small { margin-top:2px;color:#5c7556;font-size:7px; }.install-app em { color:#3c7045;font-size:17px;font-style:normal; }.connect-screen { background:#fff9ed; }.connect-mark { width:62px;height:62px;margin:25px 0 20px;display:grid;place-items:center;border-radius:20px;background:#d76a13;color:#fff8e9;font:36px "Playfair Display";transform:rotate(-8deg);box-shadow:0 13px 24px rgba(183,92,25,.19); }.connect-screen .section-note { margin:0; }.connect-benefits { display:grid;gap:8px;margin:19px 0;padding:12px;border-radius:13px;background:#e8f1d5;color:#3c6d43;font-size:9px;font-weight:600; }.connect-phone { display:flex;align-items:center;border-radius:11px;background:#fffdf7;box-shadow:inset 0 0 0 1px #e9e1d5; }.connect-phone span { padding:13px 10px;border-right:1px solid #e8e0d5;color:#8d6f4b;font:10px "DM Mono"; }.connect-phone input { flex:1;padding:12px;border:0;outline:0;background:transparent;color:#44382e;font-size:12px; }.connect-screen .cta { margin-top:20px; }.connect-foot { margin:10px 0 0;text-align:center;color:#9a8b77;font-size:8px; }.import-screen { background:#fff9ed; }.import-screen .section-note { margin:0; }.import-business { display:flex;align-items:center;gap:10px;margin:18px 0 14px;padding:12px;border-radius:14px;background:#1e603d;color:#fff9e7; }.import-business > div { width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#e1ef9c;color:#31583b;font-size:18px; }.import-business span { flex:1; }.import-business b,.import-business small { display:block; }.import-business b { font-size:11px; }.import-business small { margin-top:3px;color:#d7e6bd;font-size:8px; }.import-business i,.import-products em { width:18px;height:18px;display:grid;place-items:center;border-radius:50%;background:#d9ee99;color:#2b5a39;font-style:normal;font-size:9px; }.import-heading { display:flex;justify-content:space-between;align-items:center;margin-bottom:7px; }.import-heading b { font-size:11px; }.import-heading span { color:#9b8166;font-size:8px; }.import-products { display:grid;gap:7px; }.import-products > div { display:flex;align-items:center;gap:9px;padding:8px;border-radius:10px;background:#fffdf7;box-shadow:inset 0 0 0 1px #eee6db; }.import-products i { width:29px;height:29px;display:grid;place-items:center;border-radius:8px;background:#f3d9bc;color:#8e5832;font:17px "Playfair Display";font-style:normal; }.import-products span { flex:1; }.import-products b,.import-products small { display:block; }.import-products b { font-size:9px; }.import-products small { margin-top:2px;color:#9b8e7d;font-size:7px; }.import-note { display:flex;gap:9px;margin-top:13px;padding:10px;border-radius:11px;background:#f4e6d2;color:#806347; }.import-note > span { width:21px;height:21px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:#efc690;color:#86521f;font-size:11px; }.import-note p { margin:0;font-size:8px;line-height:1.35; }.import-note b { display:block;color:#634222;margin-bottom:2px; }.import-screen .cta { margin-top:15px; }

.sync-card { width:100%;margin:10px 0;padding:10px;display:flex;align-items:center;gap:9px;border-radius:12px;background:#f3eadb;color:#664c33;text-align:left;box-shadow:inset 0 0 0 1px #eadfce; }.sync-card i { width:26px;height:26px;display:grid;place-items:center;border-radius:8px;background:#dceea5;color:#315d3b;font-size:13px;font-style:normal; }.sync-card span { flex:1; }.sync-card b,.sync-card small { display:block; }.sync-card b { font-size:9px; }.sync-card small { margin-top:3px;color:#947b61;font-size:7px; }.sync-card em { color:#9d5b2c;font-size:8px;font-style:normal;font-weight:700; }.customer-inbox-card { width:100%;margin:10px 0;padding:12px;display:flex;align-items:center;justify-content:space-between;border-radius:14px;background:#70448f;color:#fcf7ec;text-align:left;position:relative;overflow:hidden; }.customer-inbox-card:after { content:"";position:absolute;width:85px;height:85px;right:-32px;top:-43px;border:9px solid rgba(232,193,121,.48);border-radius:50%; }.customer-inbox-card span,.customer-inbox-card em { position:relative;z-index:1; }.customer-inbox-card span { display:grid;grid-template-columns:28px 1fr;column-gap:8px; }.customer-inbox-card i { grid-row:span 2;width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:#f6ecd4;color:#70448f;font-style:normal;font-size:15px; }.customer-inbox-card b,.customer-inbox-card small { display:block; }.customer-inbox-card b { font-size:10px; }.customer-inbox-card small { margin-top:3px;color:#e8dff0;font-size:8px; }.customer-inbox-card em { color:#f4dcab;font-size:8px;font-style:normal;font-weight:700; }.manual-payment-note { margin:10px 8px 0;text-align:center;color:#9a7e64;font-size:8px;line-height:1.35; }.form-notice { margin:10px 0 -5px;padding:8px 9px;border-radius:9px;background:#edf3dc;color:#447143;font-size:9px;font-weight:700; }.otp-input { margin-top:4px;text-align:center;letter-spacing:.28em;font:700 19px "DM Mono"; }.delete-product { width:100%;margin-top:8px;padding:9px;background:transparent;color:#ac4b36;font-size:9px;font-weight:700; }.product-card { flex:0 0 115px;text-align:left;background:transparent; }.product-card .product-art { display:grid;place-items:center;transition:transform .35s cubic-bezier(.32,.72,0,1); }.product-card:hover .product-art { transform:translateY(-2px) rotate(-1deg); }.product-card em { display:block;margin-top:4px;color:#b35e1d;font-size:8px;font-style:normal;font-weight:700; }.empty-products { padding:12px;color:#8f806e;font-size:9px; }.customer-order-note { display:flex;gap:8px;align-items:flex-start;margin:13px 20px 0;padding:10px;border-radius:12px;background:#f1eadc;color:#775f47; }.customer-order-note > span { width:21px;height:21px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:#e5d2ad;color:#9a5d29;font-size:12px; }.customer-order-note p { margin:0;font-size:8px;line-height:1.35; }.customer-order-note b { display:block;color:#60452d;margin-bottom:2px; }.product-detail { background:#fff9ed; }.product-detail-art { height:156px;margin:18px 0 14px;display:grid;place-items:center;border-radius:25px;background:radial-gradient(circle at 19% 12%,rgba(255,255,255,.55),transparent 33%),linear-gradient(135deg,#bd754e,#e6bc7b);color:#fff7dc;font:68px "Playfair Display";box-shadow:inset 0 1px 1px rgba(255,255,255,.35); }.product-detail .screen-title { margin:0; }.product-price { margin:7px 0 10px;color:#b45f27;font-size:15px;font-weight:700;letter-spacing:-.04em; }.availability-callout { display:grid;grid-template-columns:12px 1fr;column-gap:7px;margin-top:17px;padding:10px;border-radius:12px;background:#e8f1d6;color:#356440; }.availability-callout > span { grid-row:span 2;color:#278146;font-size:8px; }.availability-callout b,.availability-callout small { display:block; }.availability-callout b { font-size:9px; }.availability-callout small { margin-top:2px;color:#63846a;font-size:8px; }.public-quantity-row { display:flex;gap:7px; }.public-quantity-row button { min-width:36px;padding:9px 7px;border-radius:9px;background:#f1eadf;color:#725e48;font-size:10px;font-weight:700; }.public-quantity-row button.active { background:#1e603d;color:#fff9ed; }.whatsapp-order { margin-top:21px;text-decoration:none; }.customer-orders-screen { background:#fff9ed; }.customer-order-list { display:grid;gap:8px;margin-top:7px; }.customer-order-list article { display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px;border-radius:13px;background:#fffdf7;box-shadow:inset 0 0 0 1px #eee7dc; }.customer-order-list article > div { min-width:0; }.customer-order-list span,.customer-order-list b,.customer-order-list small { display:block; }.customer-order-list span { color:#a16634;font:7px "DM Mono"; }.customer-order-list b { margin-top:4px;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }.customer-order-list small { margin-top:4px;color:#938476;font-size:8px; }.customer-order-list select { max-width:74px;padding:6px 4px;border:0;border-radius:7px;background:#e8f1d6;color:#3b7045;font-size:8px;font-weight:700;outline:0; }.empty-customer-orders { display:grid;justify-items:center;gap:8px;margin-top:19px;padding:24px 20px;text-align:center;border-radius:16px;background:#f1eadf;color:#7c6a59; }.empty-customer-orders i { width:34px;height:34px;display:grid;place-items:center;border-radius:11px;background:#e3d0af;color:#9d622f;font-size:18px;font-style:normal; }.empty-customer-orders b { color:#5b4939;font-size:11px; }.empty-customer-orders span { max-width:230px;font-size:8px;line-height:1.35; }.customer-order-tip { display:flex;gap:9px;margin-top:13px;padding:11px;border-radius:11px;background:#f3e8d3;color:#806448; }.customer-order-tip > span { width:21px;height:21px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:#efc78e;color:#805020;font-size:11px; }.customer-order-tip p { margin:0;font-size:8px;line-height:1.35; }.customer-order-tip b { display:block;color:#634222;margin-bottom:2px; }.customer-order-editor { background:#fff9ed; }.customer-order-editor select { appearance:auto; }.whatsapp-button { text-decoration:none; }.status-awaiting-payment { background:#f8ead3 !important;color:#9a5d28 !important; }
.ref-field select { display:block;margin-top:3px;width:100%;padding:0;border:0;outline:0;color:#2e281d;background:transparent;font-size:11px; }.ref-field.is-hidden { display:none; }.phone-location-button { width:calc(100% - 18px);margin:5px 9px 7px;padding:8px;border-radius:8px;background:#edf3df;color:#356442;font-size:9px;font-weight:700;text-align:center; }.location-notice { margin:0 10px 8px;padding:7px 8px;border-radius:7px;background:#f5ecd9;color:#8b6339;font-size:8px;line-height:1.3; }.settings-phone-location { width:100%;margin:9px 0 0;padding:10px;border-radius:11px; }.saved-pin { margin:8px 0 0;padding:8px 9px;border-radius:9px;background:#e8f1d6;color:#3a7548;font-size:8px;font-weight:700; }.directions-button { display:flex;align-items:center;gap:9px;margin:11px 20px 0;padding:10px 11px;border-radius:13px;background:#f3eadb;color:#60472f;text-decoration:none;box-shadow:inset 0 0 0 1px #eadfce; }.directions-button i { width:29px;height:29px;display:grid;place-items:center;border-radius:9px;background:#e5d2ad;color:#92591f;font-style:normal;font-size:17px; }.directions-button span { flex:1; }.directions-button b,.directions-button small { display:block; }.directions-button b { font-size:9px; }.directions-button small { margin-top:3px;color:#957a5c;font-size:8px; }.directions-button em { color:#9a5d2a;font-size:16px;font-style:normal; }.whatsapp-button { text-decoration:none; }.status-awaiting-payment { background:#f8ead3 !important;color:#9a5d28 !important; }
.product-art.has-photo,.product-detail-art.has-photo,.product-manager-list article > i.has-photo,.product-photo-placeholder.has-photo { overflow:hidden;background:#ded2c2;color:transparent; }.product-art.has-photo img,.product-detail-art.has-photo img,.product-manager-list article > i.has-photo img,.product-photo-placeholder.has-photo img { width:100%;height:100%;display:block;object-fit:cover; }.product-photo-picker { display:grid;gap:4px;padding:11px 12px;border-radius:13px;background:#f0eadf;color:#795d40;cursor:pointer; }.product-photo-picker input { position:absolute;inline-size:1px;block-size:1px;opacity:0; }.product-photo-picker span { color:#315f3d;font-size:10px;font-weight:700; }.product-photo-picker small { color:#927e68;font-size:8px; }.product-photo-picker:focus-within { outline:2px solid #1e603d;outline-offset:2px; }.product-photo-placeholder.has-photo { height:135px;position:relative; }.product-photo-placeholder.has-photo span { position:absolute;right:8px;bottom:8px;padding:5px 6px;border-radius:6px;background:rgba(34,31,22,.68);color:#fffaf0;font-size:7px; }.product-photo-notice { min-height:10px;margin:6px 2px 0;color:#a55d32;font-size:8px; }

@keyframes float-up { from{opacity:0;transform:translateY(25px)} to{opacity:1;transform:translateY(0)} }
@keyframes screen-in { from { opacity:0; transform:translateX(15px) } to { opacity:1; transform:translateX(0) } }
@keyframes spin { to{ transform:rotate(360deg) } }
.auth-screen{padding-top:42px}.auth-lockup{display:flex;align-items:center;gap:10px;margin-bottom:48px;font-weight:800;font-size:18px;color:#173f2d}.auth-lockup .brand-mark{width:42px;height:42px}.auth-screen .screen-title{white-space:pre-line}.auth-legal{margin:20px 4px 0;color:#73786f;font-size:12px;line-height:1.6}.auth-legal a{color:#275a3c;font-weight:700}.sign-out{margin:26px auto 0;display:block;color:#8a4a2a}.existing-seller-note{cursor:default}.existing-seller-note em{display:none}.workspace-metrics{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:10px 0}.workspace-metrics div{padding:12px;border-radius:13px;background:#f3eadb;box-shadow:inset 0 0 0 1px #eadfce}.workspace-metrics span,.workspace-metrics b{display:block}.workspace-metrics span{color:#8b745d;font-size:8px}.workspace-metrics b{margin-top:3px;color:#315e3c;font-size:20px}
.pending-live-card{background:#f5e8d5!important;color:#735230!important}.pending-live-card button{background:#fff8ed!important;color:#765231!important}
@media (max-width: 850px) { .app-shell{display:block;padding:0}.desktop-intro{display:none}.phone-wrap{animation:none}.phone-bezel{padding:0;border-radius:0;box-shadow:none;background:none}.phone{width:100%;height:100dvh;min-height:0;border-radius:0}.screen{padding:27px 20px 26px}.grain{opacity:.035} }
.logo-brief{min-height:128px;resize:vertical}.logo-brief-note{margin:8px 0 22px;color:#657168;font-size:12px;line-height:1.55}.generation-caption{margin-top:18px!important;font-size:12px!important;opacity:.8}.generated-logo-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.logo-option.generated{position:relative;padding:0;overflow:hidden;min-height:142px;background:#f4f1ea}.generated-mark{width:100%;height:142px;padding:8px;display:grid;place-items:center;background:#f4f1ea}.generated-logo-art{display:block;width:100%;height:100%;object-fit:contain}.logo-source{position:absolute;left:7px;bottom:7px;padding:3px 6px;border-radius:999px;background:#fffdf9e8;color:#33483b;font-size:10px;font-weight:800}.logo-source.soko{background:#e5edce}.generated-preview{overflow:hidden;background:#f4f1ea}.generated-preview .generated-logo-art{border-radius:10px}.generated-kit-hero{overflow:hidden}.generated-kit-hero .kit-logo{width:148px;height:148px;padding:10px;background:#fffdf9;border-radius:18px;overflow:hidden}.generated-kit-hero .generated-logo-art{border-radius:10px}.focus-symbol .generated-logo-art,.public-logo .generated-logo-art,.card-face .generated-logo-art,.order-thumb .generated-logo-art{max-width:100%;max-height:100%;object-fit:contain}.focus-symbol{overflow:hidden}.public-logo{overflow:hidden}.card-face span:has(.generated-logo-art){display:block;height:58px}.order-thumb:has(.generated-logo-art){padding:3px;overflow:hidden}@media(max-width:440px){.generated-logo-grid{gap:9px}.logo-option.generated,.generated-mark{min-height:108px;height:108px}.logo-source{font-size:9px;left:4px;bottom:4px}}
.generation-limit { display:block; padding:12px; border-radius:12px; background:#e9f0dc; color:#3d6847; font-size:12px; font-weight:700; text-align:center; }
.style-selection-screen { background:#fff9ed; }.style-selection-intro { margin-top:22px; }.style-selection-intro .mini-label { color:#a05f32; }.style-selection-intro .screen-title { margin:7px 0 0; }.style-selection-intro .section-note { max-width:285px; margin:9px 0 20px; font-size:12px; line-height:1.5; }.style-selection-studies { margin-top:0; padding:10px; }.style-selection-studies .style-study { min-height:150px; }.style-selection-studies .style-study:has(.style-study-image) { min-height:150px; }.style-selection-studies .style-study-image { height:150px; }.style-selection-studies .style-study-footer { padding:9px 6px 6px; }.style-selection-studies .style-study-footer b { font-size:11px; }.style-selection-studies .style-study-footer small { font-size:8px; }.style-selection-note { display:flex; gap:9px; align-items:flex-start; margin:14px 0 8px; padding:11px; border-radius:13px; background:#eff3e5; color:#52634f; font-size:10px; line-height:1.45; }.style-selection-note > span:first-child { display:grid; place-items:center; flex:0 0 22px; width:22px; height:22px; border-radius:50%; background:#d5e7ad; color:#315f3d; font-size:12px; }.style-selection-note b { color:#315f3d; }.style-back { display:block; width:100%; padding:11px; color:#75614e; font-size:11px; text-align:center; }
.test-business-fill { display:flex; width:100%; gap:10px; align-items:center; margin:0 0 13px; padding:11px 12px; border-radius:13px; background:#e6f0d6; color:#315f3d; text-align:left; box-shadow:inset 0 0 0 1px rgba(49,95,61,.09); }.test-business-fill > span:first-child { display:grid; place-items:center; flex:0 0 25px; width:25px; height:25px; border-radius:9px; background:#cce29e; font-size:13px; }.test-business-fill > span:nth-child(2) { flex:1; }.test-business-fill b,.test-business-fill small { display:block; }.test-business-fill b { font-size:10px; }.test-business-fill small { margin-top:2px; color:#698064; font-size:8px; }.test-business-fill em { color:#477348; font-size:18px; font-style:normal; }
.home-test-business { margin-top:12px; background:#f0eadb; color:#72573c; }.home-test-business > span:first-child { background:#ead3a8; }.home-test-business small { color:#8a755a; }.home-test-business em { color:#8a6642; }
.form-progress-callout{display:flex;gap:10px;align-items:flex-start;margin:0 0 18px;padding:12px;border-radius:12px;background:#e8f0dc;color:#395a42;font-size:12px;line-height:1.45}.form-progress-callout>span{display:grid;place-items:center;flex:0 0 20px;height:20px;border-radius:50%;background:#2d6945;color:#fff;font-weight:800}.form-progress-callout p{margin:0}.form-progress-callout b{display:block}

/* Business card studio */
.card-studio-screen,.card-editor-screen{background:#fff9ed}.card-studio-screen .screen-title em{font-family:"Playfair Display",serif;font-weight:600}.card-studio-screen .section-note{max-width:330px}.card-studio-preview{margin:15px 0 22px;padding:11px;border-radius:25px;background:#eee6d8;box-shadow:inset 0 1px 1px rgba(255,255,255,.8),0 12px 25px rgba(76,49,23,.09)}.preview-toolbar{display:flex;align-items:center;justify-content:space-between;padding:2px 2px 10px;color:#8b745d;font:500 8px "DM Mono",monospace;letter-spacing:.08em;text-transform:uppercase}.preview-toolbar button{padding:7px 9px;border-radius:8px;background:#fffaf0;color:#356142;font:700 8px "DM Sans",sans-serif;letter-spacing:0;text-transform:none;box-shadow:inset 0 0 0 1px #dfd3c0}.business-card-preview{min-height:202px;aspect-ratio:1.67/1;padding:17px;position:relative;overflow:hidden;border-radius:19px;color:#f8f6e8;background:#1e603d;box-shadow:0 15px 23px rgba(41,53,29,.2),inset 0 1px 1px rgba(255,255,255,.22);isolation:isolate}.business-card-preview.compact{min-height:150px;aspect-ratio:1.67/1;border-radius:14px;padding:13px}.bc-orbit{position:absolute;width:190px;height:190px;right:-76px;bottom:-122px;border:15px solid rgba(221,241,157,.6);border-radius:50%;box-shadow:0 0 0 18px rgba(221,241,157,.08),0 0 0 36px rgba(221,241,157,.06);transform:rotate(15deg);z-index:-1}.bc-topline{display:flex;align-items:center;justify-content:space-between;gap:10px}.bc-topline>span{display:grid;place-items:center;width:35px;height:35px;border-radius:10px;background:#e2f0bf;color:#205437;font:19px "Playfair Display";overflow:hidden}.bc-topline>span:has(img){padding:3px}.bc-topline>span img{width:100%;height:100%;object-fit:contain}.bc-topline small{max-width:58%;color:#dce8bf;font:500 7px "DM Mono",monospace;letter-spacing:.1em;text-align:right;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bc-person{position:absolute;left:17px;right:105px;bottom:46px}.business-card-preview.compact .bc-person{left:13px;bottom:33px}.bc-person b,.bc-person span,.bc-contact span{display:block}.bc-person b{font:600 24px/.9 "Playfair Display",serif;letter-spacing:-.065em}.business-card-preview.compact .bc-person b{font-size:17px}.bc-person span{margin-top:6px;color:#d9e6bd;font-size:9px}.business-card-preview.compact .bc-person span{margin-top:4px;font-size:7px}.bc-contact{position:absolute;left:17px;bottom:17px;color:#d8e5bd;font:500 7px "DM Mono",monospace;letter-spacing:.04em}.business-card-preview.compact .bc-contact{left:13px;bottom:11px;font-size:5px}.bc-contact span+span{margin-top:3px}.bc-qr{position:absolute;right:16px;bottom:16px;display:grid;justify-items:center;gap:5px}.business-card-preview.compact .bc-qr{right:12px;bottom:11px;transform:scale(.72);transform-origin:bottom right}.bc-qr .qr-large{width:54px;height:54px;padding:6px;background-color:#fff;background-size:auto}.bc-qr .qr-large i{inset:13px}.bc-qr .qr-large b{font-size:15px}.bc-qr small{color:#e0edc4;font:500 6px/1.05 "DM Mono",monospace;letter-spacing:.08em;text-align:center}.bc-sunset{color:#fff8ee;background:#bb6447;box-shadow:0 15px 23px rgba(117,57,31,.18),inset 0 1px 1px rgba(255,255,255,.25)}.bc-sunset .bc-orbit{border-color:rgba(250,216,164,.65);box-shadow:0 0 0 18px rgba(250,216,164,.09),0 0 0 36px rgba(250,216,164,.06)}.bc-sunset .bc-topline>span{background:#f7d5a2;color:#6a3c2b}.bc-sunset .bc-topline small,.bc-sunset .bc-person span,.bc-sunset .bc-contact span,.bc-sunset .bc-qr small{color:#fae5c9}.bc-sunset .bc-qr .qr-large b{color:#b85f3d}.bc-paper{color:#395240;background:#efe7d7;box-shadow:0 15px 23px rgba(88,67,39,.14),inset 0 1px 1px rgba(255,255,255,.75)}.bc-paper .bc-orbit{border-color:rgba(160,107,64,.34);box-shadow:0 0 0 18px rgba(160,107,64,.07),0 0 0 36px rgba(160,107,64,.04)}.bc-paper .bc-topline>span{background:#d8e8bd;color:#2c5a3a}.bc-paper .bc-topline small,.bc-paper .bc-person span,.bc-paper .bc-contact span,.bc-paper .bc-qr small{color:#6f7860}.bc-paper .bc-qr .qr-large b{color:#a85e38}.preview-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 2px 0}.preview-meta b{font-size:11px;letter-spacing:-.03em}.preview-meta span{color:#8c7862;font-size:8px}.card-section-heading{display:flex;align-items:end;justify-content:space-between;gap:10px;margin:15px 1px 9px}.card-section-heading b,.card-section-heading small{display:block}.card-section-heading b{font-size:12px;letter-spacing:-.035em}.card-section-heading small{margin-top:3px;color:#958877;font-size:8px}.card-section-heading>span{color:#a86a3d;font:500 8px "DM Mono",monospace;white-space:nowrap}.card-theme-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.card-theme-option{min-width:0;padding:8px;text-align:left;border-radius:13px;background:#fffdf7;color:#4b4235;box-shadow:inset 0 0 0 1px #eee5d7;position:relative;transition:transform .42s cubic-bezier(.32,.72,0,1),box-shadow .42s cubic-bezier(.32,.72,0,1)}.card-theme-option:hover{transform:translateY(-3px);box-shadow:0 9px 18px rgba(79,50,28,.11)}.card-theme-option.active{box-shadow:inset 0 0 0 2px #1e603d;background:#f6f8ea}.theme-swatch{height:54px;display:block;position:relative;overflow:hidden;border-radius:9px;margin-bottom:7px}.theme-swatch i{position:absolute;right:-10px;bottom:-24px;width:61px;height:61px;border:7px solid rgba(229,241,164,.55);border-radius:50%}.theme-swatch.bc-paper i{border-color:rgba(153,95,56,.25)}.theme-swatch.bc-sunset i{border-color:rgba(255,222,174,.55)}.card-theme-option b,.card-theme-option small{display:block}.card-theme-option b{font-size:9px}.card-theme-option small{margin-top:3px;color:#988b7a;font-size:7px;line-height:1.2}.card-theme-option em{position:absolute;right:8px;top:8px;display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:#d9eb9e;color:#2d633e;font-size:9px;font-style:normal}.team-cards-panel{margin-top:20px}.team-card-list{display:grid;gap:7px}.team-card-row{width:100%;display:flex;align-items:center;gap:9px;padding:9px;text-align:left;border-radius:12px;background:#fffdf7;color:#4a4033;box-shadow:inset 0 0 0 1px #eee6d9;transition:transform .42s cubic-bezier(.32,.72,0,1),box-shadow .42s cubic-bezier(.32,.72,0,1)}.team-card-row:hover{transform:translateX(3px)}.team-card-row.active{background:#eef4db;box-shadow:inset 0 0 0 1.5px #7ea15f}.team-card-row>i{width:31px;height:31px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;background:#1e603d;color:#e4f1b3;font:600 15px "Playfair Display";font-style:normal}.team-card-row>span{min-width:0;flex:1}.team-card-row b,.team-card-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.team-card-row b{font-size:10px}.team-card-row small{margin-top:3px;color:#948878;font-size:8px}.team-card-row em{color:#8a765f;font-size:8px;font-style:normal;font-weight:700;white-space:nowrap}.add-card-person{width:100%;margin-top:8px;padding:11px;border-radius:11px;background:#e9f0d6;color:#315e3d;font-size:10px;font-weight:700}.qr-package-panel{display:grid;grid-template-columns:58px 1fr;gap:10px;align-items:center;margin-top:19px;padding:11px;border-radius:16px;background:#f2eadc;color:#544431;box-shadow:inset 0 0 0 1px #eadfce}.qr-package-art{display:grid;place-items:center;width:58px;height:58px;border-radius:12px;background:#fffdf7}.qr-package-art .qr-large{width:49px;height:49px;padding:5px;background-size:auto}.qr-package-art .qr-large i{inset:12px}.qr-package-art .qr-large b{font-size:13px}.qr-package-panel .mini-label{display:block;color:#a36131;font-size:7px}.qr-package-panel b{display:block;margin-top:3px;font-size:10px}.qr-package-panel small{display:block;margin-top:3px;color:#8a7965;font-size:8px;line-height:1.3}.qr-package-panel>button{grid-column:1/-1;padding:9px;border-radius:9px;background:#1e603d;color:#fffdf5;font-size:9px;font-weight:700}.coming-soon-print{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding:12px;border-radius:15px;background:#f8e8d8;color:#5d422d}.coming-soon-print .mini-label{display:block;color:#b26632;font-size:7px}.coming-soon-print b{display:block;margin-top:4px;font-size:10px}.coming-soon-print small{display:block;margin-top:3px;color:#94765c;font-size:8px;line-height:1.25}.coming-soon-print>span{padding:6px 7px;border-radius:7px;background:#efd0ae;color:#a45b2d;font:700 7px "DM Mono",monospace;letter-spacing:.08em}.card-studio-screen>.cta{margin-top:17px}.card-editor-screen .screen-title{margin-bottom:8px}.editor-card-preview{margin:15px 0 4px;padding:8px;border-radius:18px;background:#eee6d8}.card-editor-screen .business-card-preview{width:100%}.card-phone-toggle{margin-top:17px}.card-editor-screen>.cta{margin-top:19px}
@media(max-width:440px){.card-theme-grid{gap:6px}.card-theme-option{padding:7px}.theme-swatch{height:47px}.business-card-preview{min-height:188px}.card-studio-screen{padding-left:17px;padding-right:17px}}

/* Full business card preview */
.business-card-pair{display:grid;grid-template-columns:1fr;gap:12px}.business-card-pair.compact{gap:8px}.business-card-preview{width:100%}.business-card-back{background:#174830}.bc-back-glow{position:absolute;inset:-45px auto auto -30px;width:190px;height:190px;border:16px solid rgba(221,241,157,.22);border-radius:50%;box-shadow:0 0 0 18px rgba(221,241,157,.07),0 0 0 36px rgba(221,241,157,.05);transform:rotate(-20deg)}.bc-back-brand{position:absolute;left:17px;top:17px;display:flex;align-items:center;gap:8px}.bc-back-brand>span{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:#e2f0bf;color:#205437;font:17px "Playfair Display"}.bc-back-brand b{display:block;font-size:10px;letter-spacing:-.035em}.bc-back-brand small{display:block;margin-top:2px;color:#cfe0b4;font:500 6px "DM Mono",monospace;letter-spacing:.08em;text-transform:uppercase}.bc-back-message{position:absolute;left:17px;bottom:51px;color:#e9f1d5;font:500 13px/1.03 "DM Sans",sans-serif;letter-spacing:-.04em}.bc-back-message em{color:#d9fb86;font:600 18px/.9 "Playfair Display",serif}.bc-back-contact{position:absolute;left:17px;bottom:17px;display:grid;gap:3px;color:#cfe0b4;font:500 6px "DM Mono",monospace;letter-spacing:.03em}.bc-back-qr{position:absolute;right:16px;top:17px;display:grid;justify-items:center;gap:5px}.bc-back-qr .qr-large{width:61px;height:61px;padding:7px}.bc-back-qr .qr-large i{inset:14px}.bc-back-qr small{max-width:65px;color:#dce8bf;font:500 6px/1.05 "DM Mono",monospace;letter-spacing:.06em;text-align:center}.bc-sunset .bc-back-glow{border-color:rgba(250,216,164,.3);box-shadow:0 0 0 18px rgba(250,216,164,.08),0 0 0 36px rgba(250,216,164,.05)}.bc-sunset .bc-back-message em{color:#f8d59d}.bc-paper .business-card-back{background:#e3dac8}.bc-paper .bc-back-glow{border-color:rgba(160,107,64,.2)}.bc-paper .bc-back-message{color:#4e6551}.bc-paper .bc-back-message em{color:#9a5a39}.bc-paper .bc-back-contact{color:#6f7860}.bc-paper .bc-back-qr small{color:#6f7860}.print-preview .business-card-pair{position:relative;z-index:1}.print-preview .business-card-preview{min-height:176px}.print-preview .preview-caption{margin-top:14px}
.business-card-front .bc-topline>span{width:56px;height:56px;border-radius:14px;font-size:25px}.business-card-front .bc-topline>span:has(img){padding:4px}.business-card-front .bc-topline>span img{transform:scale(1.12)}.business-card-pair.compact .business-card-front .bc-topline>span{width:44px;height:44px;border-radius:11px;font-size:20px}
@media(min-width:560px){.business-card-pair:not(.compact){grid-template-columns:1fr 1fr}.business-card-pair:not(.compact) .business-card-preview{min-height:176px}.business-card-pair:not(.compact) .bc-person b{font-size:20px}.business-card-pair:not(.compact) .bc-person{bottom:42px}.business-card-pair:not(.compact) .bc-contact{bottom:15px}}
.print-checkout .print-item-row,.print-checkout .field-label:has(+ .print-item-row){display:none}