body{margin:0;background:#F3F4F1;color:#1B211E;font-family:'IBM Plex Sans',system-ui,sans-serif}
*{box-sizing:border-box}
a{color:#2E6A4D}a:hover{color:#1F4A35}
.num{font-variant-numeric:tabular-nums}
.muted{color:#5B635E}
.card{background:#fff;border:1px solid #E2E5E0;border-radius:14px}
.chip{display:inline-block;font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px;white-space:nowrap}
.c-ok{background:#E3EEE7;color:#1F5A3E}
.c-warn{background:#FBF1DC;color:#7A4E07}
.c-info{background:#E2ECF6;color:#24527F}
.c-bad{background:#F8E4E1;color:#93302A}
.c-chipoff{background:#EEF0EC;color:#3E4641}
.tb{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font:inherit;font-size:11px;font-weight:600;border:0;background:transparent;color:#5B635E;min-height:56px;cursor:pointer;padding:0}
.tb.on{color:#2E6A4D}
.htab{flex:1;border:0;border-radius:9px;background:transparent;font:inherit;font-size:17px;font-weight:700;color:#3E4641;padding:0;cursor:pointer;text-align:center}
.htab.on{background:#2E6A4D;color:#fff}
.li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;width:100%;background:transparent;border:0;border-bottom:1px solid #EEF0EC;font:inherit;text-align:left;color:#1B211E;min-height:56px;cursor:pointer}
.li:hover{background:#F6F7F4}
.seg{flex:1;font:inherit;font-size:13px;font-weight:600;min-height:40px;border:0;border-radius:8px;background:transparent;color:#3E4641;cursor:pointer;padding:0 6px;white-space:nowrap}
.seg.on{background:#fff;color:#1B211E;box-shadow:0 1px 2px rgba(0,0,0,.12)}
.btn{font:inherit;font-size:15px;font-weight:600;min-height:48px;padding:0 16px;border-radius:10px;border:1px solid #CBD1CC;background:#fff;color:#1B211E;cursor:pointer}
.btn-p{background:#2E6A4D;border-color:#2E6A4D;color:#fff}
.lbl{font-size:13px;font-weight:600;color:#3E4641;display:block;margin-bottom:6px}
.inp{font:inherit;font-size:16px;width:100%;min-height:48px;padding:0 12px;border:1px solid #CBD1CC;border-radius:10px;background:#fff;color:#1B211E}
.qa{display:flex;flex-direction:column;align-items:center;gap:6px;font:inherit;font-size:12px;font-weight:600;color:#1B211E;background:#fff;border:1px solid #E2E5E0;border-radius:14px;padding:12px 4px;cursor:pointer;min-height:76px}
.qi{width:36px;height:36px;border-radius:10px;background:#E3EEE7;color:#2E6A4D;display:flex;align-items:center;justify-content:center}
.sec{margin:20px 0 8px;font-size:13px;font-weight:700;color:#5B635E;text-transform:uppercase;letter-spacing:.05em}
.back{width:44px;height:44px;border-radius:10px;border:0;background:transparent;color:#1B211E;display:flex;align-items:center;justify-content:center;cursor:pointer;margin-left:-10px}
.step{width:56px;min-height:64px;border-radius:12px;border:1px solid #CBD1CC;background:#fff;font:inherit;font-size:28px;font-weight:600;color:#1B211E;cursor:pointer}
.swipe{display:flex;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.swipe::-webkit-scrollbar{display:none}
.swipe>*{flex:0 0 100%;min-width:100%;scroll-snap-align:start;scroll-snap-stop:always}
.dot{width:6px;height:6px;border-radius:3px;background:#CBD1CC;transition:width .15s}
.dot.on{width:14px;background:#2E6A4D}
.quick{flex:1;min-height:40px;border-radius:999px;border:0;background:#EEF0EC;font:inherit;font-size:14px;font-weight:600;color:#3E4641;cursor:pointer}
:root{--st:env(safe-area-inset-top,0px);--sb:env(safe-area-inset-bottom,0px);--sl:env(safe-area-inset-left,0px);--sr:env(safe-area-inset-right,0px);--hh:64px;--nh:72px;--np:12px}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
/* Sayfanın kendisi hiç kaymaz; yalnız <main> kayar. Tarayıcı çubuğu değişince alt menü ekranda kalır. */
html,body{height:100%;overflow:hidden;overscroll-behavior:none}
#root{position:fixed;top:0;left:0;right:0;bottom:0;padding-left:var(--sl);padding-right:var(--sr)}
main{overscroll-behavior-y:contain}
#app{overflow:clip!important}
body{-webkit-tap-highlight-color:transparent}
@media (min-width:520px){body{background:#E6E9E5}#app{box-shadow:0 0 0 1px #E2E5E0}}
/* Tablet ve bilgisayar: daha geniş sütun. Yatay telefon: ince üst/alt çubuk, tam genişlik. */
@media (min-width:700px) and (min-height:481px){#app{max-width:720px!important}}
@media (max-height:480px){:root{--hh:52px;--nh:54px;--np:2px}.tb{min-height:44px}#app{max-width:none!important}}