/* Modüller sayfası: temel görünüm css/main.css'ten gelir (ana sayfayla aynı tasarım dili); burada yalnız sayfaya özgü düzen var. */
.mhero{position:relative;z-index:2;padding:clamp(128px,14vw,176px) 0 0}
.mchips{list-style:none;margin:32px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.mchips a{display:inline-flex;align-items:center;min-height:42px;padding:0 16px;border-radius:999px;font-size:14px;font-weight:600;color:#0A1614;text-decoration:none}
.mchips a:hover{background-color:rgba(255,255,255,.85)}
.msec{position:relative;z-index:2;padding:clamp(72px,9vw,128px) 0 0;scroll-margin-top:64px}
.msec .two{align-items:center;gap:40px 72px}
.mtext{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.mh{margin:0;font-size:clamp(28px,3vw,42px);line-height:1.08;text-wrap:balance}
.mtag{font-size:12px;font-weight:700;padding:4px 11px;border-radius:999px;background:#087C72;color:#FFFFFF}
.mchk{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:16px;line-height:1.45}
.mchk li{display:flex;gap:12px}
.mchk svg{flex:none;margin-top:3px}
.mstore{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:15px;font-weight:700}
.mvis{display:flex;justify-content:center;min-width:0}
.mvis .pw{flex:1 1 auto;max-width:560px}
.mwide{margin-top:28px}
.mwide .pw{max-width:none}
.mcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:14px;margin-top:40px}
.mcard{border-radius:24px;padding:22px 24px;display:flex;flex-direction:column;gap:8px}
.mcard h3{margin:0;font-size:18px;font-weight:700;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.mcard p{margin:0;font-size:15px;line-height:1.5;color:#4A5654}
.mnew{font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;background:#ECE9F7;color:#4E3F8C}
.mcta{border-radius:32px;padding:clamp(24px,4vw,48px);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px 40px}
@media (min-width:861px){.msec .two.flip>.mvis{order:-1}.msec .two.flip{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}}
@media (max-width:820px){.mod-page .nav-link{display:none}}
@media (max-width:620px){.mchk{font-size:15px}.mcard{padding:18px 20px}}

/* Modül ekranları: hepsi aynı 8 sn döngüde, sırayla belirir */
.m-a1,.m-a2,.m-a3,.m-a4,.m-a5,.m-a6,.m-a7{animation-duration:8s;animation-iteration-count:infinite;animation-timing-function:cubic-bezier(.2,.7,.2,1)}
.m-a1{animation-name:mA1}.m-a2{animation-name:mA2}.m-a3{animation-name:mA3}.m-a4{animation-name:mA4}.m-a5{animation-name:mA5}.m-a6{animation-name:mA6}.m-a7{animation-name:mA7}
@keyframes mA1{0%,6%{opacity:0;transform:translateY(8px)}11%,90%{opacity:1;transform:none}95%,100%{opacity:0;transform:none}}
@keyframes mA2{0%,16%{opacity:0;transform:translateY(8px)}21%,90%{opacity:1;transform:none}95%,100%{opacity:0;transform:none}}
@keyframes mA3{0%,26%{opacity:0;transform:translateY(8px)}31%,90%{opacity:1;transform:none}95%,100%{opacity:0;transform:none}}
@keyframes mA4{0%,36%{opacity:0;transform:translateY(8px)}41%,90%{opacity:1;transform:none}95%,100%{opacity:0;transform:none}}
@keyframes mA5{0%,46%{opacity:0;transform:translateY(8px)}51%,90%{opacity:1;transform:none}95%,100%{opacity:0;transform:none}}
@keyframes mA6{0%,56%{opacity:0;transform:translateY(8px)}61%,90%{opacity:1;transform:none}95%,100%{opacity:0;transform:none}}
@keyframes mA7{0%,66%{opacity:0;transform:translateY(8px)}71%,90%{opacity:1;transform:none}95%,100%{opacity:0;transform:none}}
.m-g1,.m-g2,.m-g3,.m-g4{transform-origin:left center;animation-duration:8s;animation-iteration-count:infinite;animation-timing-function:cubic-bezier(.3,.7,.2,1)}
.m-g1{animation-name:mG1}.m-g2{animation-name:mG2}.m-g3{animation-name:mG3}.m-g4{animation-name:mG4}
@keyframes mG1{0%,8%{transform:scaleX(0);opacity:1}22%,90%{transform:scaleX(1);opacity:1}95%,100%{transform:scaleX(1);opacity:0}}
@keyframes mG2{0%,14%{transform:scaleX(0);opacity:1}28%,90%{transform:scaleX(1);opacity:1}95%,100%{transform:scaleX(1);opacity:0}}
@keyframes mG3{0%,20%{transform:scaleX(0);opacity:1}34%,90%{transform:scaleX(1);opacity:1}95%,100%{transform:scaleX(1);opacity:0}}
@keyframes mG4{0%,40%{transform:scaleX(0);opacity:1}56%,90%{transform:scaleX(1);opacity:1}95%,100%{transform:scaleX(1);opacity:0}}
.m-h1,.m-h2,.m-h3,.m-h4{transform-origin:center bottom;animation-duration:8s;animation-iteration-count:infinite;animation-timing-function:cubic-bezier(.3,.7,.2,1)}
.m-h1{animation-name:mH1}.m-h2{animation-name:mH2}.m-h3{animation-name:mH3}.m-h4{animation-name:mH4}
@keyframes mH1{0%,6%{transform:scaleY(0);opacity:1}18%,90%{transform:scaleY(1);opacity:1}95%,100%{transform:scaleY(1);opacity:0}}
@keyframes mH2{0%,14%{transform:scaleY(0);opacity:1}26%,90%{transform:scaleY(1);opacity:1}95%,100%{transform:scaleY(1);opacity:0}}
@keyframes mH3{0%,22%{transform:scaleY(0);opacity:1}34%,90%{transform:scaleY(1);opacity:1}95%,100%{transform:scaleY(1);opacity:0}}
@keyframes mH4{0%,30%{transform:scaleY(0);opacity:1}44%,90%{transform:scaleY(1);opacity:1}95%,100%{transform:scaleY(1);opacity:0}}
.m-reveal{animation:mReveal 8s linear infinite}
@keyframes mReveal{0%,30%{clip-path:inset(0 100% 0 0)}50%,90%{clip-path:inset(0 0 0 0);opacity:1}95%,100%{clip-path:inset(0 0 0 0);opacity:0}}
.m-drop{animation:mDrop 8s cubic-bezier(.2,.7,.2,1) infinite}
@keyframes mDrop{0%,16%{opacity:0;transform:translateY(-36px) rotate(-3deg)}26%,90%{opacity:1;transform:none}95%,100%{opacity:0;transform:none}}
.is-paused *{animation-play-state:paused !important}

}
@media (prefers-reduced-motion: reduce){
.mod-page *{animation:none !important}
}

/* Panel ekranları: panel.edorasapp.ai ve mobil uygulamanın sadeleştirilmiş kopyaları (örnek veri).
   Renk, köşe ve durum kuralları panelin kendi tasarım sisteminden alındı. */
.pw{--p:#059387;--p10:rgba(5,147,135,.1);--t:#685ca4;--t10:rgba(104,92,164,.12);--ink:#0f172a;--mut:#64748b;--out:#94a3b8;--ov:#e2e8f0;--sl:#F7F6F3;--sc:#EEEDE9;--sch:#E6E5E0;--lo:#FCFCFA;--ok:#059669;--okc:#ecfdf5;--okt:#065f46;--wr:#d97706;--wrc:#fffbeb;--wrt:#92400e;--er:#ba1a1a;--erc:#ffdad6;
  container-type:inline-size;position:relative;flex:1 1 380px;min-width:0;max-width:540px;margin:0;border-radius:14px;overflow:hidden;
  background:radial-gradient(70% 70% at 0 0,rgba(5,147,135,.07),transparent 60%),radial-gradient(60% 60% at 100% 100%,rgba(104,92,164,.06),transparent 60%),#F4F3EF;
  border:1px solid rgba(15,23,42,.09);box-shadow:0 1px 2px rgba(16,24,40,.05),0 28px 56px -32px rgba(16,40,36,.42);
  font-family:'Inter',system-ui,sans-serif;font-size:12px;line-height:1.4;color:var(--ink);text-align:left}
.pw-wide{flex-basis:100%;max-width:none}
.pw-bar{display:flex;align-items:center;gap:10px;height:32px;padding:0 12px;background:rgba(252,252,250,.88);border-bottom:1px solid var(--ov)}
.pw-dots{display:flex;gap:5px;flex:none}.pw-dots i{width:8px;height:8px;border-radius:50%;background:#DCDBD5}
.pw-url{flex:1;min-width:0;display:flex;justify-content:center;padding-right:28px}
.pw-url span{display:inline-flex;align-items:center;gap:4px;min-width:0;padding:2px 10px;border-radius:999px;background:var(--sc);color:var(--mut);font-size:10.5px;white-space:nowrap}
.pw-url .ms{font-size:12px}
.pw-in{display:flex}
.pw-rail{flex:none;width:42px;padding:10px 0;display:flex;flex-direction:column;align-items:center;gap:5px;background:rgba(252,252,250,.8);border-right:1px solid var(--ov)}
.pw-rail img{width:22px;height:22px;border-radius:7px;margin-bottom:8px}
.pw-rail .ms{width:28px;height:28px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:17px;color:rgba(15,23,42,.55)}
.pw-rail .ms.on{background:var(--p10);color:var(--p);box-shadow:inset 0 0 0 1px rgba(5,147,135,.16)}
.pw-main{flex:1;min-width:0;padding:12px;display:flex;flex-direction:column;gap:8px}
@container (max-width:430px){.pw-rail{display:none}.pw-main{padding:10px}.pw-hide-n{display:none !important}}
.ms{font-family:'Material Symbols Outlined';font-weight:400;font-style:normal;font-size:16px;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;direction:ltr;font-feature-settings:'liga';-webkit-font-smoothing:antialiased;display:inline-block;flex:none;user-select:none}

/* Panel yapı taşları */
.pc{background:rgba(252,252,250,.84);border:1px solid rgba(226,232,240,.8);border-radius:12px;box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 1px 2px rgba(16,24,40,.04),0 8px 22px -14px rgba(16,24,40,.12)}
.pc-p{padding:9px 10px}
.pc-h{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600}
.pc-h .ms{font-size:15px;color:var(--p)}
.pc-sub{font-size:9.5px;color:var(--mut)}
.prow{display:flex;align-items:center;gap:6px;min-width:0}
.pg{display:grid;gap:6px}
.ptx{font-size:9.5px;color:var(--mut)}
.pv{font-size:14px;font-weight:700;letter-spacing:-.01em}
.pill{display:inline-flex;align-items:center;gap:3px;border-radius:999px;padding:1px 7px;font-size:9.5px;font-weight:600;white-space:nowrap}
.pill .ms{font-size:12px}
.t-ok{background:var(--okc);color:var(--okt)}.t-wr{background:var(--wrc);color:var(--wrt)}.t-er{background:var(--erc);color:var(--er)}.t-p{background:var(--p10);color:var(--p)}.t-t{background:var(--t10);color:var(--t)}
.c-ok{color:var(--ok)}.c-wr{color:var(--wr)}.c-er{color:var(--er)}.c-p{color:var(--p)}.c-t{color:var(--t)}.c-mut{color:var(--mut)}
.pbtn{display:inline-flex;align-items:center;justify-content:center;gap:3px;height:22px;padding:0 9px;border-radius:999px;font-size:10px;font-weight:600;white-space:nowrap;border:1px solid var(--ov);background:var(--lo);color:var(--mut)}
.pbtn .ms{font-size:13px}
.pbtn-p{background:var(--p);border-color:var(--p);color:#fff;box-shadow:0 0 14px rgba(5,147,135,.3)}
.ptrack{display:block;height:5px;border-radius:999px;background:var(--ov);overflow:hidden}
.ptrack>span{display:block;height:100%;border-radius:999px}

/* Deneme detayı */
.ex-back{display:inline-flex;align-items:center;gap:3px;color:var(--p);font-weight:500;font-size:11.5px}
.ex-back .ms{font-size:15px}
.ex-chip{display:inline-flex;align-items:center;gap:5px;height:20px;padding:0 8px;border-radius:999px;background:var(--p10);color:var(--p);font-size:10.5px;font-weight:600}
.ex-chip span{color:var(--mut);font-weight:500}
.ex-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
.ex-stat{padding:6px 9px;border-radius:10px;display:flex;flex-direction:column;gap:1px}
.ex-stat .ptx{display:flex;align-items:center;gap:4px}.ex-stat .ptx .ms{font-size:13px;color:var(--p)}
.ex-stat b{font-size:13px;font-weight:600;white-space:nowrap}
.ex-stat b small{font-size:9.5px;font-weight:500;color:var(--mut)}
.trend{position:relative;height:92px;margin-top:6px}
.trend svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.trend .dot{position:absolute;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:var(--p)}
.trend .dot.now{width:11px;height:11px;margin:-5.5px 0 0 -5.5px;background:var(--t);box-shadow:0 0 0 2px #fff}
.trend .tip{position:absolute;background:rgba(255,255,255,.92);border:1px solid var(--ov);border-radius:8px;padding:3px 7px;font-size:9.5px;white-space:nowrap;box-shadow:0 6px 16px -8px rgba(16,24,40,.25)}
.trend-x{display:flex;justify-content:space-between;padding:0 1%;font-size:9px;color:var(--mut)}
.wk{display:flex;gap:7px;padding:5px 0}
.wk+.wk{border-top:1px solid rgba(226,232,240,.7)}
.wk-bar{flex:none;width:3px;height:26px;border-radius:999px}
.wk-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.wk-t{display:flex;align-items:center;gap:6px;justify-content:space-between}
.wk-t>span:first-child{font-size:11px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wk-p{flex:none;width:28px;text-align:right;font-size:10.5px;font-weight:600}

/* Sınıf × konu ısı haritası */
.hm{width:100%;border-collapse:separate;border-spacing:3px;font-size:10.5px;table-layout:fixed}
.hm th{font-weight:500;color:var(--mut);font-size:9.5px;text-align:center;padding:4px 2px;background:var(--sl);border-radius:6px}
.hm th:first-child{text-align:left;width:34%}
.hm th:nth-child(2){width:9%}
.hm td{border-radius:7px;text-align:center;padding:4px 2px;line-height:1.15}
.hm td:first-child{text-align:left;padding:4px 6px;background:transparent}
.hm td:first-child b{display:block;font-weight:500;font-size:11px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm td:first-child small{font-size:9px;color:var(--mut)}
.hm td:nth-child(2){color:var(--mut);font-weight:500;background:transparent}
.hm td b{font-weight:600}
.hm td small{display:block;font-size:8.5px;opacity:.8}
.h0{background:var(--sl);color:var(--mut)}
.h-1{background:rgba(186,26,26,.1);color:var(--er)}.h-2{background:rgba(186,26,26,.2);color:var(--er)}
.h1{background:rgba(5,150,105,.1);color:var(--ok)}.h2{background:rgba(5,150,105,.2);color:var(--ok)}
.hm-focus{box-shadow:inset 0 0 0 1.5px rgba(186,26,26,.55)}
@container (max-width:520px){.hm .hx{display:none}.hm th:first-child{width:40%}}

/* Öğretmen performansı */
.kpi{position:relative;padding:7px 9px 7px 12px;border-radius:10px;display:flex;flex-direction:column;gap:1px}
.kpi::before{content:"";position:absolute;left:0;top:7px;bottom:7px;width:3px;border-radius:999px;background:var(--p)}
.kpi.k-er::before{background:var(--er)}
.kpi .pv{font-size:15px}
.tp{width:100%;border-collapse:collapse;font-size:11px}
.tp th{font-weight:500;font-size:9.5px;color:var(--out);text-align:left;padding:7px 6px 6px}
.tp td{border-top:1px solid var(--ov);padding:6px;white-space:nowrap}
.tp td:first-child b{display:block;font-weight:600}
.tp td:first-child small{font-size:9.5px;color:var(--out)}
.sk{display:inline-flex;justify-content:center;min-width:26px;padding:1px 6px;border-radius:999px;font-weight:700;font-size:11px}
.tr{display:inline-flex;align-items:center;font-size:9px;font-weight:700;margin-left:3px}
.tr .ms{font-size:11px}

/* Ödev kontrolü */
.hw-g{border:1px solid rgba(226,232,240,.75);border-radius:10px;overflow:hidden;background:var(--lo)}
.hw-gh{display:flex;align-items:center;gap:7px;padding:6px 9px;background:rgba(247,246,243,.8)}
.hw-gh b{color:var(--p);font-size:11.5px}
.cbx{flex:none;width:12px;height:12px;border-radius:3px;border:1.5px solid var(--out);background:#fff;display:inline-flex;align-items:center;justify-content:center}
.cbx.on{background:var(--p);border-color:var(--p)}
.cbx.on::after{content:"";width:5px;height:3px;border:solid #fff;border-width:0 0 1.5px 1.5px;transform:rotate(-45deg) translate(0,-1px)}
.hw-r{display:flex;align-items:center;gap:8px;padding:7px 9px;border-top:1px solid rgba(226,232,240,.75)}
.hw-r>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.hw-r b{font-weight:600;font-size:11px}
.hw-r>.hw-acts{flex:none;flex-direction:row;gap:3px}
.hw-acts .pbtn{height:20px;padding:0 7px;font-size:9.5px}
.pbtn.on-ok{background:var(--okc);border-color:rgba(5,150,105,.35);color:var(--ok)}
.pbtn.on-wr{background:var(--wrc);border-color:rgba(217,119,6,.35);color:var(--wr)}
.hw-foot{display:flex;align-items:center;gap:8px;justify-content:space-between;padding:7px 2px 0;font-size:10.5px;color:var(--mut)}

/* Haftalık program */
.tt{width:100%;border-collapse:separate;border-spacing:3px;table-layout:fixed;font-size:10px}
.tt th{font-size:10px;font-weight:600;padding:3px 0 4px;color:var(--ink)}
.tt th small{display:block;font-size:9px;font-weight:400;color:var(--out)}
.tt th.today{background:var(--p10);color:var(--p);border-radius:7px}
.tt th:first-child{width:38px}
.tt td.tm{text-align:center;line-height:1.15}
.tt td.tm b{display:block;color:var(--p);font-size:10px}
.tt td.tm small{font-size:8.5px;color:var(--mut)}
.tt td.c{border-radius:7px;padding:5px 5px 5px 7px;vertical-align:top;line-height:1.2;overflow:hidden}
.tt td.c b{display:block;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tt td.c small{display:block;font-size:8.5px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tt td.lunch{background:var(--wrc);color:var(--wrt);border:1px solid rgba(217,119,6,.45);border-radius:7px;text-align:center;font-size:9px;font-weight:600;padding:2px}
.s-mat{background:#E6EEFB;box-shadow:inset 3px 0 0 #2563eb}.s-mat b{color:#1e3a8a}
.s-tr{background:#F8E5E3;box-shadow:inset 3px 0 0 #dc2626}.s-tr b{color:#7f1d1d}
.s-fiz{background:#F8E9DA;box-shadow:inset 3px 0 0 #ea580c}.s-fiz b{color:#7c2d12}
.s-kim{background:#DDF3F4;box-shadow:inset 3px 0 0 #0891b2}.s-kim b{color:#164e63}
.s-biy{background:#E2F2E3;box-shadow:inset 3px 0 0 #16a34a}.s-biy b{color:#14532d}
.s-tar{background:#F8F2D6;box-shadow:inset 3px 0 0 #ca8a04}.s-tar b{color:#713f12}
.s-geo{background:#EAE5F8;box-shadow:inset 3px 0 0 #7c3aed}.s-geo b{color:#4c1d95}
.s-ing{background:#EBEDF9;box-shadow:inset 3px 0 0 #4f46e5}.s-ing b{color:#312e81}
.today-c{outline:1.5px solid rgba(5,147,135,.28);outline-offset:-1.5px}
@container (max-width:430px){.tt td.c small{display:none}.tt td.c{padding:5px 3px 5px 6px}}

/* Yoklama */
.at-sum{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:7px 10px;border-radius:12px}
.pring{flex:none;width:24px;height:24px}
.at-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.at-c{padding:7px;border-radius:10px;display:flex;flex-direction:column;gap:6px}
.at-who{display:flex;align-items:center;gap:6px;min-width:0}
.av{flex:none;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:8.5px;font-weight:700;color:var(--ink)}
.at-who b{font-size:11px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.at-who small{font-size:9.5px;color:var(--mut)}
.at-btns{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px}
.at-btns span{height:20px;border-radius:999px;border:1px solid var(--ov);background:var(--lo);color:var(--mut);display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:500}
.at-btns .a-ok{background:var(--okc);border-color:rgba(5,150,105,.4);color:var(--ok)}
.at-btns .a-er{background:var(--erc);border-color:rgba(186,26,26,.4);color:var(--er)}
.at-btns .a-wr{background:var(--wrc);border-color:rgba(217,119,6,.4);color:var(--wr)}
.at-save{align-self:flex-end;display:flex;align-items:center;gap:8px;padding:6px 6px 6px 10px;border-radius:12px;background:rgba(252,252,250,.9);border:1px solid var(--ov);box-shadow:0 14px 30px -14px rgba(16,24,40,.3);font-size:10.5px}
.at-save i{width:6px;height:6px;border-radius:50%;background:var(--ok)}
@container (max-width:360px){.at-grid{grid-template-columns:minmax(0,1fr)}}

/* AI koçluk */
.ai-sum{position:relative;overflow:hidden;padding:8px 10px;border-radius:12px;display:flex;gap:7px;align-items:flex-start;font-size:11px;line-height:1.45}
.ai-sum::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(104,92,164,.1),rgba(5,147,135,.1));pointer-events:none}
.ai-sum .ms{color:var(--p);font-size:16px;position:relative}
.ai-sum span{position:relative}
.ai-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:7px}
@container (max-width:430px){.ai-grid{grid-template-columns:minmax(0,1fr)}}
.ai-out{border:1px solid rgba(104,92,164,.25);border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:6px;background:rgba(252,252,250,.7)}
.ai-out ol{margin:0;padding-left:15px;display:flex;flex-direction:column;gap:4px;font-size:10.5px;line-height:1.45}
.ai-out ol b{font-weight:600}
.ai-note{display:flex;align-items:center;gap:4px;font-size:9px;color:var(--mut)}
.ai-note .ms{font-size:12px;color:var(--t)}
.ai-side{border-radius:10px;background:rgba(247,246,243,.8);padding:8px 9px;display:flex;flex-direction:column;gap:6px}
.ai-side>span{display:flex;align-items:center;gap:4px;font-size:10px;font-weight:600}
.ai-side>span .ms{font-size:13px;color:var(--p)}
.ai-k{display:flex;flex-direction:column;gap:3px;font-size:10px}
.ai-k div{display:flex;justify-content:space-between;gap:6px}
.ai-k b{font-weight:600}

/* Mobil uygulama */
.ph{width:250px;max-width:100%;border:9px solid #0A1614;border-radius:36px;background:#ECF4F3;padding:14px 12px 16px;box-sizing:border-box;display:flex;flex-direction:column;gap:12px;font-family:'Inter',system-ui,sans-serif;font-size:12px;line-height:1.35;color:#0F172A;text-align:left;box-shadow:0 30px 60px -30px rgba(10,22,20,.55)}
.ph-top{display:flex;align-items:center;gap:8px}
.ph-top img{width:26px;height:26px;border-radius:8px;background:#fff}
.ph-top b{font-size:13px;font-weight:700;flex:1}
.ph-top .ms{font-size:19px;color:#64748B}
.ph-card{background:#F7FBFB;border:1px solid #E2E8F0;border-radius:20px;padding:12px;box-shadow:0 4px 12px rgba(5,147,135,.08)}
.ph-goal{display:flex;align-items:center;gap:9px}
.ph-goal>.ms{width:34px;height:34px;border-radius:11px;background:#F1F8F7;color:#059387;display:flex;align-items:center;justify-content:center;font-size:19px}
.ph-goal small{display:block;font-size:8.5px;font-weight:800;letter-spacing:.08em;color:#059387}
.ph-goal b{font-size:12.5px;font-weight:700;line-height:1.3}
.ph-cd{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:9px;padding-top:8px;border-top:1px solid #E2E8F0;font-size:9.5px;font-weight:600;color:#64748B}
.ph-cd b{font-size:20px;font-weight:800;color:#059387;font-variant-numeric:tabular-nums}
.ph-cd b small{font-size:8px;letter-spacing:.06em}
.ph-sec{display:flex;justify-content:space-between;align-items:center;margin-bottom:-4px}
.ph-sec b{font-size:13.5px;font-weight:700}
.ph-sec span{font-size:10px;font-weight:600;color:#059387}
.ph-hw{display:flex;justify-content:space-between;align-items:center}
.ph-hw b{font-size:18px;font-weight:800;color:#007A59}
.ph-hw b small{font-size:10px;font-weight:600}
.ph-hw span{font-size:9px;font-weight:600;color:#64748B;background:#F1F8F7;border-radius:999px;padding:3px 7px}
.ph-tiles{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}
.ph-tiles div{border-radius:12px;padding:7px 8px;background:#F1F8F7;display:flex;flex-direction:column}
.ph-tiles div:first-child{background:#E1F6ED;color:#007A59}
.ph-tiles b{font-size:16px;font-weight:800}
.ph-tiles span{font-size:9px;font-weight:600}
.ph-streak{display:flex;gap:7px;align-items:center;margin-top:8px;padding:7px 8px;border-radius:12px;background:#FFF4E8}
.ph-streak .ms{color:#C65D12;font-size:20px;font-variation-settings:'FILL' 1}
.ph-streak b{display:block;font-size:10.5px;color:#A34B00}
.ph-streak span{font-size:9px;color:#64748B;line-height:1.35}