/* ============================================================ LeanTrack — Design System Light + Dark themes via [data-theme] on . ============================================================ */ :root{ --paper:#EEF2F6; --paper-2:#E4EAF1; --card:#FFFFFF; --card-2:#F4F7FA; --surface:#FBFCFE; --ink:#0E1B29; --mut:#54626F; --faint:#8593A2; --navy:#12335A; --navy-2:#1C4A82; --steel:#1F5FA8; --steel-soft:#E7F0FA; --green:#0F8A54; --green-soft:#E4F4EC; --amber:#C97A10; --amber-soft:#FAF0DD; --red:#BE3A2C; --red-soft:#FAE8E5; --purple:#6D3FB0; --purple-soft:#EEE7FA; --line:#DCE3EB; --line-2:#EAEFF4; --track:#E5EBF1; --shadow-sm:0 1px 2px rgba(16,28,40,.05), 0 1px 3px rgba(16,28,40,.06); --shadow-md:0 2px 6px rgba(16,28,40,.06), 0 6px 20px rgba(16,28,40,.07); --shadow-lg:0 12px 34px rgba(16,28,40,.14); --r:16px; --r-sm:11px; --disp:'Barlow Semi Condensed',system-ui,sans-serif; --body:'IBM Plex Sans',system-ui,sans-serif; --appbar-grad:linear-gradient(120deg,#0F2A4C 0%,#164077 100%); } html[data-theme="dark"]{ --paper:#0C1218; --paper-2:#0A0F14; --card:#161F2A; --card-2:#1E2A38; --surface:#131C26; --ink:#E9EEF4; --mut:#A7B4C2; --faint:#69788A; --navy:#1B3E68; --navy-2:#245291; --steel:#4C93E0; --steel-soft:#17293D; --green:#31B074; --green-soft:#15271F; --amber:#E0983A; --amber-soft:#2A2113; --red:#E56A5C; --red-soft:#2C1815; --purple:#A981E6; --purple-soft:#211A33; --line:#26323F; --line-2:#202B37; --track:#232F3D; --shadow-sm:0 1px 2px rgba(0,0,0,.3); --shadow-md:0 2px 8px rgba(0,0,0,.35), 0 8px 24px rgba(0,0,0,.28); --shadow-lg:0 14px 38px rgba(0,0,0,.5); --appbar-grad:linear-gradient(120deg,#0B1B30 0%,#12395F 100%); } *{box-sizing:border-box;margin:0;padding:0} /* dikey kaydırma çubuğunu her zaman rezerve et — sekme değişince içerik/alt bar kaymasın */ html{-webkit-text-size-adjust:100%;overflow-y:scroll;scrollbar-gutter:stable} body{font-family:var(--body);background:var(--paper);color:var(--ink);line-height:1.5; padding:60px 0 92px;font-size:14.5px;-webkit-font-smoothing:antialiased; transition:background .35s ease,color .35s ease} .wrap{max-width:780px;margin:0 auto;padding:0 15px} button{font-family:var(--body)} ::selection{background:color-mix(in srgb,var(--steel) 30%,transparent)} /* ===== ICONS ===== */ .i-ic{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2; stroke-linecap:round;stroke-linejoin:round;flex:none} /* ===== APP BAR ===== */ .appbar{position:fixed;top:0;left:0;right:0;z-index:50;background:var(--appbar-grad);color:#fff;height:58px; display:flex;align-items:center;box-shadow:0 1px 0 rgba(255,255,255,.05) inset,0 4px 18px rgba(11,27,48,.28); backdrop-filter:saturate(1.2)} .appbar .wrap{display:flex;align-items:center;justify-content:space-between;width:100%} .logo{font-family:var(--disp);font-weight:800;font-size:21px;letter-spacing:.4px;display:flex;align-items:center;gap:9px} .logo::before{content:"";width:22px;height:22px;border-radius:7px;flex:none; background:linear-gradient(135deg,#39C07C,#0F8A54);box-shadow:0 2px 8px rgba(15,138,84,.5)} .logo b{color:#5FD497;font-weight:800} .daybadge{font-size:12px;font-weight:600;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.2); padding:6px 13px;border-radius:999px;font-variant-numeric:tabular-nums;backdrop-filter:blur(4px)} /* ===== BOTTOM NAV ===== */ nav{position:fixed;bottom:0;left:0;right:0;z-index:50;background:var(--card); border-top:1px solid var(--line);display:flex;height:74px; padding-bottom:env(safe-area-inset-bottom);box-shadow:0 -6px 24px rgba(16,28,40,.08)} nav button{flex:1;background:none;border:none;cursor:pointer;color:var(--faint);font-size:10.5px;font-weight:600; display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;letter-spacing:.3px; padding-top:10px;position:relative;transition:color .18s} nav button svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;transition:.18s} nav button.on{color:var(--steel)} nav button.on:not(.center) svg{stroke-width:2.4} nav button.on:not(.center)::before{content:"";position:absolute;top:0;width:26px;height:3px;border-radius:0 0 4px 4px;background:var(--steel)} /* elevated center (Koç) */ nav button.center{gap:3px} nav button.center .fab{width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center; margin-top:-32px;margin-bottom:1px;color:#fff; background:linear-gradient(140deg,#2E77C9,#12335A); box-shadow:0 10px 22px rgba(31,95,168,.5),0 0 0 5px var(--card);transition:.2s} nav button.center .fab svg{width:27px;height:27px;stroke:#fff;stroke-width:2} nav button.center.on{color:var(--steel)} nav button.center.on .fab{transform:translateY(-3px) scale(1.04); background:linear-gradient(140deg,#39C07C,#0F8A54); box-shadow:0 14px 26px rgba(15,138,84,.5),0 0 0 5px var(--card)} nav button:active svg{transform:scale(.9)} /* ===== SHARED ===== */ .page{display:none;animation:fade .3s ease}.page.on{display:block} @keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}} h2{font-family:var(--disp);font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:1.1px; color:var(--mut);margin:26px 0 11px;display:flex;align-items:center;gap:11px} h2::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--line),transparent)} .card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:17px;box-shadow:var(--shadow-sm)} .eyebrow{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--faint)} .num{font-family:var(--disp);font-weight:800;font-variant-numeric:tabular-nums} .btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;background:var(--navy);color:#fff;border:none; border-radius:11px;padding:12px 18px;font-weight:600;font-size:13.5px;cursor:pointer;transition:transform .12s,filter .15s,background .2s; box-shadow:var(--shadow-sm)} .btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none} .btn:hover{filter:brightness(1.07)} .btn:active{transform:scale(.97)} .btn:disabled{opacity:.5;cursor:not-allowed;filter:none} .btn.line{background:var(--card);border:1.5px solid var(--line);color:var(--mut);box-shadow:none} .btn.line:hover{border-color:var(--steel);color:var(--steel)} .btn.green{background:linear-gradient(135deg,#17A566,#0F8A54)} .btn.purple{background:linear-gradient(135deg,#7E52C4,#5E33A0)} .btn.full{display:flex;width:100%} .btn.sm{padding:8px 13px;font-size:12.5px;border-radius:9px} .tag{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;padding:4px 11px;border-radius:999px;letter-spacing:.4px;text-transform:uppercase} .tag.antrenman{background:var(--steel-soft);color:var(--steel)} .tag.off{background:var(--amber-soft);color:var(--amber)} .tag.yuzme{background:var(--green-soft);color:var(--green)} .tag.custom{background:var(--purple-soft);color:var(--purple)} .muted{color:var(--mut)} /* ===== KPI GRID ===== */ .kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:11px} @media(min-width:560px){.kpis{grid-template-columns:repeat(4,1fr)}} .kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px 15px;box-shadow:var(--shadow-sm); position:relative;overflow:hidden} .kpi .num{font-size:26px;line-height:1.15;margin-top:4px} .kpi .sub{font-size:11.5px;color:var(--mut);margin-top:3px} .kpi.hero{grid-column:span 2;background:var(--appbar-grad);border-color:transparent;color:#fff;box-shadow:var(--shadow-md)} .kpi.hero::after{content:"";position:absolute;right:-30px;top:-30px;width:120px;height:120px;border-radius:50%; background:radial-gradient(circle,rgba(95,212,151,.28),transparent 70%)} .kpi.hero .eyebrow{color:#A9C4E0}.kpi.hero .sub{color:#A9C4E0} .pill{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;padding:2px 9px;border-radius:999px; font-variant-numeric:tabular-nums;background:var(--card-2);color:var(--mut)} .pill.blue{background:var(--steel-soft);color:var(--steel)} .pill.green{background:var(--green-soft);color:var(--green)} .pill.amber{background:var(--amber-soft);color:var(--amber)} .pill.red{background:var(--red-soft);color:var(--red)} .up{color:var(--red)}.down{color:var(--green)} /* ===== GAUGES ===== */ .gauge{margin-top:13px} .gauge .top{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;color:var(--mut)} .gauge .top b{font-family:var(--disp);font-size:19px;color:var(--ink);font-variant-numeric:tabular-nums} .track{height:11px;border-radius:999px;background:var(--track);overflow:hidden;margin-top:6px;position:relative} .track i{display:block;height:100%;border-radius:999px;width:0;transition:width .5s cubic-bezier(.4,0,.2,1)} .g-kcal i{background:linear-gradient(90deg,#2E77C9,var(--steel))} .g-kcal.over i{background:linear-gradient(90deg,#E0574A,var(--red))} .g-prot i{background:linear-gradient(90deg,#17A566,var(--green))} .g-burn i{background:linear-gradient(90deg,#E0983A,var(--amber))} .hint{font-size:12.5px;color:var(--mut);margin-top:9px} .hint.bad{color:var(--red);font-weight:600} .hint.good{color:var(--green);font-weight:600} /* ===== DATE NAV ===== */ .datenav{display:flex;gap:8px;align-items:stretch;margin-top:14px} .datenav button{width:46px;border:1.5px solid var(--line);background:var(--card);border-radius:11px; font-size:18px;color:var(--mut);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm)} .datenav button:hover{border-color:var(--steel);color:var(--steel)} .datenav button svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round} .datenav input{flex:1;border:1.5px solid var(--line);border-radius:11px;padding:10px;font-size:14.5px; font-family:var(--body);text-align:center;background:var(--card);color:var(--ink)} .datenav .today{width:auto;padding:0 15px;font-size:12.5px;font-weight:700} /* ===== MEALS / ITEMS ===== */ .meal{background:var(--card);border:1px solid var(--line);border-radius:var(--r);margin-bottom:9px;overflow:hidden;box-shadow:var(--shadow-sm)} .meal>.row{display:flex;align-items:center;gap:12px;padding:13px 15px} .meal .mt{font-family:var(--disp);font-weight:700;font-size:15px;letter-spacing:.2px;display:flex;align-items:center;gap:7px} .meal .mm{font-size:12px;color:var(--mut);font-variant-numeric:tabular-nums;margin-top:2px} .meal .grow{flex:1;min-width:0} .meal .del,.item .del{background:none;border:none;color:var(--faint);cursor:pointer;padding:6px;border-radius:8px;display:flex;flex:none} .meal .del:hover,.item .del:hover{color:var(--red);background:var(--red-soft)} .meal .del svg,.item .del svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round} .badge-ai{font-size:9.5px;font-weight:700;background:var(--purple-soft);color:var(--purple);padding:2px 7px;border-radius:999px;letter-spacing:.5px} .inrow{display:flex;gap:8px;margin-top:11px;flex-wrap:wrap;align-items:center} .inrow input,.inrow select{flex:1;min-width:0;padding:11px 12px;border:1.5px solid var(--line);border-radius:10px; font-size:14px;font-family:var(--body);background:var(--surface);color:var(--ink)} .inrow input::placeholder{color:var(--faint)} .inrow input:focus,.inrow select:focus,.datenav input:focus{outline:none;border-color:var(--steel); box-shadow:0 0 0 3px color-mix(in srgb,var(--steel) 22%,transparent)} .inrow .btn{padding:0 16px;height:44px} .itemlist{margin-top:8px} .item{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 2px;border-top:1px solid var(--line-2);font-size:13.5px} .item:first-child{border-top:none} .item .k{font-variant-numeric:tabular-nums;color:var(--mut)} /* ===== WATER ===== */ .cups{display:flex;gap:6px;flex-wrap:wrap;margin-top:11px} .cups button{width:34px;height:44px;border-radius:7px 7px 12px 12px;border:1.5px solid var(--line);background:var(--surface); cursor:pointer;font-size:10px;color:var(--faint);transition:.15s} .cups button.fill{background:linear-gradient(180deg,#BFE0FF,#8EC5F5);border-color:var(--steel);color:#0B3A63;font-weight:700} html[data-theme="dark"] .cups button.fill{background:linear-gradient(180deg,#1E4E7C,#2E77C9);color:#DDEBFB} /* ===== WELLBEING ===== */ .wb{display:grid;grid-template-columns:repeat(2,1fr);gap:11px;margin-top:11px} .wb .fld label{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--mut);margin-bottom:5px} .scale{display:flex;gap:5px} .scale button{flex:1;border:1.5px solid var(--line);background:var(--surface);border-radius:9px;padding:9px 0;font-weight:700;color:var(--mut);cursor:pointer;font-variant-numeric:tabular-nums;transition:.15s} .scale button.on{background:var(--steel);border-color:var(--steel);color:#fff;box-shadow:0 3px 10px color-mix(in srgb,var(--steel) 40%,transparent)} .wb input{width:100%;padding:10px 11px;border:1.5px solid var(--line);border-radius:9px;font-size:14px;font-family:var(--body);background:var(--surface);color:var(--ink)} .wb input:focus{outline:none;border-color:var(--steel);box-shadow:0 0 0 3px color-mix(in srgb,var(--steel) 22%,transparent)} /* ===== PLAN CARD ===== */ .planmeal{padding:10px 0;border-bottom:1px dashed var(--line)} .planmeal:last-child{border:none} .planmeal .t{font-weight:700;font-size:13.5px;display:flex;justify-content:space-between;gap:8px} .planmeal .t span{color:var(--mut);font-weight:500;font-size:12px;font-variant-numeric:tabular-nums} .planmeal .i{font-size:13px;color:var(--mut);margin-top:3px} .planmeal .alt{font-size:12.5px;color:var(--mut);margin-top:5px;padding-left:9px;border-left:2px solid var(--line)} .planmeal .alt b{display:inline-block;font-size:10px;letter-spacing:.5px;text-transform:uppercase; color:var(--steel);font-weight:800;margin-right:5px} /* ===== CHARTS / TABLES ===== */ svg.chart{width:100%;background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-sm)} table{width:100%;border-collapse:collapse;background:var(--card);font-size:13px;border-radius:var(--r);overflow:hidden} th{font-family:var(--disp);font-size:11px;letter-spacing:.8px;text-transform:uppercase;background:var(--navy); color:#fff;text-align:left;padding:9px 11px;font-weight:700} td{padding:8px 11px;border-top:1px solid var(--line);font-variant-numeric:tabular-nums} .tblwrap{border:1px solid var(--line);border-radius:var(--r);overflow:hidden} /* ===== SETTINGS ===== */ .set label{display:block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--mut);margin:15px 0 6px} .set input,.set select,.set textarea{width:100%;padding:12px;border:1.5px solid var(--line);border-radius:10px; font-size:15px;font-family:var(--body);background:var(--surface);color:var(--ink)} .set input:focus,.set select:focus,.set textarea:focus{outline:none;border-color:var(--steel); box-shadow:0 0 0 3px color-mix(in srgb,var(--steel) 22%,transparent)} .set textarea{min-height:72px;resize:vertical} .goalbox{background:var(--card-2);border:1px solid var(--line);border-radius:var(--r-sm);padding:14px;margin-top:16px} .note{font-size:12.5px;color:var(--mut);margin-top:10px;line-height:1.55} /* toggle row (dark mode) */ .togglerow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 0} .togglerow .tl{display:flex;align-items:center;gap:12px} .togglerow .ti{width:40px;height:40px;border-radius:11px;background:var(--card-2);display:flex;align-items:center;justify-content:center;color:var(--steel);flex:none} .togglerow .ti svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round} .togglerow .tt{font-weight:700;font-size:14px;color:var(--ink)} .togglerow .ts{font-size:12px;color:var(--faint);margin-top:1px} .switch{position:relative;width:52px;height:30px;flex:none;cursor:pointer} .switch input{opacity:0;width:0;height:0} .switch .sl{position:absolute;inset:0;background:var(--track);border-radius:999px;transition:.25s;border:1px solid var(--line)} .switch .sl::before{content:"";position:absolute;width:22px;height:22px;border-radius:50%;left:4px;top:3px;background:#fff; transition:.25s;box-shadow:0 2px 5px rgba(0,0,0,.25)} .switch input:checked+.sl{background:linear-gradient(135deg,#2E77C9,var(--navy));border-color:transparent} .switch input:checked+.sl::before{transform:translateX(21px)} .toast{position:fixed;left:50%;bottom:100px;transform:translateX(-50%) translateY(20px); background:var(--ink);color:var(--paper);padding:12px 20px;border-radius:999px;font-size:13.5px;font-weight:600; opacity:0;pointer-events:none;transition:.3s;z-index:99;max-width:90%;text-align:center;box-shadow:var(--shadow-lg)} .toast.show{opacity:1;transform:translateX(-50%) translateY(0)} /* ===== COACH CHAT ===== */ .chat{display:flex;flex-direction:column;gap:12px;padding-bottom:8px;padding-top:16px} .chatwrap{min-height:calc(100vh - 330px)} .msg{max-width:86%;padding:12px 15px;border-radius:18px;font-size:14px;line-height:1.55;white-space:pre-wrap;word-break:break-word;box-shadow:var(--shadow-sm)} .msg.user{align-self:flex-end;background:linear-gradient(135deg,var(--navy-2),var(--navy));color:#fff;border-bottom-right-radius:6px} .msg.assistant{align-self:flex-start;background:var(--card);border:1px solid var(--line);border-bottom-left-radius:6px} .msg.assistant b,.msg.assistant strong{color:var(--steel)} .msg .who{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;opacity:.6;margin-bottom:4px} .typing{align-self:flex-start;color:var(--faint);font-size:13px;padding:6px 8px} .typing i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--faint);margin:0 2px;animation:blink 1.2s infinite} .typing i:nth-child(2){animation-delay:.2s}.typing i:nth-child(3){animation-delay:.4s} @keyframes blink{0%,60%,100%{opacity:.25}30%{opacity:1}} @keyframes lt-spin{to{transform:rotate(360deg)}} .i-spin{animation:lt-spin .8s linear infinite;transform-origin:center} /* proposal card */ .proposal{align-self:flex-start;max-width:96%;background:var(--purple-soft);border:1.5px solid color-mix(in srgb,var(--purple) 35%,transparent); border-radius:18px;padding:15px;margin-top:-4px;box-shadow:var(--shadow-sm)} .proposal .ph{font-family:var(--disp);font-weight:800;font-size:14px;color:var(--purple);text-transform:uppercase;letter-spacing:.5px;display:flex;align-items:center;gap:7px} .proposal .pgroup{margin-top:9px} .proposal .pgroup .lbl{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--purple);opacity:.85} .proposal .pitem{font-size:13px;background:var(--card);border:1px solid var(--line);border-radius:9px;padding:8px 11px;margin-top:5px;display:flex;justify-content:space-between;gap:8px} .proposal .pitem .k{color:var(--mut);font-variant-numeric:tabular-nums;font-size:12px;white-space:nowrap} .proposal .pacts{display:flex;gap:8px;margin-top:13px} .proposal .done{font-weight:700;color:var(--green);margin-top:11px;display:flex;align-items:center;gap:6px} .proposal.resolved{opacity:.92} .proposal .done.dismissed{color:var(--mut)} .chatbar{position:fixed;left:0;right:0;bottom:74px;background:var(--card);border-top:1px solid var(--line); padding:11px 12px calc(11px + env(safe-area-inset-bottom));z-index:40;box-shadow:0 -6px 22px rgba(16,28,40,.09)} .chatbar .in{max-width:780px;margin:0 auto;display:flex;gap:9px;align-items:flex-end} .chatbar textarea{flex:1;border:1.5px solid var(--line);border-radius:15px;padding:12px 14px;font-size:15px; font-family:var(--body);resize:none;max-height:120px;min-height:46px;background:var(--surface);color:var(--ink)} .chatbar textarea:focus{outline:none;border-color:var(--steel);box-shadow:0 0 0 3px color-mix(in srgb,var(--steel) 22%,transparent)} .chatbar .send{width:46px;height:46px;border-radius:50%;background:linear-gradient(140deg,#2E77C9,var(--navy));color:#fff; border:none;flex-shrink:0;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 5px 14px rgba(31,95,168,.4)} .chatbar .send svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round} .chatbar .send:disabled{opacity:.5} .quickchips{display:flex;flex-wrap:wrap;gap:7px;padding:2px 0 9px} .quickchips::-webkit-scrollbar{display:none} .quickchips button{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;border:1.5px solid var(--line); background:var(--surface);color:var(--mut);border-radius:999px;padding:7px 12px;font-size:12.5px;font-weight:600;cursor:pointer;transition:.15s} @media (max-width:430px){ .quickchips button{padding:6px 10px;font-size:11.5px;gap:4px} .quickchips button svg{width:13px;height:13px} } .quickchips button:hover{border-color:var(--steel);color:var(--steel)} .quickchips button svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round} /* markdown-ish output */ .analysis{line-height:1.65;font-size:14px} .analysis h3{font-family:var(--disp);color:var(--steel);font-size:15px;margin:14px 0 4px} .analysis strong{color:var(--steel)} .analysis ul{margin:6px 0 6px 18px} .ai-off{background:var(--amber-soft);border:1px solid color-mix(in srgb,var(--amber) 40%,transparent);color:var(--amber); border-radius:var(--r);padding:13px 15px;font-size:13px;line-height:1.5;display:flex;gap:9px;align-items:flex-start} .ai-off svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;flex:none;margin-top:1px}