/* ETAP_CSP_PHASE5_v1 — auto-extracted from order_new.html on 20260513_085657
   Original 1 <style> block(s) consolidated here.
   DO NOT edit by hand — re-run extract_inline_style.py to regenerate. */

/* === extracted block 1 from order_new.html === */
:root {
            --ink: #0a0a0f;
            --cream: #faf7f0;
            --amber: #FBBF24;
            --amber-2: #FB923C;
        }
        * { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
        html, body { background: #07070b; color: var(--ink); }
        body { font-family: 'Manrope', system-ui, -apple-system, sans-serif; font-feature-settings: "ss01", "cv11"; }
        body.body-dark { background: #07070b; min-height: 100dvh; }
        .font-display { font-family: 'Bricolage Grotesque', 'Manrope', system-ui, sans-serif; letter-spacing: -0.035em; line-height: 0.95; font-weight: 800; }
        .hero-mesh {
            background:
                radial-gradient(ellipse 80% 60% at 18% 18%, rgba(251,191,36,.22) 0%, transparent 55%),
                radial-gradient(ellipse 70% 55% at 88% 12%, rgba(251,146,60,.20) 0%, transparent 60%),
                radial-gradient(ellipse 90% 60% at 60% 95%, rgba(99,102,241,.14) 0%, transparent 65%),
                radial-gradient(ellipse 60% 50% at 0% 80%, rgba(244,63,94,.10) 0%, transparent 60%),
                #07070b;
        }
        .dot-grid {
            background-image: radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px);
            background-size: 28px 28px;
        }
        .glass-dark { background: rgba(10,10,15,.55); backdrop-filter: blur(14px) saturate(140%); -webkit-backdrop-filter: blur(14px) saturate(140%); }
        .header-on-dark { background: rgba(7,7,11,.55); backdrop-filter: blur(14px) saturate(140%); -webkit-backdrop-filter: blur(14px) saturate(140%); border-bottom: 1px solid rgba(255,255,255,.06); }
        .nav-link { font-size: 13px; font-weight: 600; color: rgba(250,247,240,.7); transition: color .2s; }
        .nav-link:hover { color: #fafafa; }
        .btn-primary { background: linear-gradient(135deg, #FBBF24 0%, #FB923C 100%); color: #09090B; }
        .btn-primary:hover { background: linear-gradient(135deg, #F59E0B 0%, #EA580C 100%); transform: translateY(-1px); box-shadow: 0 12px 28px -8px rgba(251,146,60,.5); }
        .btn-ghost-light { color: #fafafa; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.04); }
        .btn-ghost-light:hover { background: rgba(255,255,255,.10); border-color: rgba(255,255,255,.4); }
        .pill { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: 0.02em; }
        .pill-dark { background: rgba(255,255,255,.06); color: #fafafa; border: 1px solid rgba(255,255,255,.10); }
        .pill-amber { background: rgba(251,191,36,.12); color: #B45309; border: 1px solid rgba(251,191,36,.25); }
        .surface { background: #fff; border: 1px solid rgba(10,10,15,.06); box-shadow: 0 1px 0 rgba(10,10,15,.02); }
        .fade-in { animation: fadeIn 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
        @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
        .fade-up { animation: fadeUp .9s cubic-bezier(.16,1,.3,1) both; }
        @keyframes fadeUp { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: translateY(0); } }
        .d1 { animation-delay: .08s } .d2 { animation-delay: .18s }
        .hide-scroll::-webkit-scrollbar { display: none; }

        /* ETAP_H1_BOTTOMNAV_v1 css — Glass Pill+FAB (mobile) */
        .nav-pill-glass{
          --nav-bg: rgba(10,10,15,.72);
          --nav-border: rgba(251,191,36,.20);
          --nav-idle: rgba(250,247,240,.68);
          --nav-active: var(--amber);
          --nav-fab-shadow: 0 8px 24px rgba(251,191,36,.45), 0 2px 6px rgba(244,63,94,.25);
          position:fixed; left:12px; right:12px;
          bottom:max(12px, env(safe-area-inset-bottom));
          z-index:50;
          display:flex; align-items:center; justify-content:space-between;
          height:64px; padding:0 6px;
          background:var(--nav-bg);
          -webkit-backdrop-filter:blur(20px) saturate(180%);
          backdrop-filter:blur(20px) saturate(180%);
          border-radius:28px;
          border:1px solid var(--nav-border);
          box-shadow:0 12px 40px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06);
          font-family:'Manrope',system-ui,-apple-system,sans-serif;
          -webkit-tap-highlight-color:transparent;
        }
        .nav-pill-glass .nav-item{
          flex:1 1 0; min-width:48px; min-height:48px;
          display:flex; flex-direction:column; align-items:center; justify-content:center;
          gap:2px; padding:6px 4px;
          color:var(--nav-idle); text-decoration:none; position:relative;
          transition:color 200ms cubic-bezier(.16,1,.3,1), transform 120ms ease-out;
        }
        .nav-pill-glass .nav-item svg{ width:22px; height:22px; stroke:currentColor; stroke-width:2; fill:none; stroke-linecap:round; stroke-linejoin:round; transition:transform 200ms cubic-bezier(.16,1,.3,1); }
        .nav-pill-glass .nav-item span{ font-size:10px; font-weight:600; letter-spacing:.01em; line-height:1; opacity:.9; }
        .nav-pill-glass .nav-item:active{transform:scale(.94)}
        .nav-pill-glass .nav-item.is-active{color:var(--nav-active)}
        .nav-pill-glass .nav-item.is-active svg{transform:translateY(-1px)}
        .nav-pill-glass .nav-item.is-active::after{
          content:''; position:absolute; bottom:4px; width:4px; height:4px; border-radius:50%;
          background:var(--nav-active);
          box-shadow:0 0 8px rgba(251,191,36,.7);
          animation:navDotIn 200ms cubic-bezier(.16,1,.3,1);
        }
        @keyframes navDotIn{from{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}
        .nav-pill-glass .fab-wrap{ flex:0 0 auto; width:78px; display:flex; align-items:center; justify-content:center; position:relative; }
        .nav-pill-glass .fab-amber{
          width:60px; height:60px; border-radius:50%;
          background:linear-gradient(135deg,#FBBF24 0%,#FB923C 50%,#F43F5E 100%);
          box-shadow:var(--nav-fab-shadow), inset 0 1px 0 rgba(255,255,255,.35);
          display:flex; align-items:center; justify-content:center; text-decoration:none;
          transform:translateY(-14px);
          transition:transform 220ms cubic-bezier(.16,1,.3,1), box-shadow 220ms;
          -webkit-tap-highlight-color:transparent;
        }
        .nav-pill-glass .fab-amber::before{
          content:''; position:absolute; inset:-6px; border-radius:50%;
          background:radial-gradient(closest-side, rgba(251,191,36,.35), transparent 70%);
          z-index:-1; opacity:.8; pointer-events:none;
        }
        .nav-pill-glass .fab-amber:hover{ transform:translateY(-16px) scale(1.04); }
        .nav-pill-glass .fab-amber:active{transform:translateY(-14px) scale(.95)}
        .nav-pill-glass .fab-amber svg{ width:26px; height:26px; stroke:#0a0a0f; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; fill:#0a0a0f; }
        @media (min-width: 768px){ .nav-pill-glass{display:none} }
        @media (prefers-reduced-motion: reduce){ .nav-pill-glass *, .nav-pill-glass *::after{ transition:none !important; animation:none !important } }

        /* PB24 — пространство под Glass Pill (mobile only). */
        body.order-new-v2{ padding-bottom:96px; }
        @media (min-width:768px){ body.order-new-v2{ padding-bottom:0; } }