.spravki-preview-page { padding-top: clamp(8px, 3vh, 30px); padding-bottom: 24px; }
.spravki-preview {
  --spravki-ease: cubic-bezier(.22, 1, .36, 1);
  position: relative; isolation: isolate; display: grid; grid-template-columns: 1.12fr 1fr;
  align-items: center; gap: 0 22px; min-height: min(690px, calc(100svh - 165px));
  padding: clamp(28px, 4.8vw, 72px); border: 1px solid var(--border-glass-strong); border-radius: 32px;
  overflow: hidden; background: linear-gradient(135deg, var(--bg-glass), var(--control-bg));
  box-shadow: var(--shadow-float); animation: spravki-preview-arrive .95s var(--spravki-ease) both;
}
.spravki-preview::before {
  content: ""; position: absolute; z-index: -1; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse at 86% 38%, rgba(151, 181, 118, .09), transparent 56%),
    linear-gradient(135deg, rgba(231, 244, 211, .035), transparent 45%);
}
.spravki-preview-copy { padding: 14px 0 32px; min-width: 0; }
.spravki-preview-status {
  display: inline-flex; align-items: center; gap: 9px; color: var(--text-secondary);
  padding: 8px 12px; border: 1px solid var(--border-glass); border-radius: 30px;
  background: var(--control-bg); font-size: 12px; letter-spacing: .02em;
}
.spravki-preview-status i { width: 6px; height: 6px; border-radius: 50%; background: var(--color-gold); box-shadow: 0 0 0 4px var(--accent-soft); }
.spravki-preview h1 { margin: 25px 0 22px; font-size: clamp(42px, 4.5vw, 68px); line-height: 1.06; font-weight: 550; letter-spacing: -.055em; text-wrap: balance; }
.spravki-preview h1 span { display: block; color: var(--color-gold); }
.spravki-preview-lead { max-width: 410px; margin: 0 0 14px; color: var(--text-primary); font-size: clamp(17px, 1.55vw, 21px); font-weight: 400; line-height: 1.55; text-wrap: pretty; }
.spravki-preview-note { max-width: 420px; margin: 0; color: var(--text-secondary); font-size: 14px; line-height: 1.75; text-wrap: pretty; }
.spravki-preview-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.spravki-preview-actions .btn { display: inline-flex; justify-content: center; gap: 13px; min-height: 44px; text-decoration: none; padding: 11px 17px; }
.spravki-preview-actions .btn span { transition: transform .45s var(--spravki-ease); }
.spravki-preview-actions .btn:hover span { transform: translate(2px, -2px); }
.spravki-preview-actions .btn:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 4px; }
.spravki-garden { position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: center; align-items: center; min-width: 0; align-self: stretch; }
.spravki-garden-halo { position: absolute; inset: 3% -12% 10%; z-index: -1; pointer-events: none; border-radius: 50%; background: radial-gradient(ellipse, rgba(184, 181, 114, .12), rgba(121, 163, 108, .035) 47%, transparent 68%); animation: spravki-garden-light 8s 3.2s ease-in-out infinite alternate; }
.spravki-growing-wheat { display: block; width: min(100%, 400px); overflow: visible; }
.spravki-ground { fill: url(#spravki-ground-gradient); opacity: .25; }
.spravki-ground-line { stroke: url(#spravki-ground-gradient); stroke-width: 1; }
.spravki-side-left { opacity: .64; }
.spravki-side-right { opacity: .68; }
.spravki-wheat { --growth-delay: 0s; transform-origin: 180px 321px; animation: spravki-wheat-sway 6.8s 3.7s ease-in-out infinite alternate; }
.spravki-wheat-left { --growth-delay: .36s; animation-duration: 7.7s; animation-delay: 3.9s; }
.spravki-wheat-right { --growth-delay: .6s; animation-duration: 8.4s; animation-delay: 4.1s; }
.spravki-stem { stroke: url(#spravki-stalk-gradient); stroke-width: 3.4; stroke-linecap: round; stroke-dasharray: 1; animation: spravki-stem-grow 2.4s calc(.3s + var(--growth-delay)) cubic-bezier(.38, .04, .22, 1) both; }
.spravki-leaf { fill: url(#spravki-leaf-gradient); transform-box: fill-box; animation: spravki-leaf-open 1.5s calc(1.02s + var(--growth-delay)) var(--spravki-ease) both; }
.spravki-leaf-left { transform-origin: 100% 100%; }
.spravki-leaf-right { transform-origin: 0 100%; animation-delay: calc(1.36s + var(--growth-delay)); }
.spravki-leaf-vein { stroke: rgba(218, 230, 178, .35); stroke-width: .8; stroke-linecap: round; stroke-dasharray: 1; animation: spravki-stem-grow 1.4s calc(1.48s + var(--growth-delay)) var(--spravki-ease) both; }
.spravki-vein-right { animation-delay: calc(1.8s + var(--growth-delay)); }
.spravki-ear { fill: url(#spravki-grain-gradient); stroke: rgba(244, 226, 175, .14); stroke-width: .7; }
.spravki-grain-pair, .spravki-grain-tip { transform-box: fill-box; transform-origin: 50% 100%; animation: spravki-grain-ripen 1.35s calc(1.85s + var(--growth-delay)) var(--spravki-ease) both; }
.spravki-grain-1 { animation-delay: calc(2s + var(--growth-delay)); }
.spravki-grain-2 { animation-delay: calc(2.15s + var(--growth-delay)); }
.spravki-grain-3 { animation-delay: calc(2.3s + var(--growth-delay)); }
.spravki-grain-4 { animation-delay: calc(2.45s + var(--growth-delay)); }
.spravki-grain-tip { animation-delay: calc(2.6s + var(--growth-delay)); }
.spravki-awn { stroke: #d7c18a; stroke-width: .8; stroke-linecap: round; stroke-dasharray: 1; opacity: .72; animation: spravki-stem-grow 1.45s calc(2.8s + var(--growth-delay)) var(--spravki-ease) both; }
.spravki-seed { fill: #c2b180; opacity: 0; animation: spravki-seed-sprout 1.5s .05s both; }
.spravki-garden-caption { display: flex; align-items: center; gap: 12px; margin-top: -18px; font-size: 10px; line-height: 1.5; color: var(--text-tertiary); letter-spacing: .04em; text-align: center; white-space: nowrap; animation: spravki-copy-arrive 1.4s .7s var(--spravki-ease) both; }
.spravki-garden-caption span { width: 23px; height: 1px; background: var(--accent-border); }
.spravki-preview-footer { grid-column: 1 / -1; display: flex; align-items: center; gap: 20px; padding-top: 26px; margin-top: 20px; border-top: 1px solid var(--border-glass); }
.spravki-preview-footer > span { color: var(--color-gold); font-size: 10px; font-weight: 600; letter-spacing: .18em; }
.spravki-preview-footer p { margin: 0; color: var(--text-tertiary); font-size: 12px; line-height: 1.6; }
@keyframes spravki-preview-arrive { from { opacity: 0; transform: translateY(15px); } to { opacity: 1; transform: none; } }
@keyframes spravki-copy-arrive { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes spravki-stem-grow { from { stroke-dashoffset: 1; opacity: 0; } 12% { opacity: 1; } to { stroke-dashoffset: 0; } }
@keyframes spravki-leaf-open { from { transform: scale(.05) rotate(-9deg); opacity: 0; } 25% { opacity: .9; } to { transform: scale(1) rotate(0); opacity: 1; } }
@keyframes spravki-grain-ripen { from { transform: scale(.12); opacity: 0; fill: #79a477; } 32% { opacity: 1; fill: #a4b985; } to { transform: scale(1); opacity: 1; } }
@keyframes spravki-seed-sprout { 0%, 25% { opacity: .75; } 100% { opacity: 0; } }
@keyframes spravki-wheat-sway { from { transform: rotate(-1.5deg); } to { transform: rotate(1.7deg); } }
@keyframes spravki-garden-light { from { opacity: .65; transform: scale(.96); } to { opacity: 1; transform: scale(1.04); } }
@media (max-width: 1150px) {
  .spravki-preview { padding: 36px; gap: 0 10px; }
  .spravki-preview h1 { font-size: 48px; }
  .spravki-preview-actions { flex-direction: column; align-items: flex-start; }
  .spravki-preview-actions .btn { min-width: 210px; }
  .spravki-garden-caption { white-space: normal; }
  .spravki-garden-caption span { display: none; }
}
@media (max-width: 760px) {
  .spravki-preview-page { padding-top: 4px; }
  .spravki-preview { grid-template-columns: 1fr; padding: 28px 22px 24px; border-radius: 24px; gap: 0; }
  .spravki-preview-copy { padding: 0; }
  .spravki-preview h1 { margin: 20px 0 18px; font-size: clamp(40px, 9vw, 54px); }
  .spravki-preview h1 span { display: inline; }
  .spravki-preview-lead, .spravki-preview-note { max-width: none; }
  .spravki-preview-actions { flex-direction: row; align-items: stretch; margin-top: 22px; }
  .spravki-preview-actions .btn { min-width: 0; flex: 1 1 auto; }
  .spravki-garden { order: 2; margin-top: 20px; }
  .spravki-growing-wheat { width: 245px; }
  .spravki-garden-caption { margin-top: -13px; }
  .spravki-preview-footer { order: 3; gap: 14px; margin-top: 30px; padding-top: 21px; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .spravki-preview, .spravki-preview *, .spravki-preview *::before, .spravki-preview *::after { animation: none !important; transition: none !important; }
  .spravki-stem, .spravki-leaf-vein, .spravki-awn { stroke-dashoffset: 0; }
  .spravki-seed { opacity: 0; }
}