.mdsv-app {
  --mdsv-ink: #342d29;
  --mdsv-ink-2: #4a403a;
  --mdsv-sand: #c8b9a6;
  --mdsv-sand-2: #e7ddd1;
  --mdsv-cream: #f8f4ee;
  --mdsv-paper: #fffdf9;
  --mdsv-line: rgba(64, 55, 49, .12);
  --mdsv-muted: #746a64;
  position: relative;
  isolation: isolate;
  direction: rtl;
  max-width: 1180px;
  margin: 42px auto;
  padding: clamp(20px, 4vw, 44px);
  overflow: hidden;
  color: var(--mdsv-ink);
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 36px;
  background: radial-gradient(circle at 8% 8%, rgba(200,185,166,.35), transparent 26%), radial-gradient(circle at 96% 86%, rgba(64,55,49,.10), transparent 28%), linear-gradient(145deg, #fdfbf7 0%, #f1eae1 100%);
  box-shadow: 0 35px 100px rgba(52,45,41,.14);
  font-family: 'MDSV IranSans', 'IRANSansX', 'IRANSans', Tahoma, sans-serif;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  scroll-margin-top: 30px;
}
.mdsv-app *, .mdsv-app *::before, .mdsv-app *::after { box-sizing: border-box; }
.mdsv-orb { position:absolute; z-index:-1; border-radius:50%; filter:blur(4px); pointer-events:none; }
.mdsv-orb--one { width:220px; height:220px; top:-95px; right:-70px; background:rgba(255,255,255,.62); }
.mdsv-orb--two { width:180px; height:180px; bottom:-95px; left:-45px; background:rgba(200,185,166,.32); }
.mdsv-progress { max-width: 760px; margin: 0 auto 28px; }
.mdsv-progress__labels { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; color:#9c9189; font-size:12px; font-weight:600; }
.mdsv-progress__labels span { display:flex; align-items:center; gap:7px; transition:.25s ease; }
.mdsv-progress__labels b { display:grid; place-items:center; width:27px; height:27px; border:1px solid var(--mdsv-line); border-radius:50%; background:rgba(255,255,255,.55); font-size:11px; }
.mdsv-progress__labels .is-active { color:var(--mdsv-ink); }
.mdsv-progress__labels .is-active b { color:#fff; border-color:var(--mdsv-ink); background:var(--mdsv-ink); box-shadow:0 6px 14px rgba(52,45,41,.18); }
.mdsv-progress__bar { height:5px; overflow:hidden; border-radius:99px; background:rgba(64,55,49,.09); }
.mdsv-progress__bar span { display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,var(--mdsv-sand),var(--mdsv-ink)); transition:width .45s cubic-bezier(.22,1,.36,1); }
.mdsv-panel { position:relative; overflow:hidden; padding:clamp(26px,5vw,60px); border:1px solid rgba(255,255,255,.78); border-radius:30px; background:rgba(255,253,249,.86); box-shadow:0 22px 65px rgba(52,45,41,.09), inset 0 1px 0 #fff; backdrop-filter:blur(16px); }
.mdsv-panel::before { content:""; position:absolute; inset:0 0 auto; height:4px; background:linear-gradient(90deg,var(--mdsv-ink),var(--mdsv-sand),transparent); }
.mdsv-step { display:none; }
.mdsv-step.is-active { display:block; animation:mdsv-in .45s cubic-bezier(.22,1,.36,1); }
.mdsv-heading { max-width:720px; margin:0 auto 40px; text-align:center; }
.mdsv-eyebrow { display:inline-flex; align-items:center; gap:8px; margin-bottom:12px; color:#78695f; font-size:12px; font-weight:800; letter-spacing:.01em; }
.mdsv-eyebrow i { width:7px; height:7px; border-radius:50%; background:var(--mdsv-sand); box-shadow:0 0 0 5px rgba(200,185,166,.18); }
.mdsv-heading h2, .mdsv-results-head h2, .mdsv-step[data-step="loading"] h2 { margin:0 0 14px; color:var(--mdsv-ink); font-size:clamp(27px,4vw,44px); font-weight:900; line-height:1.42; letter-spacing:-.035em; }
.mdsv-heading p, .mdsv-step[data-step="loading"] p { max-width:610px; margin:0 auto; color:var(--mdsv-muted); font-size:14px; line-height:2; }
.mdsv-form { display:grid; grid-template-columns:1fr 1fr; gap:22px; max-width:820px; margin:auto; }
.mdsv-field { display:flex; flex-direction:column; gap:10px; }
.mdsv-field--full { grid-column:1/-1; }
.mdsv-field label { display:flex; align-items:center; gap:8px; color:var(--mdsv-ink-2); font-size:13px; font-weight:800; }
.mdsv-field label > span { display:grid; place-items:center; width:22px; height:22px; border-radius:7px; color:var(--mdsv-ink); background:var(--mdsv-sand-2); font-size:10px; }
.mdsv-field select, .mdsv-field textarea { width:100%; border:1px solid var(--mdsv-line); border-radius:16px; outline:none; background:rgba(255,255,255,.86); color:var(--mdsv-ink); font:inherit; font-size:14px; transition:border-color .2s, box-shadow .2s, background .2s; }
.mdsv-field select { min-height:56px; padding:0 16px; cursor:pointer; }
.mdsv-field textarea { min-height:142px; padding:16px 18px; resize:vertical; line-height:1.9; }
.mdsv-field select:hover, .mdsv-field textarea:hover { background:#fff; }
.mdsv-field select:focus, .mdsv-field textarea:focus { border-color:var(--mdsv-sand); background:#fff; box-shadow:0 0 0 5px rgba(200,185,166,.19); }
.mdsv-field textarea::placeholder { color:#aaa099; }
.mdsv-colors { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.mdsv-color-picker { position:relative; }
.mdsv-color-picker__trigger { display:flex; align-items:center; width:100%; min-height:58px; padding:8px 12px; direction:ltr; border:1px solid var(--mdsv-line); border-radius:16px; outline:none; color:var(--mdsv-ink); background:rgba(255,255,255,.86); font-family:inherit; cursor:pointer; transition:border-color .2s,box-shadow .2s,background .2s; }
.mdsv-color-picker__trigger:hover { background:#fff; }
.mdsv-color-picker__trigger:focus-visible, .mdsv-color-picker__trigger[aria-expanded="true"] { border-color:var(--mdsv-sand); background:#fff; box-shadow:0 0 0 5px rgba(200,185,166,.19); }
.mdsv-color-picker__trigger > b { margin-left:auto; color:#958980; font-size:20px; font-weight:400; line-height:1; transition:transform .2s; }
.mdsv-color-picker__trigger[aria-expanded="true"] > b { transform:rotate(180deg); }
.mdsv-color-picker__sample { flex:0 0 40px; width:40px; height:40px; margin-right:12px; border:3px solid #fff; border-radius:12px; background:var(--mdsv-picked); box-shadow:0 3px 12px rgba(52,45,41,.2); }
.mdsv-color-picker__code { direction:ltr; unicode-bidi:isolate; color:#5f554f; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:13px; font-weight:700; letter-spacing:.045em; }
.mdsv-color-picker__code::after { content:attr(data-value); }
.mdsv-color-picker__panel { margin-top:10px; padding:16px; border:1px solid rgba(64,55,49,.11); border-radius:18px; background:#fffdf9; box-shadow:0 18px 45px rgba(52,45,41,.13); animation:mdsv-in .22s ease; }
.mdsv-color-picker__panel[hidden] { display:none; }
.mdsv-color-picker__panel p { margin:0 0 12px; color:var(--mdsv-muted); font-size:11px; font-weight:700; }
.mdsv-spectrum { --mdsv-hue:#f00; position:relative; height:150px; margin-bottom:12px; overflow:hidden; border:1px solid rgba(64,55,49,.12); border-radius:14px; outline:none; touch-action:none; cursor:crosshair; background:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,transparent),var(--mdsv-hue); box-shadow:inset 0 0 0 1px rgba(255,255,255,.16); }
.mdsv-spectrum:focus-visible { box-shadow:0 0 0 4px rgba(200,185,166,.24),inset 0 0 0 1px rgba(255,255,255,.16); }
.mdsv-spectrum__cursor { position:absolute; left:50%; top:50%; width:17px; height:17px; border:2px solid #fff; border-radius:50%; transform:translate(-50%,-50%); box-shadow:0 1px 5px rgba(0,0,0,.65),inset 0 0 0 1px rgba(0,0,0,.18); pointer-events:none; }
.mdsv-hue { display:block; width:100%; height:18px; margin:0 0 16px; padding:0; direction:ltr; border:0; border-radius:999px; outline:none; appearance:none; -webkit-appearance:none; background:linear-gradient(to right,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00); cursor:pointer; }
.mdsv-hue::-webkit-slider-thumb { width:20px; height:20px; border:3px solid #fff; border-radius:50%; appearance:none; -webkit-appearance:none; background:transparent; box-shadow:0 1px 6px rgba(0,0,0,.6); }
.mdsv-hue::-moz-range-thumb { width:14px; height:14px; border:3px solid #fff; border-radius:50%; background:transparent; box-shadow:0 1px 6px rgba(0,0,0,.6); }
.mdsv-hue:focus-visible { box-shadow:0 0 0 4px rgba(200,185,166,.24); }
.mdsv-color-picker__panel > label { display:block; margin:15px 0 8px; color:var(--mdsv-muted); font-size:10px; }
.mdsv-swatches { display:grid; grid-template-columns:repeat(6,1fr); gap:8px; direction:ltr; }
.mdsv-swatch { position:relative; aspect-ratio:1; min-width:0; padding:0; border:2px solid #fff; border-radius:10px; outline:1px solid rgba(64,55,49,.1); background:var(--mdsv-swatch); box-shadow:0 2px 8px rgba(52,45,41,.12); cursor:pointer; transition:transform .18s,outline-color .18s; }
.mdsv-swatch:hover { transform:translateY(-2px) scale(1.04); }
.mdsv-swatch.is-selected { outline:2px solid var(--mdsv-ink); outline-offset:2px; }
.mdsv-swatch.is-selected::after { content:"✓"; position:absolute; inset:0; display:grid; place-items:center; color:#fff; font-family:Tahoma,sans-serif; font-size:12px; font-weight:700; text-shadow:0 1px 4px rgba(0,0,0,.7); }
.mdsv-hex-input { display:flex; align-items:center; height:44px; direction:ltr; overflow:hidden; border:1px solid var(--mdsv-line); border-radius:12px; background:#fff; }
.mdsv-hex-input:focus-within { border-color:var(--mdsv-sand); box-shadow:0 0 0 4px rgba(200,185,166,.16); }
.mdsv-hex-input b { padding-left:13px; color:#8b817a; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:13px; }
.mdsv-hex-input input { width:100%; height:100%; padding:0 12px 0 4px; direction:ltr; unicode-bidi:isolate; border:0; outline:0; color:var(--mdsv-ink); background:transparent; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.mdsv-field__meta { display:flex; justify-content:space-between; color:#9b918b; font-size:10px; }
.mdsv-privacy { margin:-7px 2px -2px; color:#91867f; font-size:10px; text-align:center; }
.mdsv-btn { min-height:53px; padding:14px 22px; border:0; border-radius:15px; font-family:inherit; font-size:13px; font-weight:800; cursor:pointer; transition:transform .2s, box-shadow .2s, background .2s, opacity .2s; }
.mdsv-btn:hover { transform:translateY(-2px); }
.mdsv-btn:disabled { opacity:.55; cursor:wait; transform:none; }
.mdsv-btn--primary { display:flex; align-items:center; justify-content:center; gap:14px; margin-top:1px; color:#fff; background:linear-gradient(135deg,var(--mdsv-ink),#51463f); box-shadow:0 14px 30px rgba(52,45,41,.22); }
.mdsv-btn--primary:hover { box-shadow:0 18px 38px rgba(52,45,41,.28); }
.mdsv-btn--primary b { display:grid; place-items:center; width:27px; height:27px; border-radius:9px; background:rgba(255,255,255,.12); font-size:16px; }
.mdsv-message { max-width:820px; margin:18px auto 0; padding:13px 16px; border:1px solid #f0c5ba; border-radius:13px; background:#fff3ef; color:#8b3828; font-size:12px; line-height:1.8; }
.mdsv-hp { position:absolute!important; left:-99999px!important; opacity:0!important; }
.mdsv-step[data-step="loading"] { padding:90px 20px; text-align:center; }
.mdsv-step[data-step="loading"] h2 { margin-top:27px; font-size:clamp(24px,3vw,31px); }
.mdsv-loader { display:grid; grid-template-columns:repeat(2,46px); gap:9px; justify-content:center; transform:rotate(45deg); }
.mdsv-loader span { width:46px; height:46px; border-radius:14px; background:linear-gradient(135deg,var(--mdsv-sand),var(--mdsv-ink)); animation:mdsv-pulse 1.3s ease-in-out infinite; }
.mdsv-loader span:nth-child(2) { animation-delay:.13s; }
.mdsv-loader span:nth-child(3) { animation-delay:.26s; }
.mdsv-loader span:nth-child(4) { animation-delay:.39s; }
.mdsv-results-head { display:flex; align-items:end; justify-content:space-between; gap:20px; margin:30px 4px; }
.mdsv-results-head h2 { margin:0; font-size:clamp(24px,3vw,35px); }
.mdsv-link { padding:5px 0; border:0; border-bottom:1px solid currentColor; background:none; color:var(--mdsv-ink); font-family:inherit; font-size:12px; font-weight:700; white-space:nowrap; cursor:pointer; }
.mdsv-results { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.mdsv-card { overflow:hidden; border:1px solid rgba(255,255,255,.8); border-radius:24px; background:rgba(255,253,249,.92); box-shadow:0 18px 50px rgba(52,45,41,.11); transition:transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s; }
.mdsv-card:hover { transform:translateY(-6px); box-shadow:0 26px 65px rgba(52,45,41,.16); }
.mdsv-card__image { position:relative; aspect-ratio:1/1; overflow:hidden; background:#eae4dc; }
.mdsv-card__image::after { content:""; position:absolute; inset:auto 0 0; height:35%; background:linear-gradient(transparent,rgba(20,15,12,.18)); pointer-events:none; }
.mdsv-card__image img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .55s cubic-bezier(.22,1,.36,1); }
.mdsv-card:hover .mdsv-card__image img { transform:scale(1.025); }
.mdsv-site-mockup { position:absolute; inset:0; z-index:2; display:grid; grid-template-rows:auto 1fr auto; overflow:hidden; color:#29231f; background:#fbfaf7; font-family:inherit; pointer-events:none; }
.mdsv-site-mockup__header { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:14%; padding:10px 13px; border-bottom:1px solid rgba(64,55,49,.1); background:#fff; }
.mdsv-site-mockup__brand { display:flex; align-items:center; gap:6px; flex-shrink:0; font-size:10px; font-weight:900; white-space:nowrap; }
.mdsv-site-mockup__brand i { width:10px; height:10px; border-radius:4px; background:var(--mdsv-preview-primary); box-shadow:5px 5px 0 var(--mdsv-preview-secondary); }
.mdsv-site-mockup__nav { display:flex; align-items:center; gap:10px; overflow:hidden; font-size:7px; font-weight:700; white-space:nowrap; }
.mdsv-site-mockup__nav span:first-child { padding-bottom:3px; border-bottom:2px solid var(--mdsv-preview-secondary); }
.mdsv-site-mockup__main { display:grid; grid-template-columns:1.08fr .92fr; gap:11px; min-height:0; padding:14px; background:linear-gradient(145deg,#fff 0 57%,color-mix(in srgb,var(--mdsv-preview-secondary) 18%,#fff) 57%); }
.mdsv-site-mockup__hero { align-self:center; min-width:0; }
.mdsv-site-mockup__hero > span:first-child { display:inline-block; margin-bottom:7px; padding:3px 7px; border-radius:999px; color:#3c342f; background:var(--mdsv-preview-secondary); font-size:7px; font-weight:900; }
.mdsv-site-mockup__hero h4 { margin:0 0 7px; color:#29231f; font-size:clamp(13px,1.55vw,19px); font-weight:900; line-height:1.55; }
.mdsv-site-mockup__hero p { display:-webkit-box; margin:0 0 11px; overflow:hidden; color:#675d57; font-size:clamp(7px,.76vw,10px); line-height:1.75; -webkit-box-orient:vertical; -webkit-line-clamp:3; }
.mdsv-site-mockup__hero > span:last-child { display:inline-block; padding:6px 11px; border-radius:8px; color:var(--mdsv-preview-on-primary); background:var(--mdsv-preview-primary); font-size:8px; font-weight:900; box-shadow:4px 4px 0 var(--mdsv-preview-secondary); }
.mdsv-site-mockup__media { min-width:0; min-height:0; overflow:hidden; border:4px solid #fff; border-radius:18px 7px 18px 18px; box-shadow:0 12px 28px rgba(30,24,20,.18); }
.mdsv-site-mockup__media img { width:100%; height:100%; object-fit:cover; }
.mdsv-site-mockup__features { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; padding:0 14px 13px; background:#fbfaf7; }
.mdsv-site-mockup__features div { display:flex; align-items:center; gap:6px; min-width:0; padding:8px; border:1px solid rgba(64,55,49,.09); border-radius:10px; background:#fff; }
.mdsv-site-mockup__features i { display:grid; place-items:center; flex:0 0 20px; width:20px; height:20px; border-radius:7px; color:var(--mdsv-preview-on-primary); background:var(--mdsv-preview-primary); font-style:normal; font-size:6px; }
.mdsv-site-mockup__features strong { overflow:hidden; font-size:7px; text-overflow:ellipsis; white-space:nowrap; }
.mdsv-site-mockup[data-variant="2"] { background:#171513; color:#fff; }
.mdsv-site-mockup[data-variant="2"] .mdsv-site-mockup__header { color:#fff; background:#171513; border-color:rgba(255,255,255,.1); }
.mdsv-site-mockup[data-variant="2"] .mdsv-site-mockup__main { background:linear-gradient(135deg,#171513,color-mix(in srgb,var(--mdsv-preview-primary) 32%,#171513)); }
.mdsv-site-mockup[data-variant="2"] .mdsv-site-mockup__hero h4,.mdsv-site-mockup[data-variant="2"] .mdsv-site-mockup__hero p { color:#fff; }
.mdsv-site-mockup[data-variant="2"] .mdsv-site-mockup__features { background:#171513; }
.mdsv-site-mockup[data-variant="2"] .mdsv-site-mockup__features div { color:#fff; background:#24211e; border-color:rgba(255,255,255,.1); }
.mdsv-site-mockup[data-variant="3"] .mdsv-site-mockup__main { grid-template-columns:.92fr 1.08fr; background:linear-gradient(180deg,#fff,#f4f0e9); }
.mdsv-site-mockup[data-variant="3"] .mdsv-site-mockup__hero { order:2; }
.mdsv-site-mockup[data-variant="3"] .mdsv-site-mockup__media { order:1; }
.mdsv-site-mockup[data-variant="3"] .mdsv-site-mockup__media { border-radius:50% 50% 12px 12px; }
.mdsv-site-mockup[data-variant="4"] .mdsv-site-mockup__main { background:linear-gradient(145deg,color-mix(in srgb,var(--mdsv-preview-secondary) 28%,#fff),#fff); }
.mdsv-site-mockup[data-variant="4"] .mdsv-site-mockup__media { transform:rotate(2deg); border-radius:9px 22px 9px 22px; }
.mdsv-site-mockup[data-variant="5"] { color:#eefbff; background:#07161d; }
.mdsv-site-mockup[data-variant="5"] .mdsv-site-mockup__header { color:#eefbff; background:#07161d; border-color:color-mix(in srgb,var(--mdsv-preview-primary) 45%,transparent); }
.mdsv-site-mockup[data-variant="5"] .mdsv-site-mockup__main { grid-template-columns:.82fr 1.18fr; background:repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 26px),linear-gradient(145deg,#07161d,color-mix(in srgb,var(--mdsv-preview-primary) 28%,#07161d)); }
.mdsv-site-mockup[data-variant="5"] .mdsv-site-mockup__hero h4,.mdsv-site-mockup[data-variant="5"] .mdsv-site-mockup__hero p { color:#eefbff; }
.mdsv-site-mockup[data-variant="5"] .mdsv-site-mockup__media { border-radius:4px; border-color:var(--mdsv-preview-secondary); box-shadow:8px 8px 0 color-mix(in srgb,var(--mdsv-preview-primary) 55%,transparent); }
.mdsv-site-mockup[data-variant="5"] .mdsv-site-mockup__features { background:#07161d; }
.mdsv-site-mockup[data-variant="5"] .mdsv-site-mockup__features div { color:#eefbff; background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.12); border-radius:3px; }
.mdsv-site-mockup[data-variant="6"] .mdsv-site-mockup__main { position:relative; display:block; padding:0; background:#f6f0e8; }
.mdsv-site-mockup[data-variant="6"] .mdsv-site-mockup__media { position:absolute; inset:0; border:0; border-radius:0; box-shadow:none; }
.mdsv-site-mockup[data-variant="6"] .mdsv-site-mockup__media::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(20,16,13,.88),rgba(20,16,13,.2)); }
.mdsv-site-mockup[data-variant="6"] .mdsv-site-mockup__hero { position:relative; z-index:2; width:60%; padding:22px 18px; }
.mdsv-site-mockup[data-variant="6"] .mdsv-site-mockup__hero h4,.mdsv-site-mockup[data-variant="6"] .mdsv-site-mockup__hero p { color:#fff; }
.mdsv-site-mockup[data-variant="6"] .mdsv-site-mockup__features div { border:0; border-bottom:3px solid var(--mdsv-preview-primary); border-radius:0; }
.mdsv-site-mockup[data-variant="7"] .mdsv-site-mockup__header { border-bottom:3px solid #211d1a; }
.mdsv-site-mockup[data-variant="7"] .mdsv-site-mockup__main { grid-template-columns:1fr; grid-template-rows:auto 1fr; gap:7px; padding:11px 18px; background:#fff; }
.mdsv-site-mockup[data-variant="7"] .mdsv-site-mockup__hero { display:grid; grid-template-columns:1fr 1.35fr; column-gap:10px; align-items:end; }
.mdsv-site-mockup[data-variant="7"] .mdsv-site-mockup__hero > span:first-child { justify-self:start; }
.mdsv-site-mockup[data-variant="7"] .mdsv-site-mockup__hero h4 { grid-column:1; font-size:12px; }
.mdsv-site-mockup[data-variant="7"] .mdsv-site-mockup__hero p { grid-column:2; grid-row:1 / span 2; margin:0; border-inline-start:3px solid var(--mdsv-preview-secondary); padding-inline-start:8px; }
.mdsv-site-mockup[data-variant="7"] .mdsv-site-mockup__hero > span:last-child { display:none; }
.mdsv-site-mockup[data-variant="7"] .mdsv-site-mockup__media { min-height:0; border:0; border-radius:0; box-shadow:none; }
.mdsv-site-mockup[data-variant="7"] .mdsv-site-mockup__features div { border-radius:0; background:color-mix(in srgb,var(--mdsv-preview-secondary) 14%,#fff); }
.mdsv-site-mockup[data-variant="8"] { background:color-mix(in srgb,var(--mdsv-preview-secondary) 24%,#fff); }
.mdsv-site-mockup[data-variant="8"] .mdsv-site-mockup__header { margin:8px 10px 0; min-height:11%; border:2px solid #29231f; border-radius:999px; box-shadow:3px 3px 0 var(--mdsv-preview-primary); }
.mdsv-site-mockup[data-variant="8"] .mdsv-site-mockup__main { grid-template-columns:.9fr 1.1fr; padding:12px 18px; background:transparent; }
.mdsv-site-mockup[data-variant="8"] .mdsv-site-mockup__hero h4 { transform:rotate(-1deg); font-size:clamp(14px,1.7vw,20px); }
.mdsv-site-mockup[data-variant="8"] .mdsv-site-mockup__hero > span:last-child { border:2px solid #29231f; border-radius:999px; box-shadow:4px 4px 0 var(--mdsv-preview-secondary); }
.mdsv-site-mockup[data-variant="8"] .mdsv-site-mockup__media { transform:rotate(3deg); border:3px solid #29231f; border-radius:48% 52% 45% 55%; box-shadow:7px 7px 0 var(--mdsv-preview-secondary); }
.mdsv-site-mockup[data-variant="8"] .mdsv-site-mockup__features { background:transparent; }
.mdsv-site-mockup[data-variant="8"] .mdsv-site-mockup__features div { border:2px solid #29231f; border-radius:999px; box-shadow:2px 2px 0 var(--mdsv-preview-primary); }
.mdsv-card__placeholder { position:absolute; inset:0; z-index:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; padding:24px; color:var(--mdsv-muted); text-align:center; background:linear-gradient(145deg,#f3ede5,#e5dbcf); }
.mdsv-card__placeholder p { margin:0; font-size:12px; line-height:1.8; }
.mdsv-card__spinner { width:38px; height:38px; border:3px solid rgba(64,55,49,.14); border-top-color:var(--mdsv-ink); border-radius:50%; animation:mdsv-spin .9s linear infinite; }
.mdsv-card:not(.is-loading) .mdsv-card__spinner { display:none; }
.mdsv-card.has-error .mdsv-card__placeholder { color:#8b3828; background:#fff3ef; }
.mdsv-retry { padding:9px 14px; border:1px solid #dcae9f; border-radius:10px; color:#783526; background:#fff; font-family:inherit; font-size:11px; font-weight:700; cursor:pointer; }
.mdsv-retry:hover { color:#fff; background:#8b3828; }
.mdsv-card__body { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:18px; }
.mdsv-card__body span { color:#948880; font-size:10px; }
.mdsv-card__body h3 { margin:4px 0 0; color:var(--mdsv-ink); font-size:16px; font-weight:800; }
.mdsv-select { min-height:44px; padding:11px 16px; color:var(--mdsv-ink); background:var(--mdsv-sand-2); white-space:nowrap; }
.mdsv-select:hover { color:#fff; background:var(--mdsv-ink); }
.mdsv-select[hidden] { display:none; }
.mdsv-more-wrap { display:flex; flex-direction:column; align-items:center; gap:10px; margin:28px 0 8px; text-align:center; }
.mdsv-more { min-width:230px; color:#fff; background:linear-gradient(135deg,var(--mdsv-ink),#51463f); box-shadow:0 12px 28px rgba(52,45,41,.2); }
.mdsv-more:hover { box-shadow:0 17px 36px rgba(52,45,41,.27); }
.mdsv-more[hidden], .mdsv-more-note[hidden] { display:none; }
.mdsv-more-note { margin:0; color:var(--mdsv-muted); font-size:11px; }
@keyframes mdsv-in { from { opacity:0; transform:translateY(12px) scale(.992); } to { opacity:1; transform:none; } }
@keyframes mdsv-pulse { 0%,100% { opacity:.35; transform:scale(.87); } 50% { opacity:1; transform:scale(1); } }
@keyframes mdsv-spin { to { transform:rotate(360deg); } }
@media (max-width:720px) {
  .mdsv-app { margin:18px 0; padding:14px; border-radius:25px; }
  .mdsv-panel { padding:30px 18px; border-radius:22px; }
  .mdsv-form, .mdsv-colors, .mdsv-results { grid-template-columns:1fr; }
  .mdsv-progress__labels { font-size:9px; }
  .mdsv-progress__labels b { width:23px; height:23px; }
  .mdsv-heading { margin-bottom:30px; }
  .mdsv-results-head { align-items:start; flex-direction:column; }
  .mdsv-card__body { align-items:stretch; flex-direction:column; }
  .mdsv-select { width:100%; }
}
@media (prefers-reduced-motion:reduce) {
  .mdsv-app *, .mdsv-app *::before, .mdsv-app *::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
}