/* Odeo Agency — 3D sürmə rejimi */
@font-face{font-family:"O3 Manrope";font-weight:600;font-display:swap;src:url(fonts/onest-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2190-2199,U+2212,U+23CE}
@font-face{font-family:"O3 Manrope";font-weight:600;font-display:swap;src:url(fonts/onest-latin-ext-600-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+20A0-20C0}
@font-face{font-family:"O3 Manrope";font-weight:800;font-display:swap;src:url(fonts/onest-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2190-2199,U+2212,U+23CE}
@font-face{font-family:"O3 Manrope";font-weight:800;font-display:swap;src:url(fonts/onest-latin-ext-700-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+20A0-20C0}
@font-face{font-family:"O3 Mono";font-weight:700;font-display:swap;src:url(fonts/jetbrains-mono-latin-700-normal.woff2) format("woff2")}

.odeo-3d{
  --g950:#101a16;--g900:#14211C;--g800:#1E3029;--g700:#2E4A41;--g600:#3E5F54;
  --cream:#EBD9B9;--cream2:#F6EFE3;--white:#FBF8F2;--sage:#BFCAB9;--saffron:#E3A857;
  --glass:rgba(20,33,28,.78);--line:rgba(235,217,185,.18);
  --f:"Odeo Display","O3 Manrope",Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;
  --ft:"O3 Manrope",Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;
  --fm:"O3 Mono","JetBrains Mono",ui-monospace,monospace;
  position:fixed;inset:0;overflow:hidden;background:var(--g900);color:var(--cream2);
  font-family:var(--ft);font-size:16px;line-height:1.45;-webkit-font-smoothing:antialiased;
  touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;
}
.odeo-3d *,.odeo-3d *::before,.odeo-3d *::after{box-sizing:border-box}
.odeo-3d [hidden]{display:none!important}
.o3-canvas{position:absolute;inset:0;width:100%!important;height:100%!important;display:block;outline:none}
.odeo-3d :focus-visible{outline:2px solid var(--saffron);outline-offset:3px}
.odeo-3d kbd{font-family:var(--fm);font-size:.78em;font-weight:700;display:inline-grid;place-items:center;min-width:1.9em;height:1.9em;padding:0 .45em;border-radius:7px;background:rgba(235,217,185,.1);border:1px solid rgba(235,217,185,.28);border-bottom-width:3px;color:var(--cream2)}

/* düymələr */
.o3-btn{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:.55em;min-height:48px;padding:0 1.35em;border-radius:999px;border:1px solid transparent;font:800 1rem/1 var(--ft);letter-spacing:.005em;text-decoration:none;cursor:pointer;transition:transform .18s ease,background-color .18s ease,border-color .18s ease,color .18s ease;white-space:nowrap}
.o3-btn:active{transform:translateY(1px) scale(.98)}
.o3-btn--pri{background:var(--cream);color:var(--g900)}
.o3-btn--pri:hover{background:var(--white)}
.o3-btn--pri span{font-family:var(--fm);font-weight:700;opacity:.6}
.o3-btn--ghost{background:transparent;color:var(--cream);border-color:rgba(235,217,185,.38)}
.o3-btn--ghost:hover{border-color:var(--cream);background:rgba(235,217,185,.08)}
.o3-btn--sm{min-height:40px;padding:0 1.05em;font-size:.88rem}

/* yükləmə */
.o3-loader{position:absolute;inset:0;z-index:30;display:grid;place-items:center;background:radial-gradient(120% 90% at 50% 110%,#3E5F54 0%,#1E3029 45%,#14211C 100%);transition:opacity .6s ease}
.o3-loader.is-out{opacity:0;pointer-events:none}
.o3-loader-in{width:min(320px,80vw);text-align:center}
.o3-loader-mark{display:flex;justify-content:center;gap:10px;margin-bottom:22px}
.o3-loader-mark span{width:14px;height:34px;border-radius:14px 14px 14px 2px;background:var(--saffron);transform-origin:bottom;animation:o3-flame 1.1s ease-in-out infinite}
.o3-loader-mark span:nth-child(2){height:44px;animation-delay:.15s;background:var(--cream)}
.o3-loader-mark span:nth-child(3){animation-delay:.3s}
@keyframes o3-flame{0%,100%{transform:scaleY(.75) skewX(-6deg)}50%{transform:scaleY(1) skewX(6deg)}}
.o3-loader-t{font:800 1.25rem/1.2 var(--f);margin:0 0 14px;color:var(--cream2)}
.o3-bar{height:4px;border-radius:4px;background:rgba(235,217,185,.15);overflow:hidden}
.o3-bar i{display:block;height:100%;background:var(--saffron);transform:scaleX(0);transform-origin:left;transition:transform .35s ease}
.o3-loader-s{margin:12px 0 0;font:700 .72rem/1 var(--fm);letter-spacing:.08em;text-transform:uppercase;color:var(--sage)}

/* giriş */
.o3-intro{position:absolute;inset:0;z-index:20;display:grid;place-items:center;padding:16px;background:linear-gradient(180deg,rgba(20,33,28,.15),rgba(20,33,28,.55));opacity:0;transition:opacity .4s ease}
.o3-intro.is-in{opacity:1}
.o3-intro-card{position:relative;width:min(520px,100%);padding:34px 34px 30px;border-radius:26px;background:var(--glass);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);border:1px solid var(--line);box-shadow:0 30px 80px -20px rgba(0,0,0,.55)}
.o3-intro-card::before{content:"";position:absolute;left:34px;right:34px;top:0;height:4px;border-radius:0 0 4px 4px;background:repeating-linear-gradient(90deg,var(--saffron) 0 18px,transparent 18px 26px,var(--cream) 26px 44px,transparent 44px 52px)}
.o3-kicker{margin:0 0 10px;font:700 .72rem/1 var(--fm);letter-spacing:.12em;text-transform:uppercase;color:var(--saffron)}
.o3-intro h1{margin:0 0 12px;font:800 clamp(2.3rem,6vw,3.3rem)/1 var(--f);letter-spacing:-.02em;color:var(--cream2)}
.o3-lead{margin:0 0 22px;color:var(--sage);font-size:1.02rem;max-width:40ch}
.o3-keys{list-style:none;margin:0 0 26px;padding:16px 18px;display:grid;gap:10px;border-radius:16px;background:rgba(235,217,185,.06);border:1px solid var(--line);font-size:.92rem;color:var(--cream)}
.o3-keys li{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.o3-kbd-group{display:inline-flex;gap:4px}
.o3-keys--touch{display:none}
@media (pointer:coarse){.o3-keys--desk{display:none}.o3-keys--touch{display:grid}}
.o3-actions{display:flex;gap:10px;flex-wrap:wrap}

/* üst panel */
.o3-top{position:absolute;z-index:10;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;pointer-events:none}
.o3-top>*{pointer-events:auto}
.o3-logo{display:inline-flex;align-items:center;padding:8px 16px;border-radius:999px;background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line)}
.o3-logo img{display:block;height:24px;width:auto;filter:brightness(0) saturate(100%) invert(92%) sepia(12%) saturate(560%) hue-rotate(347deg) brightness(97%)}
.o3-top-r{display:flex;gap:8px}
.o3-top .o3-btn{background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.o3-top .o3-menu-btn{color:var(--cream2);border-color:var(--line)}
.o3-top .o3-menu-btn:hover{border-color:var(--cream)}
.o3-burger{display:inline-grid;gap:4px;width:16px}
.o3-burger i{display:block;height:2px;border-radius:2px;background:currentColor}
.o3-burger i:last-child{width:10px}

/* kompas */
.o3-compass{position:absolute;z-index:9;top:78px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:6px 16px 6px 6px;border-radius:999px;background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line);pointer-events:none}
.o3-compass-dial{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:rgba(235,217,185,.08);border:1px solid var(--line)}
.o3-compass-dial svg{width:24px;height:24px;fill:var(--cream);transition:transform .12s linear}
.o3-compass.is-sel .o3-compass-dial svg{fill:var(--saffron)}
.o3-compass-txt{display:grid;line-height:1.15}
.o3-compass-txt b{font:800 .95rem/1.15 var(--ft);color:var(--cream2)}
.o3-compass-txt span{font:700 .7rem/1.2 var(--fm);color:var(--sage);letter-spacing:.04em}

/* spidometr */
.o3-speed{position:absolute;z-index:9;right:22px;bottom:22px;width:132px;height:92px;display:grid;place-items:end center;padding-bottom:10px;border-radius:20px;background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line);pointer-events:none}
.o3-speed svg{position:absolute;left:6px;top:8px;width:120px;height:70px;fill:none;stroke-width:6;stroke-linecap:round}
.o3-arc-bg{stroke:rgba(235,217,185,.14)}
.o3-arc{stroke:var(--saffron);stroke-dasharray:151;stroke-dashoffset:151;transition:stroke-dashoffset .1s linear}
.o3-speed b{position:relative;font:800 1.8rem/1 var(--fm);color:var(--cream2);font-variant-numeric:tabular-nums}
.o3-speed span{position:relative;font:700 .66rem/1 var(--fm);letter-spacing:.1em;color:var(--sage);margin-top:2px}

/* bildiriş */
.o3-toast{position:absolute;z-index:11;left:50%;top:134px;transform:translate(-50%,-6px);opacity:0;padding:10px 18px;border-radius:999px;background:var(--cream);color:var(--g900);font:800 .9rem/1.2 var(--ft);box-shadow:0 10px 30px -10px rgba(0,0,0,.5);transition:opacity .3s ease,transform .3s ease;max-width:calc(100vw - 32px);text-align:center;pointer-events:none}
.o3-toast.is-in{opacity:1;transform:translate(-50%,0)}

/* məkan kartı */
.o3-card{position:absolute;z-index:12;left:50%;bottom:26px;transform:translate(-50%,20px);opacity:0;display:flex;align-items:center;gap:16px;width:min(560px,calc(100vw - 32px));padding:14px 14px 14px 14px;border-radius:24px;background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(227,168,87,.45);box-shadow:0 24px 60px -20px rgba(0,0,0,.6);transition:opacity .25s ease,transform .25s ease}
.o3-card.is-in{opacity:1;transform:translate(-50%,0)}
.o3-card-ico{flex:none;width:58px;height:58px;border-radius:16px;display:grid;place-items:center;background:var(--saffron);color:var(--g900)}
.o3-card-ico .o3-ico{width:30px;height:30px}
.o3-card-body{flex:1;min-width:0}
.o3-card .o3-kicker{margin:0 0 4px;font-size:.66rem}
.o3-card-t{margin:0;font:800 1.35rem/1.15 var(--f);color:var(--cream2);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.o3-card-s{margin:3px 0 0;color:var(--sage);font-size:.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.o3-card-go{flex:none}

/* menyu */
.o3-menu{position:absolute;inset:0;z-index:25}
.o3-menu-scrim{position:absolute;inset:0;background:rgba(10,18,15,.45);animation:o3-fade .25s ease}
.o3-menu-panel{position:absolute;top:12px;right:12px;bottom:12px;width:min(420px,calc(100vw - 24px));display:flex;flex-direction:column;border-radius:24px;background:rgba(20,33,28,.94);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--line);box-shadow:0 30px 80px -20px rgba(0,0,0,.6);animation:o3-slide .3s cubic-bezier(.2,.8,.2,1);overflow:hidden}
@keyframes o3-fade{from{opacity:0}}
@keyframes o3-slide{from{transform:translateX(30px);opacity:0}}
.o3-menu-head{display:flex;align-items:center;gap:8px;padding:14px 14px 12px 14px;border-bottom:1px solid var(--line)}
.o3-tabs{display:flex;gap:4px;flex:1;padding:4px;border-radius:999px;background:rgba(235,217,185,.07)}
.o3-tab{appearance:none;flex:1;min-height:38px;border:0;border-radius:999px;background:transparent;color:var(--sage);font:800 .84rem/1 var(--ft);cursor:pointer;padding:0 8px}
.o3-tab[aria-selected=true]{background:var(--cream);color:var(--g900)}
.o3-x{appearance:none;flex:none;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--cream);cursor:pointer;display:grid;place-items:center}
.o3-x svg{width:18px;height:18px;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.o3-x:hover{border-color:var(--cream)}
.o3-pane{flex:1;overflow:auto;padding:16px;overscroll-behavior:contain}
.o3-pane-note{margin:0 0 14px;color:var(--sage);font-size:.86rem}
.o3-pane .o3-pane-note:last-child{margin:14px 0 0}
.o3-places{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.o3-places li{display:flex;align-items:stretch;gap:6px}
.o3-place{appearance:none;flex:1;min-width:0;display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:16px;border:1px solid var(--line);background:rgba(235,217,185,.04);color:var(--cream2);text-align:left;cursor:pointer;font:inherit;transition:background-color .15s ease,border-color .15s ease}
.o3-place:hover{background:rgba(235,217,185,.1);border-color:rgba(235,217,185,.4)}
.o3-place-ico{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--g700);color:var(--saffron)}
.o3-place-ico .o3-ico{width:22px;height:22px}
.o3-place-tx{flex:1;min-width:0;display:grid}
.o3-place-tx b{font:800 1rem/1.2 var(--ft)}
.o3-place-tx small{font-size:.8rem;color:var(--sage);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.o3-place-d{flex:none;font:700 .72rem/1 var(--fm);color:var(--sage)}
.o3-place-open{flex:none;display:grid;place-items:center;padding:0 14px;border-radius:16px;border:1px solid var(--line);color:var(--cream);text-decoration:none;font:800 .84rem/1 var(--ft)}
.o3-place-open:hover{border-color:var(--cream);background:rgba(235,217,185,.08)}
.o3-set{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.o3-set>span{font-weight:800}
.o3-seg{display:flex;gap:4px;padding:4px;border-radius:999px;background:rgba(235,217,185,.07)}
.o3-seg button{appearance:none;min-height:36px;min-width:72px;padding:0 12px;border:0;border-radius:999px;background:transparent;color:var(--sage);font:800 .82rem/1 var(--ft);cursor:pointer}
.o3-seg button[aria-pressed=true]{background:var(--saffron);color:var(--g900)}
.o3-help{display:grid;grid-template-columns:auto 1fr;gap:12px 16px;align-items:center;margin:0}
.o3-help dt{display:flex;gap:4px;flex-wrap:wrap}
.o3-help dd{margin:0;color:var(--cream)}

/* toxunma */
.o3-touch{position:absolute;inset:auto 0 0 0;z-index:9;height:0}
.o3-joy{position:absolute;left:22px;bottom:calc(26px + env(safe-area-inset-bottom));width:132px;height:132px;border-radius:50%;background:rgba(20,33,28,.55);border:1.5px solid rgba(235,217,185,.35);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);touch-action:none}
.o3-joy::before{content:"";position:absolute;inset:22px;border-radius:50%;border:1px dashed rgba(235,217,185,.25)}
.o3-joy-knob{position:absolute;left:50%;top:50%;width:58px;height:58px;margin:-29px 0 0 -29px;border-radius:50%;background:var(--cream);box-shadow:0 6px 18px rgba(0,0,0,.4);pointer-events:none}
.o3-brake{position:absolute;right:18px;bottom:calc(104px + env(safe-area-inset-bottom));width:78px;height:78px;border-radius:50%;border:1.5px solid rgba(235,217,185,.4);background:rgba(20,33,28,.6);color:var(--cream2);font:800 .82rem/1 var(--ft);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);touch-action:none}
.o3-brake.is-on{background:var(--saffron);color:var(--g900)}

/* fallback */
.o3-fallback{position:absolute;inset:0;overflow:auto;display:grid;place-items:center;padding:24px 16px;background:radial-gradient(120% 90% at 50% 110%,#3E5F54 0%,#1E3029 45%,#14211C 100%);touch-action:auto;user-select:text}
.o3-fallback h1{margin:16px 0 10px;font:800 1.7rem/1.15 var(--f)}
.o3-fb-logo{height:34px;width:auto;filter:brightness(0) saturate(100%) invert(92%) sepia(12%) saturate(560%) hue-rotate(347deg) brightness(97%)}
.o3-fb-list{list-style:none;margin:0 0 22px;padding:0;display:grid;gap:8px}
.o3-fb-list a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;border:1px solid var(--line);color:var(--cream2);text-decoration:none}
.o3-fb-list a:hover{background:rgba(235,217,185,.08)}
.o3-fb-list .o3-ico{width:24px;height:24px;color:var(--saffron);flex:none}
.o3-fb-list span{display:grid}
.o3-fb-list small{color:var(--sage)}

/* mobil */
@media (max-width:640px){
  .o3-top{padding:12px 12px}
  .o3-logo{padding:7px 12px}
  .o3-logo img{height:20px}
  .o3-classic{display:none}
  .o3-compass{top:66px}
  .o3-toast{top:118px}
  .o3-speed{right:16px;bottom:calc(16px + env(safe-area-inset-bottom));width:100px;height:72px;border-radius:16px;padding-bottom:8px}
  .o3-speed svg{width:88px;height:52px;left:6px;top:6px}
  .o3-speed b{font-size:1.35rem}
  .o3-intro-card{padding:28px 22px 22px}
  .o3-intro-card::before{left:22px;right:22px}
  .o3-actions .o3-btn{flex:1 1 100%}
  .o3-card{bottom:calc(196px + env(safe-area-inset-bottom));flex-wrap:wrap;gap:12px;padding:12px}
  .o3-card-ico{width:46px;height:46px;border-radius:13px}
  .o3-card-t{font-size:1.15rem}
  .o3-card-go{flex:1 1 100%;min-height:46px}
  .o3-menu-panel{top:auto;left:8px;right:8px;bottom:8px;width:auto;max-height:82vh;animation-name:o3-up}
  @keyframes o3-up{from{transform:translateY(30px);opacity:0}}
}
@media (pointer:coarse) and (min-width:641px){ .o3-card{bottom:24px;width:min(520px,calc(100vw - 360px))} }
@media (prefers-reduced-motion:reduce){
  .odeo-3d *{animation-duration:.01ms!important;transition-duration:.01ms!important}
}
@font-face{font-family:"Odeo Display";font-weight:700;font-display:swap;src:url(../assets/fonts/odeo-display-700.woff2) format("woff2")}
