:root{--navy:#251d49;--navy2:#34285f;--teal:#27b8b6;--teal2:#168f91;--bg:#f4f5f8;--card:#fff;--text:#262733;--muted:#7b7f8d;--line:#e5e7ee;--green:#198754;--orange:#df8c18;--red:#c74343;--blue:#2676d9;--shadow:0 18px 50px rgba(37,29,73,.08)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--text)}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.hidden{display:none!important}
.app-shell{min-height:100vh;display:grid;grid-template-columns:255px 1fr}.sidebar{position:sticky;top:0;height:100vh;background:linear-gradient(180deg,#251d49,#1f183e);padding:24px 18px;color:white;display:flex;flex-direction:column;z-index:20}.brand{display:flex;gap:12px;align-items:center;padding:0 7px 24px;border-bottom:1px solid rgba(255,255,255,.1)}.brand-mark{width:56px;height:42px;border:1px solid rgba(255,255,255,.25);border-radius:12px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.brand-mark i{position:absolute;left:0;bottom:0;width:7px;height:100%;background:var(--teal)}.brand-mark b{font-size:14px;letter-spacing:2px}.brand strong{display:block;font-size:16px}.brand span{display:block;font-size:10px;color:#bdb7d0;margin-top:3px}.nav{padding:18px 0;display:flex;flex-direction:column;gap:5px;overflow:auto}.nav button{width:100%;border:0;background:transparent;color:#d9d5e6;text-align:left;padding:11px 12px;border-radius:10px;display:flex;gap:10px;align-items:center;font-size:13px}.nav button:hover,.nav button.active{background:rgba(255,255,255,.1);color:white}.nav button.active{box-shadow:inset 3px 0 var(--teal)}.nav .nav-group{font-size:9px;letter-spacing:1.5px;color:#8f88aa;text-transform:uppercase;margin:14px 10px 4px}.nav .badge{margin-left:auto;background:#e55555;color:#fff;min-width:19px;height:19px;padding:0 5px;border-radius:10px;display:grid;place-items:center;font-size:9px}.side-bottom{margin-top:auto;border-top:1px solid rgba(255,255,255,.1);padding-top:16px;display:flex;flex-direction:column;gap:10px}.side-bottom>a{font-size:10px;color:#aaa4bd;padding-left:4px}.local-state{display:flex;align-items:center;gap:9px;background:rgba(255,255,255,.07);padding:10px;border-radius:10px}.local-state .dot,.sync-badge span{width:8px;height:8px;border-radius:50%;background:#42d392;box-shadow:0 0 0 4px rgba(66,211,146,.12)}.local-state b{display:block;font-size:11px}.local-state small{display:block;color:#aaa4bd;font-size:8px;margin-top:2px}
.main{min-width:0}.topbar{min-height:78px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:13px 28px;gap:18px;position:sticky;top:0;z-index:15}.menu-btn{display:none;border:0;background:#f0eff5;border-radius:9px;padding:8px 10px}.title-wrap{min-width:180px}.title-wrap p{margin:0 0 3px;color:#9994a8;font-size:9px}.title-wrap h1{margin:0;font-size:22px}.top-actions{margin-left:auto;display:flex;align-items:center;gap:12px}.sync-badge{display:flex;align-items:center;gap:7px;background:#effaf5;color:#257753;border-radius:20px;padding:7px 10px;font-size:9px}.role-switch{display:flex;align-items:center;gap:7px;background:#f7f7fa;border:1px solid var(--line);padding:5px 8px;border-radius:10px}.role-switch span{font-size:9px;color:var(--muted)}.role-switch select{border:0;background:transparent;font-size:11px;max-width:175px;outline:none}.user-chip{display:flex;align-items:center;gap:8px}.avatar{width:34px;height:34px;border-radius:10px;background:var(--navy);color:white;display:grid;place-items:center;font-weight:700}.user-chip b{display:block;font-size:11px}.user-chip span{display:block;font-size:8px;color:var(--muted);margin-top:2px}.content{padding:25px 28px 60px;max-width:1580px;margin:0 auto}
.toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}.section-title{margin:0;font-size:21px}.section-sub{margin:5px 0 0;font-size:11px;color:var(--muted);max-width:760px;line-height:1.55}.btn{border:0;border-radius:9px;padding:10px 14px;font-weight:700;font-size:11px}.btn.primary{background:var(--navy);color:#fff}.btn.teal{background:var(--teal2);color:#fff}.btn.soft{background:#f0eff6;color:var(--navy)}.btn.ghost{background:#fff;border:1px solid var(--line);color:#555}.btn.danger{background:#fff0f0;color:var(--red)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-row{display:flex;gap:8px;flex-wrap:wrap}.grid{display:grid;gap:15px}.kpi-grid{grid-template-columns:repeat(5,minmax(0,1fr));margin-bottom:17px}.kpi{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;box-shadow:var(--shadow)}.kpi span{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.8px}.kpi strong{display:block;font-size:27px;margin:8px 0 3px}.kpi small{font-size:9px;color:#9a9dab}.card{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}.card-head{padding:15px 17px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}.card-head h3{margin:0;font-size:14px}.card-head p{margin:3px 0 0;color:var(--muted);font-size:9px}.card-body{padding:16px 17px}.two-col{grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr)}.three-col{grid-template-columns:repeat(3,minmax(0,1fr))}.action-list{display:flex;flex-direction:column}.action-row{display:grid;grid-template-columns:90px 1fr auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #eeeef3}.action-row:last-child{border-bottom:0}.action-row .code{font-weight:700;font-size:10px;color:var(--navy)}.action-row b{display:block;font-size:11px}.action-row span{font-size:9px;color:var(--muted)}
.chip{display:inline-flex;align-items:center;border-radius:20px;padding:5px 8px;font-size:8px;font-weight:800;letter-spacing:.3px;background:#f0eff5;color:#665f7b}.chip.green{background:#eaf8f0;color:#18734a}.chip.orange{background:#fff5e7;color:#a76510}.chip.red{background:#fff0f0;color:#aa3333}.chip.teal{background:#e8f9f8;color:#148180}.chip.blue{background:#eef5ff;color:#2366ad}.chip.purple{background:#f1eefb;color:#5a4a91}
.table-wrap{overflow:auto}.data-table{width:100%;border-collapse:collapse;min-width:900px}.data-table th{text-align:left;background:#fafafd;color:#817d8c;font-size:8px;text-transform:uppercase;letter-spacing:.55px;padding:10px;border-bottom:1px solid var(--line);position:sticky;top:0}.data-table td{padding:10px;border-bottom:1px solid #f0f0f4;font-size:10px;vertical-align:middle}.data-table tr:hover td{background:#fcfcfe}.data-table td b{font-size:10px}.mini{font-size:8px;color:var(--muted)}.link-btn{border:0;background:transparent;color:var(--teal2);font-weight:700;font-size:9px;padding:4px}.field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.field{display:flex;flex-direction:column;gap:5px}.field.full{grid-column:1/-1}.field label{font-size:9px;font-weight:700;color:#77717f}.field input,.field select,.field textarea{border:1px solid #dcdde5;border-radius:9px;padding:10px 11px;background:white;outline:none;font-size:11px}.field textarea{min-height:78px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--teal)}.dropzone{border:1.5px dashed #bbb6ca;border-radius:12px;background:#fbfbfd;padding:20px;text-align:center;position:relative}.dropzone.drag{border-color:var(--teal);background:#eefafa}.dropzone input{position:absolute;inset:0;opacity:0;cursor:pointer}.dropzone b{display:block;font-size:12px}.dropzone span{display:block;color:var(--muted);font-size:9px;margin-top:5px}.steps{display:flex;align-items:center;gap:7px;margin-bottom:18px}.step{display:flex;align-items:center;gap:7px;color:#aaa5b5;font-size:9px}.step i{width:24px;height:24px;border-radius:50%;border:1px solid #d9d6e0;display:grid;place-items:center;font-style:normal;background:white}.step.active{color:var(--navy);font-weight:700}.step.active i,.step.done i{background:var(--navy);color:white;border-color:var(--navy)}.step-line{height:1px;flex:1;background:#dddbe3;max-width:70px}
.file-list{display:flex;flex-direction:column;gap:8px}.file-row{border:1px solid var(--line);border-radius:10px;padding:10px;display:flex;align-items:center;gap:10px}.file-icon{width:38px;height:38px;border-radius:9px;background:#f0eff6;color:var(--navy);display:grid;place-items:center;font-size:9px;font-weight:800}.file-row b{display:block;font-size:10px}.file-row span{display:block;font-size:8px;color:var(--muted);margin-top:2px}.file-row .file-actions{margin-left:auto;display:flex;gap:6px}.drawing-preview{width:100%;height:64vh;border:0;background:#f7f7f9;border-radius:10px}.drawing-img{display:block;max-width:100%;max-height:68vh;margin:auto;background:white;border:1px solid var(--line)}.notice{padding:12px 14px;border-radius:10px;background:#f1f8ff;border:1px solid #d7eaff;color:#37617f;font-size:10px;line-height:1.5}.notice.warn{background:#fff8eb;border-color:#f3dfb5;color:#8a651e}.notice.success{background:#edf9f3;border-color:#ccebdc;color:#27684c}.notice + .notice{margin-top:8px}
.project-card{padding:16px}.project-card .top{display:flex;justify-content:space-between;gap:12px}.project-card h3{margin:0;font-size:14px}.project-card p{margin:5px 0 0;color:var(--muted);font-size:9px}.project-meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin:14px 0}.project-meta div{background:#f8f8fb;border-radius:8px;padding:8px}.project-meta span{display:block;font-size:7px;color:#92909a;text-transform:uppercase}.project-meta b{display:block;font-size:9px;margin-top:3px}.progress{height:5px;background:#ededf2;border-radius:4px;overflow:hidden}.progress i{display:block;height:100%;background:var(--teal)}
.tabbar{display:flex;gap:5px;border-bottom:1px solid var(--line);padding:0 16px}.tabbar button{border:0;background:transparent;padding:11px 10px;font-size:9px;color:#84818d;border-bottom:2px solid transparent}.tabbar button.active{color:var(--navy);font-weight:700;border-bottom-color:var(--teal)}.info-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.info-box{background:#fafafd;border:1px solid #eeeeF3;padding:10px;border-radius:9px}.info-box span{display:block;color:var(--muted);font-size:8px}.info-box b{display:block;font-size:10px;margin-top:4px}.bom-source{font-size:8px;color:var(--muted)}
.wo-card{padding:16px}.wo-card .wo-top{display:flex;justify-content:space-between;gap:10px}.wo-card h3{font-size:13px;margin:0}.wo-card p{font-size:9px;color:var(--muted);margin:4px 0 0}.wo-numbers{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:13px 0}.wo-numbers div{padding:9px;background:#f8f8fb;border-radius:8px}.wo-numbers span{display:block;font-size:7px;color:#999}.wo-numbers b{display:block;font-size:11px;margin-top:3px}.station-hero{background:linear-gradient(135deg,#251d49,#3d326b);color:white;border-radius:16px;padding:20px;margin-bottom:16px;display:flex;justify-content:space-between;align-items:center}.station-hero h2{margin:0;font-size:22px}.station-hero p{margin:4px 0 0;color:#c8c3d8;font-size:10px}.station-hero .big{font-size:35px;font-weight:800;color:#4fd0ca}.qc-row{display:grid;grid-template-columns:100px 1fr 120px auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.recipe-list{display:flex;flex-direction:column;gap:6px}.recipe-row{display:grid;grid-template-columns:1.3fr .6fr .6fr;gap:8px;padding:8px 9px;border:1px solid var(--line);border-radius:8px;font-size:9px}.code-history{display:flex;flex-direction:column;gap:5px}.history-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;padding:8px;border-left:3px solid #ddd;background:#fafafd;font-size:9px}.history-row.current{border-left-color:var(--teal)}
.modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:24px}.modal-backdrop{position:absolute;inset:0;background:rgba(22,17,42,.62);backdrop-filter:blur(3px)}.modal-card{position:relative;z-index:2;background:#fff;width:min(1000px,96vw);max-height:92vh;overflow:auto;border-radius:16px;padding:22px;box-shadow:0 30px 100px rgba(0,0,0,.25)}.modal-close{position:absolute;right:12px;top:10px;border:0;background:#f3f2f6;border-radius:50%;width:30px;height:30px;font-size:18px}.modal h2{margin:0 0 16px}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}.toast{position:fixed;right:22px;bottom:22px;background:#221c3e;color:white;border-radius:10px;padding:11px 14px;font-size:10px;opacity:0;transform:translateY(8px);pointer-events:none;transition:.2s;z-index:200;max-width:380px}.toast.show{opacity:1;transform:none}
.empty{padding:35px 18px;text-align:center;color:#9794a1;font-size:10px}.audit{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9px}.audit-row{display:grid;grid-template-columns:145px 130px 1fr;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
@media(max-width:1180px){.kpi-grid{grid-template-columns:repeat(3,1fr)}.two-col{grid-template-columns:1fr}.three-col{grid-template-columns:repeat(2,1fr)}.top-actions .user-chip{display:none}}
@media(max-width:860px){.app-shell{display:block}.sidebar{position:fixed;left:-270px;width:255px;transition:.2s}.sidebar.open{left:0}.main{width:100%}.menu-btn{display:block}.topbar{padding:10px 13px}.content{padding:18px 13px 50px}.role-switch span,.sync-badge{display:none}.role-switch select{max-width:135px}.kpi-grid{grid-template-columns:repeat(2,1fr)}.three-col{grid-template-columns:1fr}.field-grid,.info-grid,.project-meta{grid-template-columns:1fr 1fr}.toolbar{align-items:stretch;flex-direction:column}.action-row{grid-template-columns:75px 1fr}.action-row>.btn{grid-column:1/-1}.qc-row{grid-template-columns:75px 1fr}.qc-row>:nth-child(3),.qc-row>:nth-child(4){grid-column:2}.modal{padding:10px}.modal-card{padding:18px 13px}}

/* ==============================================================
   EK — telefonda yatay taşma düzeltmesi
   Eklenme: 25.08.2026
   Sorun : 390 px genişlikte üst çubuktaki "Test rolü" seçicisi
           26 px taşıyor, sayfa yana kayıyordu.
   Bu blok yalnızca ekleme yapar. Silerseniz dosya GPT'nin verdiği
   hâline döner (styles.css.orijinal ile karşılaştırabilirsiniz).
   ============================================================== */
@media(max-width:560px){
  .topbar{flex-wrap:wrap;row-gap:8px}
  .top-actions{margin-left:0;width:100%;justify-content:flex-end;flex-wrap:wrap}
  .role-switch{min-width:0}
  .role-switch select{max-width:112px}
  .user-chip{min-width:0}
}