*{box-sizing:border-box}html{background:#edf1f3}body{margin:0;background:#edf1f3;color:#17212b;font-family:Inter,Arial,sans-serif;padding-bottom:92px;min-height:100vh}header{background:#1d2933;color:#fff;padding:22px 18px 16px;display:flex;justify-content:space-between;align-items:end;gap:12px}header small{letter-spacing:.14em;color:#a8bac8}header h1{margin:4px 0 0;font-size:34px}.header-actions{display:flex;gap:8px}button{border:0;border-radius:10px;padding:10px 14px;font-weight:800;cursor:pointer}header button{background:#34495a;color:white}nav{display:flex;gap:8px;overflow:auto;padding:12px;background:#fff;border-bottom:1px solid #ccd5db;position:sticky;top:0;z-index:4;scrollbar-width:none}nav::-webkit-scrollbar{display:none}nav button{white-space:nowrap;background:#e7edf1;color:#40505c}nav button.active{background:#1d2933;color:#fff}main{padding:16px}.hero{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.metric{background:white;padding:16px;border-radius:14px;border:1px solid #d7dfe4}.metric strong{display:block;font-size:28px}.metric span{font-size:12px;color:#687985}.section-title{margin:24px 0 10px}.card{background:white;border:1px solid #d7dfe4;border-radius:14px;padding:14px;margin:10px 0}.card h3{margin:0 0 6px}.row{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.row-actions{display:flex;gap:6px}.mini{padding:6px 8px;border-radius:8px;background:#e8eef2;color:#364753;font-size:11px}.tag{font-size:11px;background:#eaf0f4;padding:5px 7px;border-radius:99px;white-space:nowrap}.tag.done,.tag.paid,.tag.available{background:#dcefe4;color:#215f38}.tag.planned,.tag.draft{background:#efe8d7;color:#795b18}.tag.cancelled,.tag.loss{background:#f2dddd;color:#7c2e2e}.muted{color:#6a7882}.tiny{font-size:12px}.fab{position:fixed;right:20px;bottom:22px;border-radius:50%;width:58px;height:58px;background:#dd8b42;color:white;font-size:28px;box-shadow:0 8px 25px #0003;z-index:10}.form{display:grid;gap:12px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form label{font-weight:800;font-size:13px}.form input,.form select,.form textarea{width:100%;padding:12px;border:1px solid #bdc9d0;border-radius:9px;background:white;font:inherit;margin-top:5px}.form textarea{min-height:92px}.form button{background:#1d2933;color:white}.danger{background:#7c2e2e!important;color:white}.empty{padding:28px;text-align:center;color:#6b7880;background:white;border:1px dashed #c7d1d7;border-radius:14px}.module-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.module{background:white;border:1px solid #d7dfe4;border-radius:14px;padding:14px}.module strong{display:block;font-size:17px}.module span{font-size:12px;color:#6a7882}.progress{height:8px;background:#e6ecef;border-radius:99px;overflow:hidden;margin-top:10px}.progress>i{display:block;height:100%;background:#dd8b42}.notice{padding:12px;border-radius:12px;background:#fff4dc;border:1px solid #edd7a5;color:#6b5217}.toolbar{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.toolbar select,.toolbar input{padding:10px;border:1px solid #c4ced4;border-radius:9px;background:white}dialog{border:0;border-radius:18px;padding:0;width:min(620px,94vw);max-height:88vh;overflow:auto;box-shadow:0 24px 80px #0005}dialog::backdrop{background:#0e1720aa}.dialog-shell{padding:0;margin:0}.dialog-head{position:sticky;top:0;background:#fff;border-bottom:1px solid #dfe6ea;padding:18px;display:flex;justify-content:space-between;align-items:start;z-index:2}.dialog-head h2{margin:3px 0 0}.dialog-head small{color:#71818c;letter-spacing:.12em}.icon-btn{background:#eef2f4;color:#41515d}.dialog-shell #record-form{padding:18px}.report-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.report-number{font-size:30px;font-weight:900}.cycle{display:flex;gap:8px;flex-wrap:wrap}.cycle span{background:#fff;border:1px solid #d7dfe4;padding:9px 12px;border-radius:999px;font-size:12px;font-weight:800}@media(min-width:800px){main{max-width:1100px;margin:auto}.hero{grid-template-columns:repeat(4,1fr)}.module-grid{grid-template-columns:repeat(4,1fr)}.report-grid{grid-template-columns:repeat(4,1fr)}}@media(max-width:560px){.form-grid{grid-template-columns:1fr}.header-actions button{padding:9px 10px}.row{align-items:flex-start}}
/* Redmi/mobile usability pass — 2026-10-24 */
.sync-chip{display:inline-flex;align-items:center;gap:7px;margin-top:8px;padding:6px 9px;border-radius:999px;background:#ffffff17;border:1px solid #ffffff24;font-size:11px;font-weight:800;color:#dce6ec}.sync-dot{width:8px;height:8px;border-radius:50%;background:#e7a451;box-shadow:0 0 0 3px #e7a45122}.sync-chip.connected .sync-dot{background:#5ec58b;box-shadow:0 0 0 3px #5ec58b22}.sync-chip.error .sync-dot{background:#e67575;box-shadow:0 0 0 3px #e6757522}nav{scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}nav button{scroll-snap-align:start;min-height:44px}.fab{bottom:calc(24px + env(safe-area-inset-bottom));right:18px}.notice{margin-right:72px}@media(max-width:560px){header{align-items:flex-start;padding-top:18px}.header-actions{flex-direction:column;align-items:stretch}.header-actions button{min-width:76px}nav{padding:10px 12px}nav button{padding:11px 15px}.fab{width:56px;height:56px;bottom:calc(18px + env(safe-area-inset-bottom));right:14px}.notice{margin-right:68px}.module{min-height:126px}.module-grid{gap:12px}.section-title{margin-top:28px}}

.connect-form{padding:18px;display:grid;gap:12px}.connect-form label{font-weight:800;font-size:13px}.connect-form input{width:100%;padding:12px;border:1px solid #bdc9d0;border-radius:9px;background:white;font:inherit;margin-top:5px}.connect-form>button{background:#1d2933;color:#fff}.sync-meta{margin-top:8px;font-size:11px;color:#637581}.sync-error{color:#8a3434}.sync-ok{color:#24613b}
