/* /presentation2, frontend-demo/styles/presentation/journey.css:
   ночной фиолетовый космос, золото, лаванда, мятные искры и стеклянные поверхности. */
:root {
  --gold: #e9c27a;
  --gold-hi: #f8e2b0;
  --lavender: #b9a6f5;
  --lavender-hi: #ddd2ff;
  --mint: #86e3cb;
  --body: #c4c6de;
  --dim: #a4a7c3;
  --glass: linear-gradient(160deg, #2b2d5c66, #0b0c22eb);
  --glass-border: #b9a6f52b;
  --mono: ui-monospace, "JetBrains Mono", "Cascadia Mono", Consolas, "Liberation Mono", monospace;
}
body {
  background: radial-gradient(ellipse at 70% 30%, #15123a 0%, #080920 48%, #04050f 100%);
  background-attachment: scroll;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .35;
  background-image: radial-gradient(circle at 14px 23px, #f8e2b0 0 .7px, transparent 1.2px), radial-gradient(circle at 83px 152px, #ddd2ff 0 .6px, transparent 1.1px), radial-gradient(circle at 187px 42px, #86e3cb 0 .5px, transparent 1px);
  background-size: 307px 263px, 359px 317px, 419px 373px;
}
.exhibition { position: relative; max-width: 1640px; }
.masthead { border-bottom-color: #b9a6f524; gap: 30px; }
.brand { gap: 13px; text-decoration: none; }
.brand-glyph { width: 54px; height: 54px; flex: none; overflow: visible; filter: drop-shadow(0 0 8px #f0c87a33); }
.brand-orbit, .brand-ring { fill: none; stroke: var(--gold); stroke-width: 1.5; }
.brand-core { fill: #f6dca2; }
.brand-satellite { fill: #fff1cf; }
.brand-words { display: grid; gap: 7px; }
.brand-name { color: var(--text); font-size: 25px; font-weight: 400; letter-spacing: -.03em; line-height: 1; }
.brand-note { color: var(--gold); font: 500 9px/1 var(--mono); letter-spacing: .38em; }
.masthead-note { border-left: 1px solid #b9a6f52b; padding-left: 28px; color: var(--body); font-size: 12px; }
.locale { background: #0a0b2044; border-color: var(--glass-border); }
.locale button[aria-pressed=true] { background: #b9a6f518; color: var(--gold-hi); }
button { border-color: var(--glass-border); }
button:hover { border-color: #e9c27a77; background: #25223e; }
.primary { background: linear-gradient(135deg, #f6deae, #e2b86d); border-color: #f2d49a; color: #14112a; box-shadow: 0 8px 26px #e9c27a0d, inset 0 1px #fff5d944; }
.primary:hover { background: linear-gradient(135deg, #fff1cf, #ebc780); border-color: #f8e2b0; }
.secondary { background: #b9a6f508; border-color: #b9a6f540; }
.secondary:hover { background: #b9a6f512; }
.eyebrow { font-family: var(--mono); color: var(--gold); letter-spacing: .16em; }
.welcome { padding: 66px 0 34px; grid-template-columns: 1.08fr 1fr; }
.welcome-copy { position: relative; z-index: 1; }
.welcome h1 { font-weight: 430; line-height: 1.08; font-size: clamp(38px, 4.4vw, 64px); text-wrap: balance; }
.welcome .lede { position: relative; color: var(--body); font-size: 19px; line-height: 1.65; padding-top: 22px; margin-top: 31px; }
.welcome .lede::before { content: ""; position: absolute; top: 0; left: 0; width: 80px; height: 1px; background: linear-gradient(90deg, var(--gold), transparent); }
.experience-notes { color: var(--dim); }
.welcome-art { align-self: center; }
.welcome-art .welcome-sphere { display: block; width: 100%; height: auto; max-height: 520px; filter: none; }
.welcome-art p { color: var(--dim); font: 400 11px/1.6 var(--mono); letter-spacing: .025em; margin: -8px auto 0; }
.sphere-body { filter: drop-shadow(0 0 20px #e9c27a24); }
.sphere-orbits { transform-origin: 310px 260px; animation: sphere-orbit 18s ease-in-out infinite; }
.sphere-card--near { animation: sphere-float 8s ease-in-out infinite; }
.sphere-card--far { animation: sphere-float 9s ease-in-out -3s infinite; }
.sphere-card { filter: drop-shadow(0 12px 20px #02030c80); }
.sphere-stars { opacity: .8; }
.sphere-planet { filter: drop-shadow(0 0 7px #e9c27a77); }
.sample-picker { border-top-color: #b9a6f524; }
.sample-grid button { background: var(--glass); border-color: #e9c27a40; box-shadow: inset 0 1px #fff3d610, 0 12px 24px #02030c44; border-radius: 16px; }
.sample-grid button:hover { border-color: #e9c27a99; background: linear-gradient(160deg, #34315999, #101126eb); }
.sample-icon { color: var(--gold-hi); background: #e9c27a08; border-color: #e9c27a40; }
.form-page .form-grid, .controls-form { border-top: 1px solid #b9a6f524; padding-top: 22px; }
input:not([type=checkbox]):not([type=range]), textarea, select { background: #08091dcc; border-color: #b9a6f540; color: var(--text); }
input::placeholder, textarea::placeholder { color: #a1a1bc; }
input:focus, textarea:focus, select:focus { border-color: var(--gold); }
input[type=range], input[type=checkbox] { accent-color: var(--gold); }
input[type=range] { color: var(--gold); }
.form-page h1, .finish-page h1, .export-page h1, .route-heading h1 { font-weight: 440; text-wrap: balance; }
.clarify blockquote { border-color: #e9c27a66; background: linear-gradient(90deg, #e9c27a0b, transparent); color: var(--body); }
.route-heading, .route-toolbar { border-color: #b9a6f524; }
.mode-badge { color: var(--gold-hi); border-color: #e9c27a40; background: #e9c27a06; }
.mode-badge.sample { color: var(--lavender-hi); border-color: #b9a6f540; background: #b9a6f506; }
.side-panel, .comparison, .export-preview, .feedback, .modal { background: var(--glass); border-color: var(--glass-border); box-shadow: inset 0 1px #fff3d60c, 0 16px 40px #02030c44; }
.side-panel .eyebrow { color: var(--lavender); }
.quest-summary { background: linear-gradient(120deg, #30243a99, #0b0c2299 60%, #b9a6f50b); border-color: #e9c27a40; }
.quest-summary-icon { border-radius: 50%; border-color: #e9c27a66; background: #e9c27a0b; }
.quest-stages li { background: var(--glass); border-color: var(--glass-border); }
.quest-stages li.current { border-color: #e9c27a99; background: linear-gradient(160deg, #352b2099, #0b0c22eb); }
.quest-stages li.passed .quest-stage-number { border-color: #86e3cb88; color: var(--mint); }
.quest-stages li.current .quest-stage-number { border-color: #e9c27a99; color: var(--gold-hi); background: #e9c27a12; }
.quest-halo { background: radial-gradient(circle, #e9c27a1c, #b9a6f510 40%, transparent 68%); }
.quest-destination { background: radial-gradient(circle, #393055, #0b0c22); }
.graph-scroll { background: radial-gradient(ellipse at 15% 45%, #e9c27a0a, transparent 48%), radial-gradient(ellipse at 85% 10%, #b9a6f516, transparent 48%), radial-gradient(circle, #b9a6f52b 0 .6px, transparent 1.2px) 0 0/47px 43px, #08091e; border-color: #b9a6f52b; }
.graph-world::before { border-color: #e9c27a14; }
.graph-node { background: linear-gradient(160deg, #2b2d5ccc, #0b0c22fa); border-color: #e9c27a66; box-shadow: 0 8px 0 -3px #04050f, 0 9px 0 -3px #b9a6f529, 0 14px 26px #02030c55, inset 0 1px #fff3d619; }
.graph-node:hover { background: linear-gradient(160deg, #36345a, #141329); }
.graph-node.selected { background: linear-gradient(160deg, #403329, #191629); border-color: var(--gold-hi); }
.graph-node[data-first=true] { background: linear-gradient(160deg, #352b20, #141627); border-color: #e9c27aaa; }
.graph-node[data-destination=true] { background: linear-gradient(160deg, #353052, #17132d); border-color: #b9a6f599; }
.checkpoint-number { background: #151429; border-color: #b9a6f566; }
.first-marker { background: #352819; color: var(--gold-hi); }
.node-list button { background: var(--glass); border-color: #e9c27a40; }
.node-list button.selected { border-color: var(--gold); background: #30243a; }
.drawer h2, .first-step h2 { color: var(--gold-hi); }
.first-step { background: linear-gradient(160deg, #352b2099, #101126eb); border-color: #e9c27a66; }
.finance-report { background: #e9c27a05; border-color: #e9c27a44; }
.alert { background: #e9c27a06; border-color: #e9c27a40; }
.alert.danger { background: #f19a8608; border-color: #f19a8655; }
footer { border-top-color: #b9a6f524; color: var(--dim); }
@keyframes sphere-float { 50% { transform: translateY(-6px); } }
@keyframes sphere-orbit { 50% { transform: rotate(3deg); } }
@media (max-width: 1100px) {
  .welcome { padding-top: 45px; grid-template-columns: 1.1fr .9fr; }
  .welcome h1 { font-size: 48px; }
  .masthead-note { display: none; }
  .welcome-art .welcome-sphere { min-height: 0; }
}
@media (max-width: 700px) {
  body { background-attachment: scroll; }
  .masthead { gap: 12px; padding: 16px 0; }
  .brand { gap: 9px; }
  .brand-glyph { width: 42px; height: 42px; }
  .brand-name { font-size: 21px; }
  .brand-note { font-size: 7px; letter-spacing: .3em; }
  .brand-words { gap: 6px; }
  .header-actions { gap: 6px; max-width: 100%; }
  .welcome { display: block; padding-top: 38px; }
  .welcome h1 { font-size: 43px; }
  .welcome .lede { font-size: 17px; padding-top: 18px; margin-top: 24px; }
  .welcome-art { max-width: 390px; margin: 8px auto 0; }
  .welcome-art .welcome-sphere { height: auto; max-height: 305px; }
  .welcome-art p { font-size: 10px; margin-top: -10px; }
  .form-page .form-grid, .controls-form { padding-top: 18px; }
  .drawer { background: #101126fa; }
}
@media (prefers-reduced-motion: reduce) {.exhibition:not([data-motion=full]) .sphere-orbits,.exhibition:not([data-motion=full]) .sphere-card{ animation: none; }
}