/* ---------- avatar ---------- */
.uav{flex:none;display:inline-grid;place-items:center;width:var(--s,32px);height:var(--s,32px);border-radius:50%;overflow:hidden;font-family:var(--display);font-weight:800;font-size:calc(var(--s,32px) * .38);color:#fff;background:hsl(var(--h,220) 55% 45%)}
.uav img{width:100%;height:100%;object-fit:cover;display:block}
.uav.sm{--s:30px}
.uav.xl{--s:92px}
.acc-btn .uav{box-shadow:0 0 0 2px rgba(255,255,255,.55)}
.c-ava.pic{padding:0;overflow:hidden;background:none}
.c-ava.pic img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}

/* ---------- brand ---------- */
.brand-mini{display:inline-flex!important;align-items:center;gap:8px;padding:6px 12px 6px 10px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(163,216,244,.25);color:#fff!important;font-family:var(--display);font-weight:800!important;font-size:.95rem!important;letter-spacing:.01em}
.brand-mini svg{flex:none}
.hero h1.brand-h1{display:flex;align-items:center;gap:.32em;margin:18px 0 12px;font-size:clamp(2.5rem,6vw,4.6rem);line-height:1;letter-spacing:-.035em;white-space:nowrap}
.hero h1.brand-h1 .bh-mark{flex:none;display:block;width:.86em;height:.97em;filter:drop-shadow(0 .12em .25em rgba(0,0,0,.35));animation:up .9s var(--ease) .3s both}
.hero h1.brand-h1 .bh-mark svg{display:block;width:100%;height:100%}
.hero h1.brand-h1 .bh-word{color:#fff;animation:up .9s var(--ease) .4s both}
.hero h1.brand-h1 .bh-word em{font-style:normal;color:var(--sky)}
.bh-tag{margin:0 0 20px;color:rgba(255,255,255,.72);font-size:clamp(1rem,1.6vw,1.15rem);font-weight:500;animation:up .9s var(--ease) .5s both}
@media (max-width:640px){.hero h1.brand-h1{font-size:clamp(2.1rem,10vw,2.8rem);gap:.28em}.bh-tag{margin-bottom:16px}}
.g1-brand b em{font-style:normal;color:#A3D8F4}
.g1-set{width:40px;height:40px;border:0;border-radius:10px;background:rgba(255,255,255,.12);color:#fff;display:grid;place-items:center;cursor:pointer}
.g1-set:hover{background:rgba(255,255,255,.22)}
.g1-shared{display:grid;gap:8px;margin-top:34px}
.g1-shared .sec-head{margin-top:26px}
.g1-two .menutoday{margin-top:18px}

/* ---------- shared sheet ---------- */
.sheet{position:fixed;inset:0;z-index:110;background:rgba(6,12,30,.55);backdrop-filter:blur(8px) saturate(1.2);-webkit-backdrop-filter:blur(8px) saturate(1.2);animation:shFade .25s ease}
.sheet.out{animation:shFadeOut .22s ease forwards}
@keyframes shFade{from{opacity:0}}
@keyframes shFadeOut{to{opacity:0}}

/* ---------- user drawer ---------- */
.umenu{display:flex;justify-content:flex-end}
.um-panel{position:relative;width:min(370px,90vw);height:100%;display:flex;flex-direction:column;background:var(--surface);box-shadow:-30px 0 60px -30px rgba(0,0,0,.6);animation:umIn .38s cubic-bezier(.2,.9,.2,1);overflow:hidden}
.umenu.out .um-panel{animation:umOut .22s ease forwards}
@keyframes umIn{from{transform:translateX(100%)}}
@keyframes umOut{to{transform:translateX(100%)}}
.um-top{position:relative;overflow:hidden;padding:46px 24px 26px;text-align:center;color:#fff;background:linear-gradient(160deg,#173d82,#0B2150 70%);isolation:isolate}
.um-top::before,.um-top::after{content:"";position:absolute;z-index:-1;border-radius:50%;filter:blur(30px);opacity:.55;animation:blob 9s ease-in-out infinite alternate}
.um-top::before{width:220px;height:220px;left:-60px;top:-80px;background:#2F55D4}
.um-top::after{width:200px;height:200px;right:-70px;bottom:-90px;background:#2F8F9D;animation-delay:-4s}
@keyframes blob{to{transform:translate(30px,20px) scale(1.15)}}
.um-x{position:absolute;top:12px;right:12px;width:38px;height:38px;border:0;border-radius:12px;background:rgba(255,255,255,.12);color:#fff;font-size:1.4rem;cursor:pointer;transition:background .2s,transform .2s}
.um-x:hover{background:rgba(255,255,255,.24);transform:rotate(90deg)}
.um-ava-ring{position:relative;display:inline-grid;place-items:center;padding:5px;border-radius:50%;margin-bottom:12px}
.um-ava-ring::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,#A3D8F4,#2F55D4,#FFC53D,#2F8F9D,#A3D8F4);animation:spin 6s linear infinite}
.um-ava-ring .uav{position:relative;box-shadow:0 0 0 4px #0F2C66}
@keyframes spin{to{transform:rotate(360deg)}}
.um-top h2{margin:0;font-family:var(--display);font-size:1.35rem}
.um-top p{margin:2px 0 0;color:#C9D6F2;font-size:.88rem}
.um-badge{display:inline-block;margin-top:12px;padding:4px 12px;border-radius:999px;background:rgba(255,255,255,.14);font-size:.76rem;font-weight:700}
.um-list{flex:1;display:flex;flex-direction:column;gap:6px;padding:18px 14px}
.um-foot{padding:14px;border-top:1px solid var(--line)}
.um-item{display:flex;align-items:center;gap:14px;width:100%;padding:14px;border:0;border-radius:16px;background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:background .2s,transform .2s var(--ease);animation:umItem .45s cubic-bezier(.2,.9,.2,1) both;animation-delay:calc(var(--i) * 70ms + 150ms)}
@keyframes umItem{from{opacity:0;transform:translateX(24px)}}
.um-item:hover,.um-item:focus-visible{background:var(--bg);transform:translateX(-3px)}
.um-item>svg:last-child{margin-left:auto;color:var(--muted);transition:transform .2s}
.um-item:hover>svg:last-child{transform:translateX(4px);color:var(--ink)}
.um-ic{flex:none;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:color-mix(in srgb,var(--navy) 10%,var(--surface));color:var(--accent)}
.um-t{display:flex;flex-direction:column;min-width:0}
.um-t b{font-family:var(--display);font-size:1.02rem}
.um-t small{color:var(--muted);font-size:.8rem}
.um-item.danger .um-ic{background:color-mix(in srgb,#C22E48 12%,var(--surface));color:#C22E48}
.um-item.danger b{color:#C22E48}
:root[data-theme="dark"] .um-item.danger .um-ic,:root[data-theme="dark"] .um-item.danger b{color:#FF7A8F}

/* ---------- account & settings cards ---------- */
.accm,.setm{display:grid;place-items:center;padding:20px;overflow:auto}
.sm-card{position:relative;width:min(580px,100%);max-height:calc(100vh - 40px);display:flex;flex-direction:column;border-radius:28px;background:var(--surface);color:var(--ink);overflow:hidden;box-shadow:0 50px 100px -40px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.06);animation:smIn .45s cubic-bezier(.2,.9,.2,1)}
.sheet.out .sm-card{animation:smOut .22s ease forwards}
@keyframes smIn{from{opacity:0;transform:translateY(26px) scale(.96)}}
@keyframes smOut{to{opacity:0;transform:translateY(14px) scale(.98)}}
.sm-hero{position:relative;display:flex;align-items:center;gap:20px;padding:30px 28px 26px;color:#fff;isolation:isolate;overflow:hidden;background:radial-gradient(120% 140% at 0% 0%,hsl(var(--h,220) 70% 45%) 0%,transparent 55%),radial-gradient(120% 140% at 100% 100%,hsl(calc(var(--h,220) + 25) 65% 38%) 0%,transparent 55%),linear-gradient(135deg,#132f6b,#0B2150)}
.sm-hero::after{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(rgba(255,255,255,.14) 1px,transparent 1px);background-size:16px 16px;mask-image:linear-gradient(90deg,transparent,#000 60%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 60%)}
.sm-x{position:absolute;top:14px;right:14px;z-index:2;width:38px;height:38px;border:0;border-radius:12px;background:rgba(255,255,255,.14);color:#fff;font-size:1.4rem;cursor:pointer;transition:background .2s,transform .25s}
.sm-x:hover{background:rgba(255,255,255,.26);transform:rotate(90deg)}
.sm-ava{position:relative;flex:none;animation:avPop .6s cubic-bezier(.3,1.5,.5,1) .1s both}
@keyframes avPop{from{transform:scale(.6);opacity:0}}
.sm-ava .uav{box-shadow:0 0 0 4px rgba(255,255,255,.22),0 16px 30px -12px rgba(0,0,0,.6)}
.sm-ava.busy .uav{opacity:.5}
.sm-ava.busy::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:3px solid rgba(255,255,255,.25);border-top-color:#fff;animation:spin .8s linear infinite}
.sm-cam{position:absolute;right:-2px;bottom:-2px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--navy);cursor:pointer;box-shadow:0 8px 18px -6px rgba(0,0,0,.6);transition:transform .2s}
.sm-cam:hover{transform:scale(1.1) rotate(-8deg)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.sm-id{min-width:0;display:flex;flex-direction:column;gap:2px}
.sm-id small{font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#A3D8F4}
.sm-id h2{margin:0;font-family:var(--display);font-size:1.6rem;line-height:1.1;overflow-wrap:anywhere}
.sm-id p{margin:0;color:#D6E2F7;font-size:.9rem}
.sm-id>span{font-size:.78rem;color:#B9C8E6}
.sm-link{align-self:flex-start;margin-top:6px;padding:0;border:0;background:none;color:#FFC9D1;font:inherit;font-size:.8rem;font-weight:700;text-decoration:underline;cursor:pointer}
.sm-hint{margin-top:6px;font-size:.78rem;color:#A3D8F4!important}
.sm-body{padding:22px 26px 26px;overflow:auto;display:grid;gap:18px}
.sm-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sm-stat{padding:14px 16px;border-radius:18px;background:var(--bg);border:1px solid var(--line);display:flex;flex-direction:column;gap:2px;animation:umItem .5s cubic-bezier(.2,.9,.2,1) both;animation-name:statUp;animation-delay:calc(var(--i) * 80ms + 120ms);transition:transform .25s var(--ease),box-shadow .25s}
@keyframes statUp{from{opacity:0;transform:translateY(12px)}}
.sm-stat:hover{transform:translateY(-3px);box-shadow:0 14px 26px -18px rgba(11,33,80,.6)}
.sm-stat b{font-family:var(--display);font-size:1.5rem}
.sm-stat>span{font-size:.8rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sm-stat.warn{background:color-mix(in srgb,#C22E48 9%,var(--surface));border-color:color-mix(in srgb,#C22E48 35%,var(--line))}
.sm-stat.warn b{color:#C22E48}
.sm-stat.wide{grid-column:1 / -1}
.sm-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.sm-lbl{font-weight:800;font-size:.86rem}
.sm-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.sm-chip{padding:5px 12px;border-radius:999px;background:var(--c);color:#fff;font-weight:700;font-size:.8rem;box-shadow:0 6px 14px -8px var(--c)}

/* segmented with sliding pill */
.seg{position:relative;display:grid;grid-template-columns:repeat(2,1fr);padding:5px;border-radius:16px;background:var(--bg);border:1px solid var(--line)}
.seg.seg3{grid-template-columns:repeat(3,1fr)}
.seg.seg2{grid-template-columns:repeat(2,1fr)}
.seg button{position:relative;z-index:1;height:42px;border:0;background:none;color:var(--muted);font:inherit;font-weight:800;font-size:.92rem;cursor:pointer;transition:color .25s}
.seg button.on{color:#fff}
.seg-pill{position:absolute;z-index:0;top:5px;bottom:5px;left:5px;width:calc((100% - 10px) / 2);border-radius:12px;background:linear-gradient(135deg,#2F55D4,#122E63);box-shadow:0 10px 20px -10px rgba(18,46,99,.9);transform:translateX(calc(var(--x) * 100%));transition:transform .35s cubic-bezier(.3,1.3,.5,1)}
.seg.seg3 .seg-pill{width:calc((100% - 10px) / 3)}
:root[data-theme="dark"] .seg-pill{background:linear-gradient(135deg,#7FC4EC,#2F55D4)}

/* floating labels */
.sm-form{display:grid;gap:12px;animation:statUp .35s ease both}
.fl{position:relative;display:block}
.fl input{width:100%;height:56px;padding:20px 14px 6px;border-radius:14px;border:1.5px solid var(--line);background:var(--bg);color:var(--ink);font:inherit;outline:none;transition:border-color .2s,box-shadow .2s}
.fl span{position:absolute;left:15px;top:18px;color:var(--muted);font-size:.95rem;pointer-events:none;transition:all .2s ease}
.fl input:focus{border-color:#2F55D4;box-shadow:0 0 0 4px rgba(47,85,212,.15)}
.fl input:focus+span,.fl input:not(:placeholder-shown)+span{top:8px;font-size:.72rem;font-weight:800;letter-spacing:.04em;color:#2F55D4}
.fl input:disabled{opacity:.7}
:root[data-theme="dark"] .fl input:focus+span,:root[data-theme="dark"] .fl input:not(:placeholder-shown)+span{color:#7FC4EC}
.sm-form .err{margin:0;color:var(--danger);font-weight:600;font-size:.86rem}
.sm-form .err:empty{display:none}
.sm-go{height:50px;border-radius:14px;font-weight:800;background:linear-gradient(135deg,#2F55D4,#122E63);border:0;box-shadow:0 14px 26px -14px rgba(18,46,99,.9);transition:transform .2s,box-shadow .2s,opacity .2s}
.sm-go:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 20px 30px -14px rgba(18,46,99,.9)}
.sm-go:disabled{opacity:.45}
.sm-form label:not(.fl){display:flex;flex-direction:column;gap:6px;font-weight:700;font-size:.86rem}
.sm-form label:not(.fl) input{height:48px;border-radius:12px;border:1.5px solid var(--line);background:var(--bg);color:var(--ink);padding:0 14px;font:inherit;letter-spacing:.3em}

/* settings */
.set-hero{--h:200}
.set-gear{flex:none;width:72px;height:72px;border-radius:22px;display:grid;place-items:center;background:rgba(255,255,255,.14);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}
.set-gear svg{animation:spin 12s linear infinite}
.set-pane{animation:statUp .35s ease both}
.set-lead{margin:0 0 10px;color:var(--muted);font-size:.9rem}
.theme-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.tc,.gc{position:relative;display:flex;flex-direction:column;gap:3px;padding:12px;border-radius:18px;border:2px solid var(--line);background:var(--bg);color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:border-color .2s,transform .2s var(--ease),box-shadow .2s}
.tc:hover,.gc:hover{transform:translateY(-3px);box-shadow:0 16px 26px -18px rgba(11,33,80,.7)}
.tc.on,.gc.on{border-color:#2F55D4;box-shadow:0 0 0 4px rgba(47,85,212,.14)}
.tc b,.gc b{font-family:var(--display);font-size:.98rem}
.tc small,.gc small{color:var(--muted);font-size:.76rem;line-height:1.35}
.tc.mini{align-items:center;padding:12px 8px}
.tc-prev{display:grid;grid-template-columns:1fr 2fr;grid-template-rows:12px 1fr;gap:4px;height:68px;padding:6px;border-radius:12px;margin-bottom:8px}
.tc-prev i{border-radius:4px}
.tc-prev i:first-child{grid-column:1 / -1}
.tc-light{background:#EDF0F6}.tc-light i{background:#fff}.tc-light i:first-child{background:#122E63}
.tc-dark{background:#0E1428}.tc-dark i{background:#1B2340}.tc-dark i:first-child{background:#2F55D4}
.tc-system{background:linear-gradient(135deg,#EDF0F6 50%,#0E1428 50%)}.tc-system i{background:rgba(127,140,180,.45)}.tc-system i:first-child{background:#2F55D4}
.grade-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.gc{padding:16px}
.gc b{font-size:1.2rem}
.gc-ok{position:absolute;top:12px;right:12px;font-size:.66rem;font-weight:800;text-transform:uppercase;padding:2px 8px;border-radius:999px;background:#1E8A4C;color:#fff}
.set-pane .pn-tab{display:grid;gap:14px}

@media (max-width:640px){
  .accm,.setm{padding:0;place-items:end stretch}
  .sm-card{width:100%;max-height:94vh;border-radius:26px 26px 0 0;animation-name:smSheet}
  @keyframes smSheet{from{transform:translateY(60px);opacity:0}}
  .sm-hero{padding:24px 18px 20px;gap:14px}
  .uav.xl{--s:74px}
  .sm-id h2{font-size:1.3rem}
  .sm-body{padding:18px 16px calc(20px + env(safe-area-inset-bottom,0px))}
  .theme-cards{grid-template-columns:repeat(3,1fr);gap:6px}
  .tc{padding:8px}
  .tc small{display:none}
  .grade-cards{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .um-ava-ring::before,.um-top::before,.um-top::after,.set-gear svg,.hero h1.brand-h1 span:last-child{animation:none!important}
}
.brand-mini{white-space:nowrap}
@media (max-width:640px){.hero-top .brand-mini{display:none!important}}
@media (max-width:640px){.hero-top{justify-content:flex-end}}

.fr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:16px 10px;margin-top:6px}
.fr-it{display:grid;justify-items:center;gap:8px;padding:12px 6px 10px;border-radius:14px;border:2px solid var(--line);background:var(--bg);font:inherit;color:var(--ink);cursor:pointer;text-align:center}
.fr-it small{font-size:.7rem;line-height:1.2;color:var(--muted);font-weight:600}
.fr-it b{font-size:.78rem;line-height:1.15}
.fr-it.on{border-color:#2F55D4;box-shadow:0 0 0 3px rgba(47,85,212,.25)}
.fr-it.lock{opacity:.5;cursor:default;filter:grayscale(.85)}
.fr-it .uav{width:46px;height:46px}
.fr-note{margin:0 0 4px;font-size:.84rem;color:var(--muted)}

/* yan menü: ekran kısaysa üst alan sıkışmasın, panel kaydırılsın */
.um-panel{overflow-y:auto;overflow-x:hidden}
.um-panel>*{flex-shrink:0}
.um-list{flex:1 0 auto}
.sm-pid{margin:2px 0 0;font-size:.82rem;opacity:.85;font-variant-numeric:tabular-nums;word-break:break-all}
