/* Rules the old app expressed as inline React styles. app.css is the old app's compiled stylesheet, untouched; everything added lives here. */ /* ── Shell: sidebar width follows the collapsed state on ── */ .app-shell{display:flex;min-height:100vh;background:var(--bg)} .sidebar{width:248px;flex-shrink:0;display:flex;flex-direction:column;position:fixed;top:0;left:0;height:100vh;z-index:400;transition:width .25s ease,transform .25s ease;overflow:visible} .main-content{margin-left:248px;flex:1;min-width:0;display:flex;flex-direction:column;transition:margin-left .25s ease} .sb-collapsed .sidebar{width:72px} .sb-collapsed .main-content{margin-left:72px} .sb-mini{display:none} .sb-collapsed .sb-full,.sb-collapsed .sb-label{display:none} .sb-collapsed .sb-mini{display:inline-flex} .sb-collapsed .rd-brand{padding:0;justify-content:center} .sb-collapsed .rd-nav{justify-content:center;padding:9px 0} .sb-collapsed .rd-sbuser{justify-content:center} .sb-rule{height:1px;background:var(--hairline);margin:8px 6px;width:auto} .sb-collapsed .sb-rule{display:block} .sb-toggle{position:absolute;top:18px;right:-13px;width:26px;height:26px;background:#fff;border:1px solid var(--border);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;box-shadow:var(--sh-xs);color:var(--ink-3);padding:0} .sb-toggle svg{width:13px;height:13px} .brandmark{display:inline-block;font-weight:800;letter-spacing:-.02em;line-height:1;white-space:nowrap} @media (max-width:768px){ /* app.css forces the overlay on at this width because the old app only rendered it while the menu was open. Here it is always in the page, so keep it hidden until the menu opens, or it would cover every screen. */ .sidebar-overlay:not(.show){display:none!important} .sb-toggle{display:none} } /* ── Avatar: photo layered over initials, so a failed load shows initials ── */ .ava{position:relative;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;color:#fff;font-weight:700;flex-shrink:0;overflow:hidden;line-height:1} .ava img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover} /* ── Top-bar popovers ── */ .pop-scrim{position:fixed;inset:0;z-index:900} .pop{position:absolute;top:calc(100% + 8px);right:0;z-index:901;background:#fff;border:1px solid #e5e5e3;border-radius:12px;box-shadow:0 12px 36px rgba(15,35,60,.14);width:240px;overflow:hidden} .pop-wide{width:320px} .pop-head{padding:12px 16px;border-bottom:1px solid #f0f0ee;font-size:13px;font-weight:700;color:#1E3A5F} .pop-item{display:block;width:100%;text-align:left;padding:10px 16px;background:#fff;border:none;border-bottom:1px solid #f6f6f4;font-size:12.5px;color:#475569;text-decoration:none;cursor:pointer;font-family:inherit} .pop-item:hover{background:#fafaf8} .pop-last{border-bottom:none} .pop-strong{color:#185FA5;font-weight:600} .pop-sub{font-size:11px;color:#94A3B8;font-weight:400} .pop-danger{color:#991B1B} .pop-danger:hover{background:#FEF2F2} .pop-empty{padding:20px;font-size:12px;color:#94A3B8;text-align:center} .pop-me{padding:14px 16px;border-bottom:1px solid #f0f0ee;display:flex;align-items:center;gap:10px} .pop-me-nm{font-size:13px;font-weight:700;color:#1E293B;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .pop-me-rl{font-size:11px;color:#94A3B8;text-transform:capitalize} /* ── Ctrl+K search ── */ .search-scrim[hidden]{display:none} .search-box{background:#fff;border-radius:16px;width:100%;max-width:560px;box-shadow:var(--sh-lg);overflow:hidden} .search-head{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--hairline);color:var(--ink-3)} .search-head input{flex:1;border:none;outline:none;font-size:15px;color:var(--ink);background:none;font-family:inherit} .search-head kbd{font-size:11px;color:var(--ink-3);background:var(--surface-3);padding:2px 6px;border-radius:5px;border:1px solid var(--border);cursor:pointer;font-family:'IBM Plex Mono',monospace} .search-note{padding:24px;text-align:center;color:var(--ink-3);font-size:13px} /* ── Page furniture ── */ .page-title{font-size:22px;font-weight:700;color:var(--ink);margin:0 0 18px} .placeholder-card{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--border);border-radius:12px;padding:18px 20px;color:var(--ink-3)} .placeholder-card svg{flex-shrink:0;margin-top:2px} .flash-wrap{padding:16px 28px 0} .flash{padding:10px 14px;border-radius:8px;font-size:13px;border:1px solid #86EFAC;background:#DCFCE7;color:#166534} .flash.error{border-color:#FCA5A5;background:#FEE2E2;color:#991B1B} /* ── Sign-in screens (the old app's inline styles, as classes) ── */ .auth-bg{min-height:100vh;background:linear-gradient(135deg,#1E3A5F 0%,#185FA5 100%);display:flex;align-items:center;justify-content:center;padding:20px} .auth-card{background:#fff;border-radius:16px;padding:40px;width:100%;max-width:420px;box-shadow:0 20px 60px rgba(0,0,0,.3)} .auth-sub{font-size:13px;color:#888;margin-top:10px} .auth-lbl{display:block;font-size:11px;font-weight:600;color:#555;margin-bottom:4px;text-transform:uppercase;letter-spacing:.06em} .auth-inp{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:8px;font-size:14px;color:#1a1a1a;background:#fafaf8;outline:none;font-family:inherit} .auth-inp:focus{border-color:#185FA5;background:#fff} .auth-btn{width:100%;padding:11px;background:#1E3A5F;color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;font-family:inherit} .auth-btn:hover{background:#16304f} .auth-link{font-size:12.5px;color:#185FA5;text-decoration:none;font-weight:600} .auth-foot{text-align:center;font-size:12px;color:#94A3B8;margin-top:18px} .auth-msg{padding:10px 14px;border-radius:8px;margin-bottom:16px;font-size:13px;border:1px solid #86EFAC;background:#DCFCE7;color:#166534} .auth-msg.err{border-color:#FCA5A5;background:#FEE2E2;color:#991B1B} /* ── Password policy checklist ── */ .pw-check{background:#F8FAFC;border:1px solid #E2E8F0;border-radius:8px;padding:10px 12px;margin-bottom:16px} .pw-rule{display:flex;align-items:center;gap:7px;font-size:11.5px;color:#94A3B8;padding:2px 0} .pw-dot{width:10px;height:10px;border-radius:50%;border:2px solid #CBD5E1;flex-shrink:0} .pw-rule.ok{color:#16A34A} .pw-rule.ok .pw-dot{border-color:#16A34A;background:#16A34A} /* ══ Phase 2: projects list, project page, tasks page ══ */ .dot{display:inline-block;width:7px;height:7px;border-radius:50%;flex-shrink:0} .badge{padding:2px 8px;border-radius:20px;font-size:10px;font-weight:700;white-space:nowrap} .badge.sq{border-radius:4px} .pbar{height:4px;background:#f0f0ee;border-radius:4px;overflow:hidden} .pbar>div{height:100%;background:#185FA5;border-radius:4px;transition:width .3s} .empty-card{text-align:center;padding:80px 20px;background:#fff;border-radius:12px;border:1px solid #e5e5e3} /* Dashboard */ .dash-stats{background:#fff;border-bottom:1px solid #e5e5e3;padding:16px 24px;display:flex;overflow-x:auto} .dash-stat{flex:1} .dash-k{font-size:11px;font-weight:700;color:#aaa;text-transform:uppercase;letter-spacing:.07em;margin-bottom:6px} .dash-v{font-size:28px;font-weight:700;color:#1E3A5F;margin-bottom:6px} .dash-bar{height:6px;border-radius:4px;background:#f0f0ee;overflow:hidden;margin-bottom:8px;display:flex} .chip{display:flex;align-items:center;gap:5px;padding:3px 9px;border-radius:20px;border:1px solid #e5e5e3;background:#fff;color:#555;font-size:11px;font-weight:500;text-decoration:none} .chip.on{border-color:var(--c);background:color-mix(in srgb,var(--c) 10%,#fff);font-weight:700} .health-row{display:flex;align-items:center;gap:8px;margin-bottom:4px;padding:2px 6px;border-radius:6px;border:1px solid transparent;text-decoration:none} .health-row.on{border-color:var(--c);background:color-mix(in srgb,var(--c) 8%,#fff)} .dash-toolbar{padding:12px 24px;display:flex;align-items:center;gap:8px;border-bottom:1px solid #e5e5e3;background:#fff;flex-wrap:wrap} .btn-new{padding:8px 16px;background:#CC0000;color:#fff;border-radius:7px;font-size:13px;font-weight:600;white-space:nowrap;text-decoration:none} .btn-new:hover{background:#b30000} .dash-search{display:flex;align-items:center;gap:6px;background:#f5f5f3;border-radius:7px;padding:6px 10px;flex:1;max-width:300px;margin:0} .dash-search input{border:none;background:none;outline:none;font-size:13px;color:#333;width:100%;font-family:inherit} .showing{display:flex;align-items:center;gap:6px;padding:5px 11px;border-radius:20px;border:1px solid #BFDBFE;background:#EFF6FF;color:#185FA5;font-size:12px;font-weight:600;white-space:nowrap;text-decoration:none} .seg{display:flex;gap:4px;background:#f5f5f3;border-radius:7px;padding:3px} .seg a{padding:5px 10px;border-radius:5px;font-size:12px;font-weight:600;color:#888;text-decoration:none} .seg a.on{background:#fff;color:#185FA5;box-shadow:0 1px 3px rgba(0,0,0,.1)} .seg.small{gap:2px;background:#f4f4f2;padding:2px} .seg.small a{padding:4px 12px} .seg.small a.on{color:#1E3A5F} .proj-card{background:#fff;border-radius:12px;border:1px solid #e5e5e3;padding:18px;transition:box-shadow .15s;position:relative} .proj-card:hover{box-shadow:0 4px 16px rgba(0,0,0,.08)} .dtable{width:100%;border-collapse:collapse} .dtable th{padding:10px 12px;text-align:left;font-size:11px;font-weight:700;color:#aaa;text-transform:uppercase;letter-spacing:.07em;border-bottom:1px solid #f0f0ee;white-space:nowrap;background:#fafaf8} .dtable th a{color:inherit;text-decoration:none} .dtable th a.on{color:#185FA5} .dtable td{padding:12px} .dtable tbody tr{border-bottom:1px solid #f5f5f3} .dtable tbody tr:last-child{border-bottom:none} .dtable tbody tr:hover{background:#fafaf9} .kanban{display:grid;gap:12px;align-items:start;overflow-x:auto} .kcol{background:#f4f4f2;border-radius:12px;border:1px solid #e8e8e5;padding:10px;min-height:140px;transition:background .15s,border-color .15s} .kcol.over{background:#EFF6FF;border-color:#BFDBFE} .kcount{font-size:11px;font-weight:700;color:#94A3B8;background:#fff;border-radius:10px;padding:1px 8px} .kcard{display:block;background:#fff;border-radius:10px;border:1px solid #e5e5e3;border-left:3px solid;padding:11px 12px;cursor:pointer;text-decoration:none;transition:box-shadow .15s,opacity .15s} .kcard:hover{box-shadow:0 4px 14px rgba(15,35,60,.10)} .kcard.dragging{opacity:.4} .kempty{padding:20px 8px;text-align:center;font-size:11.5px;color:#B0B7C3} /* Row / group menus:
so they open without JS */ .rowmenu{position:relative;display:inline-block} .rowmenu>summary{list-style:none;width:26px;height:26px;border-radius:6px;border:1px solid #e5e5e3;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;color:#888;font-weight:700} .rowmenu>summary::-webkit-details-marker{display:none} .phase-head .rowmenu>summary,.ms-head .rowmenu>summary{border:none;background:none;color:#bbb;font-size:16px} .rowmenu-list{position:absolute;right:0;top:30px;background:#fff;border-radius:10px;border:1px solid #e5e5e3;box-shadow:0 8px 24px rgba(0,0,0,.12);z-index:300;min-width:176px;overflow:hidden} .rowmenu-list form{margin:0} .rm-item{width:100%;padding:9px 14px;background:none;border:none;cursor:pointer;text-align:left;font-size:13px;display:flex;align-items:center;gap:8px;color:#333;text-decoration:none;font-family:inherit;font-weight:400;text-transform:none;letter-spacing:0} .rm-item:hover{background:#f5f5f3} .rm-item svg{width:13px;height:13px;flex-shrink:0} .rm-div{border-bottom:1px solid #f0f0ee} .rm-div-top{border-top:1px solid #f5f5f3} .rm-danger{color:#991B1B} .rm-danger:hover{background:#FEF2F2} /* Dialogs */ .modal-scrim{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:999;display:flex;align-items:center;justify-content:center;padding:20px} .modal-scrim[hidden]{display:none} .modal-card{background:#fff;border-radius:14px;padding:28px;width:100%;max-width:520px;box-shadow:0 12px 48px rgba(0,0,0,.2);max-height:90vh;overflow-y:auto;margin:0} .modal-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#1E3A5F} .modal-help{font-size:12px;color:#888;margin:0 0 18px;line-height:1.5} .modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:8px} .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px} .fld.full{grid-column:1/-1} .lbl{display:block;font-size:11px;font-weight:600;color:#555;margin-bottom:4px;text-transform:uppercase;letter-spacing:.06em} .modal-card input:not([type=checkbox]):not([type=hidden]),.modal-card select{width:100%;padding:8px 10px;border:1px solid #ddd;border-radius:7px;font-size:13px;color:#1a1a1a;background:#fafaf8;outline:none;font-family:inherit} .modal-card input:focus,.modal-card select:focus{border-color:#185FA5;background:#fff} .fld.bad input,.fld.bad select{border-color:#FCA5A5;background:#FEF2F2} .fld-err,.form-err{font-size:11.5px;color:#991B1B;margin-top:4px} .form-err{padding:9px 12px;border-radius:8px;background:#FEE2E2;border:1px solid #FCA5A5;margin-bottom:14px} .btn-primary{padding:9px 20px;background:#1E3A5F;color:#fff;border:none;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;white-space:nowrap} .btn-primary:hover{background:#16304f} .btn-primary.sm,.btn-ghost-blue.sm{padding:6px 14px;font-size:12px;border-radius:7px} .btn-ghost{padding:9px 16px;border:1px solid #ddd;border-radius:8px;background:#fff;font-size:13px;cursor:pointer;color:#333;text-decoration:none;font-family:inherit} .btn-ghost-blue{background:#fff;color:#185FA5;border:1px solid #BFDBFE;font-weight:600;cursor:pointer;font-family:inherit;white-space:nowrap} .export-opt{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:9px;border:1px solid #e0e0de;background:#fff;cursor:pointer;text-align:left;text-decoration:none;font-family:inherit} .export-opt:hover{background:#fafaf8} .export-opt svg{width:16px;height:16px} .export-opt b{display:block;font-size:13px;font-weight:600;color:#1E3A5F} .export-opt small{display:block;font-size:11px;color:#888} #add-task:not(.phase) .mode-phase,#add-task.phase .mode-task{display:none} /* Project page */ .proj-page{min-height:100vh;background:#f3f4f6} .proj-head{background:#fff;border-bottom:1px solid #e5e5e3;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px} .backbtn svg{width:13px;height:13px} .abtn svg{width:12px;height:12px} .abtn .when-closed{display:inline-flex;align-items:center;gap:6px} .abtn .when-open,.all-open .abtn .when-closed{display:none} .all-open .abtn .when-open{display:inline-flex;align-items:center;gap:6px} .overall{display:flex;align-items:center;gap:8px;padding:5px 12px;background:#f5f5f3;border-radius:20px;margin-right:4px} .overall span{font-size:12px;font-weight:700;color:#185FA5} .proj-meta{background:#fff;border-bottom:1px solid #e5e5e3;padding:8px 24px;display:flex;gap:20px;align-items:center;flex-wrap:wrap} .proj-meta span{font-size:12px;color:#666} .bulkbar{background:#EFF6FF;border-bottom:1px solid #BFDBFE;padding:8px 24px;display:flex;gap:10px;align-items:center;flex-wrap:wrap} .bulk-title{font-size:11px;font-weight:700;color:#185FA5;text-transform:uppercase;letter-spacing:.06em} .bulk-sec{display:flex;align-items:center;gap:7px;background:#fff;border:1px solid #BFDBFE;border-radius:9px;padding:5px 10px;margin:0} .bulk-lbl{font-size:10px;font-weight:700;color:#185FA5;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap} .bulk-inp{font-size:12px;border:1px solid #ddd;border-radius:6px;padding:4px 7px;color:#333;background:#fafaf8;height:28px;font-family:inherit} .bulk-btns{display:flex;border-radius:6px;overflow:hidden;border:1px solid #BFDBFE} .bulk-btns button{font-size:11px;padding:5px 9px;cursor:pointer;font-weight:600;background:#fff;color:#185FA5;border:none;border-right:1px solid #BFDBFE;white-space:nowrap;font-family:inherit} .bulk-btns button:last-child{border-right:none} .bulk-btns button:hover{background:#EFF6FF} .stat-pills{background:#fff;border-bottom:1px solid #e5e5e3;padding:8px 24px;display:flex;gap:8px;flex-wrap:wrap;align-items:center} .stat-pills span{padding:4px 10px;border-radius:20px;font-size:11px;font-weight:600} .proj-body{display:flex;gap:20px;padding:20px 24px} .phase{margin-bottom:20px} .phase-head{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:#bbb;margin-bottom:7px;padding-left:3px;display:flex;align-items:center;gap:8px} .milestone-card{background:#fff;border-radius:10px;border:1px solid #e5e5e3;margin-bottom:5px} .milestone-card>summary{list-style:none} .milestone-card>summary::-webkit-details-marker{display:none} .ms-head{display:flex;align-items:center;gap:10px;padding:11px 14px;cursor:pointer;user-select:none;border-radius:10px} .milestone-card[open]>.ms-head{background:#fafaf8;border-radius:10px 10px 0 0} .ms-icon{width:28px;height:28px;border-radius:7px;background:#F1EFE8;color:#5F5E5A;display:flex;align-items:center;justify-content:center;flex-shrink:0} .ms-icon svg{width:14px;height:14px} .ms-prog{display:flex;gap:8px;align-items:center} .ms-head .chevron{font-size:14px;color:#ccc;transition:transform .2s} .milestone-card[open]>.ms-head .chevron{transform:rotate(180deg)} .milestone-tasks{border-top:1px solid #f0f0ee} .task-grid{display:grid;grid-template-columns:1fr 138px 126px 150px 80px 64px;gap:8px;align-items:center;padding:8px 14px 8px 42px} .task-grid.with-del{grid-template-columns:1fr 138px 126px 150px 80px 64px 28px} .task-grid-head{padding-top:6px;padding-bottom:6px;background:#fafaf8} .task-grid-head span{font-size:10px;color:#bbb;font-weight:700;text-transform:uppercase;letter-spacing:.07em} .task-row{border-bottom:1px solid #f5f5f3;background:#fff} .task-row:nth-child(odd){background:#fafafa} .task-row:last-child{border-bottom:none} .task-name{font-size:12px;color:#222;line-height:1.4} .tctl{width:100%;font-size:12px;border:1px solid #e5e5e3;border-radius:6px;padding:0 7px;height:28px;background:#fff;cursor:pointer;font-family:inherit;color:#333} .tctl:disabled{cursor:not-allowed;opacity:.75} .sel-arrow,.status-sel{appearance:none;padding-right:20px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23888' stroke-width='3' d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 6px center} .status-sel{font-size:11px;font-weight:700;border-radius:20px;padding-left:8px} .vis-btn,.cl-btn,.del-btn{height:28px;border-radius:6px;font-size:11px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:4px;font-family:inherit} .vis-btn{width:100%;border:1px solid #E5E7EB;background:#F9FAFB;color:#9CA3AF} .vis-btn.ext{border-color:#BAE6FD;background:#EFF6FF;color:#0369A1} .vis-btn svg,.cl-btn svg,.del-btn svg{width:12px;height:12px} .cl-btn{width:100%;border:1px solid #FDE68A;background:#FFFBEB;color:#92400E;font-weight:700} .cl-btn.done{border-color:#A7F3D0;background:#ECFDF5;color:#047857} .cl-btn.add{border:1px dashed #d5d5d3;background:#fff;color:#B0B7C3} .del-btn{width:28px;border:1px solid #FEE2E2;background:#FFF5F5;color:#DC2626;flex-shrink:0;padding:0} .activity{width:280px;flex-shrink:0} .activity[hidden]{display:none} .activity-card{background:#fff;border-radius:12px;border:1px solid #e5e5e3;padding:16px;position:sticky;top:80px;max-height:calc(100vh - 100px);overflow:hidden;display:flex;flex-direction:column} .cl-item{display:flex;align-items:flex-start;gap:10px;padding:9px 12px;border-radius:8px;background:#fafaf8;border:1px solid #eee;cursor:pointer} .cl-item input{width:15px;height:15px;margin-top:1px;cursor:pointer;accent-color:#16A34A} .cl-item span{font-size:12.5px;color:#333;line-height:1.45;flex:1} .cl-item.done{background:#F0FDF4;border-color:#BBF7D0} .cl-item.done span{color:#166534;text-decoration:line-through} .cl-done{margin-top:12px;padding:9px 12px;border-radius:8px;background:#ECFDF5;border:1px solid #A7F3D0;font-size:12px;color:#047857;font-weight:600} /* Client-safe print: hide internal tasks and anything left with none */ .print-external .task-row.internal,.print-external .milestone-card.internal-only,.print-external .phase.internal-only{display:none!important} /* Tasks page */ .filters{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px} .filters input,.filters select{padding:7px 11px;border:1px solid #e0e0de;border-radius:7px;font-size:12px;color:#444;background:#fff;font-family:inherit} .ttable{width:100%;border-collapse:collapse} .ttable th{padding:9px 12px;font-size:11px;font-weight:700;color:#888;text-transform:uppercase;letter-spacing:.06em;background:#fafaf8;border-bottom:1px solid #e8e8e5;text-align:left} .ttable td{padding:9px 12px;font-size:12px;color:#333;border-bottom:1px solid #f0f0ee;vertical-align:middle} .pill-sel{font-size:11px;font-weight:700;border-radius:20px;padding:3px 8px;border:1px solid color-mix(in srgb,var(--c) 35%,transparent);background:color-mix(in srgb,var(--c) 10%,#fff);color:var(--c);cursor:pointer;appearance:none;font-family:inherit} .pill-sel:disabled{cursor:not-allowed} /* ══ Phase 3: templates, checklists, forms ══ */ .btn-outline{padding:8px 14px;background:#fff;color:#1E3A5F;border:1px solid #d0d9e8;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;text-decoration:none;white-space:nowrap} .btn-outline:hover{background:#F4F6FA} label.btn-primary{cursor:pointer} .sm-btn{font-size:11px;padding:4px 10px;border:1px solid #ddd;border-radius:6px;background:#fff;cursor:pointer;color:#555;text-decoration:none;font-family:inherit;white-space:nowrap} .sm-btn.danger{border-color:#FCA5A5;background:#FEF2F2;color:#991B1B} .sm-btn.green{border-color:#A7F3D0;background:#ECFDF5;color:#047857;font-weight:600} .tag{font-size:11px;padding:1px 6px;border-radius:4px;font-weight:500;flex-shrink:0;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .tag.blue{background:#EFF6FF;color:#1D4ED8} .tag.red{background:#FEF2F2;color:#991B1B} .tag.green{background:#F0FDF4;color:#166534} .tag.amber{background:#FFFBEB;color:#92400E} .tag.sky{background:#F0F9FF;color:#0369A1} .tag.grey{background:#F9FAFB;color:#9CA3AF} .grip{cursor:grab;font-size:12px;color:#ccc;flex-shrink:0;line-height:1;user-select:none} .drop-over{box-shadow:inset 0 2px 0 #185FA5} .dragging{opacity:.4} .mini-inp{padding:5px 9px;border:1px solid #c5d1e0;border-radius:6px;font-size:13px;color:#1a1a1a;outline:none;background:#fff;min-width:0;flex:1;font-family:inherit} .mini-go{padding:5px 12px;background:#1E3A5F;color:#fff;border:none;border-radius:6px;font-size:12px;cursor:pointer;flex-shrink:0;font-family:inherit} .mini-x{padding:5px 8px;background:none;border:1px solid #ddd;border-radius:6px;font-size:12px;cursor:pointer;flex-shrink:0} .add-link{background:none;border:none;cursor:pointer;font-size:12px;color:#185FA5;font-weight:600;padding:4px 0;display:flex;align-items:center;gap:4px;font-family:inherit} .add-row{display:flex;gap:6px;align-items:center;padding:6px 18px;margin:0} .add-row[hidden],.inline-edit[hidden],.tp-task-edit[hidden]{display:none} .icon-btn{background:none;border:none;cursor:pointer;color:#bbb;font-size:13px;padding:2px 3px;flex-shrink:0} .icon-btn:hover{color:#185FA5} .icon-btn.del{font-size:15px;line-height:1;opacity:.7} .icon-btn.del:hover{color:#C5221C;opacity:1} .mini-del{width:24px;height:24px;border-radius:6px;border:1px solid #FEE2E2;background:#FFF5F5;color:#DC2626;cursor:pointer;font-size:13px;line-height:1;display:flex;align-items:center;justify-content:center} .warn-box{background:#FFF7ED;border:1px solid #FED7AA;border-radius:9px;padding:12px 14px;margin-bottom:14px;font-size:13px} /* Templates */ .lib-page{padding:24px;min-height:100vh;background:#f7f7f5} .lib-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:24px;gap:12px;flex-wrap:wrap} .lib-title{font-size:20px;font-weight:700;color:#1E3A5F;margin:0} .lib-sub{font-size:13px;color:#888;margin-top:4px} .tpl-card{background:#fff;border-radius:12px;border:1px solid #e5e5e3} .tpl-card.open{border-color:#185FA5;box-shadow:0 0 0 3px rgba(24,95,165,.07)} .tpl-head{display:flex;align-items:center;gap:10px;padding:14px 18px} .tpl-toggle{display:flex;align-items:center;gap:10px;flex:1;min-width:0;text-decoration:none} .tpl-caret{font-size:13px;color:#bbb;font-weight:700;width:12px;flex-shrink:0} .tpl-card.open .tpl-caret{color:#185FA5} .tpl-name{display:block;font-size:14px;font-weight:600;color:#1E3A5F} .tpl-meta{display:block;font-size:12px;color:#aaa;margin-top:1px} .cat-sel{font-size:11px;font-weight:600;padding:4px 8px;border:1px solid #e5e5e3;border-radius:6px;background:#fff;color:#94A3B8;cursor:pointer;flex-shrink:0;font-family:inherit} .cat-sel.set{border-color:#C7D9EC;background:#EFF6FF;color:#185FA5} .cat-tag{font-size:11px;font-weight:600;padding:3px 9px;border-radius:6px;background:#EFF6FF;color:#185FA5;flex-shrink:0} .cat-row{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;background:#fff;border:1px solid #e8e8e5} .cat-row:hover{border-color:#C7D9EC} .cat-count{font-size:10px;font-weight:700;color:#94A3B8;background:#F4F6FA;padding:2px 8px;border-radius:10px} .tpl-editor{border-top:1px solid #f0f0ee} .tp-phase{border-bottom:1px solid #f5f5f3} .tp-phase>summary,.tp-mile>summary{list-style:none} .tp-phase>summary::-webkit-details-marker,.tp-mile>summary::-webkit-details-marker{display:none} .tp-phase-row{display:flex;align-items:center;gap:8px;padding:10px 18px;background:#F4F6FA;cursor:pointer;user-select:none} .tp-caret{font-size:11px;color:#666;width:10px;flex-shrink:0;display:inline-block;transition:transform .15s} details:not([open])>summary .tp-caret{transform:rotate(-90deg)} .tp-phase-name{flex:1;font-size:12px;font-weight:700;color:#1E3A5F;text-transform:uppercase;letter-spacing:.05em} .tp-count{font-size:12px;color:#aaa} .tp-mile-row{display:flex;align-items:center;gap:8px;padding:9px 18px 9px 36px;cursor:pointer;background:#fff;user-select:none;border-top:1px solid #f0f0ee} .tp-mile-name{flex:1;font-size:13px;font-weight:600;color:#333} .tp-tasks{padding-bottom:6px} .tp-task-view{display:flex;align-items:center;gap:6px;padding:5px 18px 5px 56px} .tp-bullet{width:5px;height:5px;border-radius:50%;background:#9CA3AF;flex-shrink:0} .tp-task-name{flex:1;font-size:13px;color:#555} .tp-task-edit{display:flex;flex-wrap:wrap;gap:5px;padding:7px 18px 7px 56px;background:#F0F4FA;align-items:center;margin:0} .tp-task-edit .mini-inp{font-size:12px} .tp-empty{font-size:12px;color:#B0B7C3;padding:6px 18px 6px 56px} .add-phase{width:100%;padding:10px 18px;border-top:1px solid #f0f0ee;font-size:13px} .tpl-editor .rowmenu>summary{width:28px;height:28px;border-radius:7px;border:1px solid #e0e0de;font-size:17px} .preview-box{flex:1;overflow-y:auto;border:1px solid #eee;border-radius:9px;padding:14px;margin-bottom:16px;background:#fafaf8;font-size:13px;max-height:45vh} .pv-phase{font-weight:700;color:#1E3A5F;margin-bottom:7px;font-size:12px;text-transform:uppercase;letter-spacing:.05em} /* Checklists */ .cl-list{background:#fff;border-radius:10px;border:1px solid #e8e8e5;overflow:hidden} .cl-entry{border-bottom:1px solid #f0f0ee} .cl-entry:last-child{border-bottom:none} .cl-entry>summary{list-style:none} .cl-entry>summary::-webkit-details-marker{display:none} .cl-head{display:flex;align-items:center;gap:12px;padding:13px 18px;cursor:pointer;user-select:none} .cl-head:hover{background:#fcfcfa} .cl-entry[open]>.cl-head{background:#fafaf8} .cl-entry[open]>.cl-head .tp-caret{color:#185FA5} .cl-steps{border-top:1px solid #f0f0ee;background:#fcfcfb;padding:8px 18px 12px 42px} .cl-step{display:flex;align-items:center;gap:10px;padding:7px 12px;border-radius:7px;background:#fff;margin-bottom:5px;border:1px solid #eee} .step-list{display:flex;flex-direction:column;gap:5px;margin-bottom:8px;counter-reset:step} .step-row{display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:7px;background:#fafaf8;border:1px solid #eee} .step-row .step-n::before{counter-increment:step;content:counter(step) "."} .step-n{font-size:11px;color:#B0B7C3;min-width:16px} .step-text{font-size:12px;color:#333;flex:1} .step-row button{background:none;border:none;cursor:pointer;color:#94A3B8;font-size:12px;padding:0 2px} .step-row button:disabled{color:#e5e5e3;cursor:default} .step-row button.x{color:#DC2626;font-size:14px;line-height:1} /* Forms list */ .forms-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:16px;align-items:start} @media (max-width:900px){.forms-grid{grid-template-columns:1fr}} .col-title{font-size:12px;font-weight:700;color:#94A3B8;text-transform:uppercase;letter-spacing:.06em;margin-bottom:10px} .form-card{background:#fff;border-radius:10px;border:1px solid #e8e8e5;padding:14px 16px;margin-bottom:10px} .form-card.empty{padding:32px;text-align:center;color:#94A3B8;font-size:12.5px} .resp-row{position:relative;display:flex;align-items:center;gap:14px;padding:13px 16px;border-bottom:1px solid #f5f5f3;border-left:4px solid #185FA5} .resp-row:last-child{border-bottom:none} .resp-row.done{border-left-color:#22C55E} .resp-row:hover{background:#fafaf8} .row-link{position:absolute;inset:0;z-index:1} .above-link{position:relative;z-index:2} .resp-proj{font-size:14px;font-weight:800;color:#1E3A5F;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .purge{padding:3px 9px;border-radius:20px;font-size:10px;font-weight:700;background:#F1F5F9;color:#64748B;flex-shrink:0;white-space:nowrap} .purge.soon{background:#FEE2E2;color:#991B1B} .check-card{display:flex;align-items:flex-start;gap:9px;padding:10px 12px;border-radius:8px;background:#fafaf8;border:1px solid #eee;cursor:pointer} .check-card input{margin-top:2px;accent-color:#185FA5} .check-card b{display:block;font-size:12.5px;font-weight:600;color:#334155} .check-card small{display:block;font-size:11px;color:#94A3B8;margin-top:1px} /* Form builder */ .builder{display:flex;min-height:calc(100vh - 64px);background:#f8f7f5;margin:0} .builder-canvas{flex:1;padding:20px 28px;overflow-y:auto} .builder-name{width:100%;max-width:480px;padding:8px 11px;border:1px solid #ddd;border-radius:7px;font-size:15px;font-weight:700;color:#1E3A5F;background:#fff;outline:none;font-family:inherit} .builder-empty{background:#fff;border-radius:10px;border:1px solid #e8e8e5;padding:48px;text-align:center;color:#94A3B8;font-size:13px} .q-list{max-width:720px} .q-card{background:#fff;border-radius:10px;border:1px solid #e8e8e5;padding:16px 18px;margin-bottom:10px;display:flex;gap:12px;transition:opacity .15s} .q-side{display:flex;flex-direction:column;gap:6px;align-items:center;padding-top:4px} .q-grip{font-size:17px;color:#94A3B8;padding:3px 4px;border-radius:5px} .q-num{font-size:10px;font-weight:800;color:#B0B7C3} .q-mini{background:none;border:none;cursor:pointer;color:#B0B7C3;font-size:13px;line-height:1;padding:1px} .q-mini.del{color:#DC2626} .q-type{font-size:10px;font-weight:700;padding:2px 8px;border-radius:5px;background:#EFF6FF;color:#185FA5;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap} .q-req{display:flex;align-items:center;gap:5px;font-size:11px;color:#64748B;cursor:pointer;margin-left:auto} .q-req input{accent-color:#185FA5} .q-title,.q-desc,.q-opt input{width:100%;padding:8px 11px;border:1px solid #ddd;border-radius:7px;font-size:13px;color:#1a1a1a;background:#fff;outline:none;font-family:inherit} .q-title{font-weight:600;margin-bottom:6px} .q-desc{font-size:12px;color:#64748B} .q-opts{margin-top:10px} .q-opt{display:flex;align-items:center;gap:8px;margin-bottom:5px} .q-opt::before{content:"";width:12px;height:12px;border-radius:50%;border:2px solid #d5d5d3;flex-shrink:0} .q-opt input{padding:5px 9px;font-size:12px} .q-opt button{background:none;border:none;cursor:pointer;color:#94A3B8;font-size:12px;font-family:inherit} .q-yn{display:flex;gap:5px;margin-top:10px} .q-yn[hidden],.q-opts[hidden]{display:none} .q-yn span{padding:3px 14px;border-radius:6px;font-size:11px;font-weight:700;border:1px solid #e0e0de;color:#B0B7C3} .palette{width:280px;flex-shrink:0;background:#fff;border-left:1px solid #e5e5e3;padding:18px;overflow-y:auto} .pal-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid #eee;border-radius:8px;margin-bottom:6px} .pal-add{padding:4px 10px;border:1px solid #BFDBFE;border-radius:6px;background:#EFF6FF;color:#185FA5;font-size:11px;font-weight:700;cursor:pointer;white-space:nowrap;font-family:inherit} @media (max-width:900px){.builder{flex-direction:column}.palette{width:auto;border-left:none;border-top:1px solid #e5e5e3}} /* Form fill */ .fill-page{margin:0} .project-banner{padding:16px 22px;margin-bottom:14px;border-left:4px solid #185FA5;display:flex;align-items:center;gap:16px;flex-wrap:wrap} .kicker{font-size:10px;font-weight:700;color:#94A3B8;text-transform:uppercase;letter-spacing:.09em} .fill-body{padding:22px 30px 26px;margin:0;min-width:0} .sec-band{display:flex;align-items:center;gap:10px;margin:0 0 14px} .sec-band span{font-size:11.5px;font-weight:800;color:#fff;background:#1E3A5F;padding:4px 12px;border-radius:6px;text-transform:uppercase;letter-spacing:.08em;white-space:nowrap} .sec-band i{flex:1;height:1px;background:#e8ecf2} .fill-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:0 26px;align-items:start} .fill-q{margin-bottom:16px} .fill-q.wide{grid-column:1/-1} .fill-label{display:block;font-size:13px;font-weight:600;color:#333;margin-bottom:3px} .fill-desc{font-size:11.5px;color:#94A3B8;margin-bottom:6px} .fill-q input:not([type=radio]),.fill-q textarea{width:100%;padding:8px 11px;border:1px solid #ddd;border-radius:7px;font-size:13px;color:#1a1a1a;background:#fafaf8;outline:none;font-family:inherit} .fill-q textarea{resize:vertical;line-height:1.5} .fill-body:disabled input,.fill-body:disabled textarea{cursor:not-allowed} .yn{display:flex;gap:5px} .yn label{cursor:pointer} .yn input{position:absolute;opacity:0;pointer-events:none} .yn span{display:inline-block;padding:4px 16px;border-radius:6px;font-size:12px;font-weight:700;border:1px solid #e0e0de;background:#fff;color:#94A3B8} .yn-1 input:checked+span{background:#16A34A;border-color:#16A34A;color:#fff} .yn-2 input:checked+span{background:#DC2626;border-color:#DC2626;color:#fff} .yn-3 input:checked+span{background:#6B7280;border-color:#6B7280;color:#fff} .yn input:focus-visible+span{outline:2px solid #185FA5;outline-offset:1px} .choice{display:flex;align-items:center;gap:9px;padding:7px 11px;border-radius:8px;border:1px solid #eee;background:#fff;cursor:pointer;font-size:12.5px;color:#444} .choice input{accent-color:#185FA5} .choice:has(input:checked){border-color:#BFDBFE;background:#EFF6FF;color:#185FA5;font-weight:600} /* Printed handover document (print-only; see app.css print rules) */ .pf-doc{font-family:Calibri,"Segoe UI",Arial,sans-serif;color:#111} .pf-mast{display:flex;align-items:flex-end;justify-content:space-between;border-bottom:2.5px solid #1F3864;padding-bottom:8pt;margin-bottom:4pt} .pf-mast-title{font-size:13pt;font-weight:700;color:#1F3864;letter-spacing:.05em;line-height:1.15} .pf-mast-sub{font-size:8pt;color:#7A879B;letter-spacing:.12em;text-transform:uppercase;margin-top:2pt} .pf-ident{width:100%;border-collapse:collapse;margin-bottom:14pt} .pf-ident td{border:none;vertical-align:top} .pf-k{font-size:7.5pt;color:#7A879B;letter-spacing:.11em;text-transform:uppercase} .pf-k2{font-size:8pt;color:#7A879B;letter-spacing:.06em;text-transform:uppercase} .pf-v{font-size:11.5pt;font-weight:700;color:#1F3864;border-bottom:1px solid #B4C6E7;padding-bottom:3pt} .pf-sec{margin-bottom:11pt} .pf-table{width:100%;border-collapse:collapse} .pf-band{background:#1F3864;color:#fff;font-size:9.5pt;font-weight:700;letter-spacing:.09em;text-transform:uppercase;padding:6px 10px;border:1px solid #1F3864} .pf-meta{font-size:9.5pt;color:#333;padding:6px 10px;border:1px solid #B4C6E7;border-top:none;background:#EDF2FA} .pf-meta.strong,.pf-td.strong{font-weight:700;color:#1F3864} .pf-th{color:#5A6B85;font-size:8pt;font-weight:700;letter-spacing:.09em;text-transform:uppercase;padding:5px 10px;border:1px solid #B4C6E7;border-top:none;text-align:left} .pf-td{font-size:10pt;color:#111;padding:7px 10px;border:1px solid #B4C6E7;border-top:none;vertical-align:middle;line-height:1.35} .pf-td strong{color:#1F3864} .pf-yn{font-size:9.5pt;display:inline-flex;align-items:center} .pf-yn span{white-space:nowrap;margin-right:14px;color:#94A0B4} .pf-yn span.on{color:#1F3864;font-weight:700} .pf-yn i{display:inline-block;width:11pt;height:11pt;border:1.2px solid #9AA7BC;border-radius:2px;background:#fff;color:#fff;margin-right:5px;vertical-align:-2px;text-align:center;line-height:10.5pt;font-size:8pt;font-weight:700;font-style:normal} .pf-yn span.on i{border-color:#1F3864;background:#1F3864} .pf-desc{font-size:8pt;font-style:italic;color:#7A879B;padding:4px 10px;border:1px solid #B4C6E7;border-top:none;background:#EDF2FA} .pf-long{font-size:10pt;padding:9px 10px;border:1px solid #B4C6E7;border-top:none;min-height:46pt;white-space:pre-wrap;line-height:1.55} .pf-sign{vertical-align:top;padding-top:9px} .pf-signame{font-size:11pt;font-weight:700;color:#1F3864;margin-top:3pt} .pf-line{border-bottom:1px solid #9AA7BC;margin-top:30pt} .pf-foot{margin-top:14pt;padding-top:6pt;border-top:1px solid #B4C6E7;font-size:7.5pt;color:#9AA7BC;display:flex;justify-content:space-between} /* ══ Phase 4: dashboard, calendar, archive, reports ══ */ .clear-btn{padding:7px 11px;border-radius:7px;font-size:12px;color:#185FA5;font-weight:600;border:1px solid #BFDBFE;background:#EFF6FF;text-decoration:none} .plain{color:inherit;text-decoration:none} .row-click,[data-href]{cursor:pointer} .row-click:hover td{background:#fafaf8} .proj-chip{font-size:11px;background:#F3F4F6;padding:3px 8px;border-radius:5px;color:#555;text-decoration:none} .proj-chip:hover{background:#E5E7EB} .chip-wrap{display:flex;flex-wrap:wrap;gap:4px;margin-left:140px} /* Dashboard */ .kpi-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-bottom:14px} @media (max-width:1200px){.kpi-grid{grid-template-columns:repeat(3,1fr)}} .an-card{background:#fff;border-radius:10px;border:1px solid #e8e8e5} .kpi{padding:14px 16px;cursor:default} .an-k{font-size:10px;font-weight:700;color:#94A3B8;text-transform:uppercase;letter-spacing:.06em} .kpi-v{font-size:24px;font-weight:800;color:#1E293B;line-height:1;margin-bottom:4px} .an-row3{display:grid;grid-template-columns:1.2fr 1.2fr .8fr;gap:12px;margin-bottom:14px} .an-row2{display:grid;grid-template-columns:.9fr 2.1fr;gap:12px} @media (max-width:1100px){.an-row3,.an-row2{grid-template-columns:1fr}} .an-col{overflow:hidden;display:flex;flex-direction:column} .an-head{padding:12px 16px;border-bottom:1px solid #f0f0ee;display:flex;align-items:center;gap:8px} .an-title{font-size:13px;font-weight:700;color:#1E3A5F;cursor:default} .an-scroll{flex:1;max-height:300px;overflow-y:auto} .an-line{display:flex;align-items:center;gap:10px;padding:8px 16px;border-bottom:1px solid #f6f6f4;text-decoration:none} .an-line:hover{background:#fafaf8} .an-name{font-size:12px;font-weight:600;color:#1E293B;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .an-sub{font-size:10.5px;color:#94A3B8} .an-empty{padding:28px;text-align:center;color:#B0B7C3;font-size:12px} .an-bar{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:11px;color:#64748B} .an-track{flex:1;height:6px;background:#f0f0ee;border-radius:3px;overflow:hidden} .an-track>div{height:100%} .an-activity{display:grid;grid-template-columns:1fr 1fr;max-height:240px;overflow-y:auto} .an-act{display:flex;gap:9px;padding:8px 16px;border-bottom:1px solid #f6f6f4} /* Calendar */ .cal-top{display:flex;align-items:center;gap:12px;margin:0 0 16px;flex-wrap:wrap} .cal-top .filters{margin:0} .cal-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:start} @media (max-width:1000px){.cal-layout{grid-template-columns:1fr}} .cal-card{background:#fff;border:1px solid #e5e5e3;border-radius:12px;overflow:hidden} .cal-side{position:sticky;top:80px} .cal-head{display:flex;align-items:center;gap:10px;padding:13px 16px;border-bottom:1px solid #f0f0ee} .month-pick{position:relative} .month-pick input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%} .month-label{display:inline-block;padding:5px 12px;border:1px solid #CBD5E1;border-radius:8px;font-size:13px;font-weight:700;color:#1E3A5F;background:#fff;min-width:140px;text-align:center} .month-pick:hover .month-label{border-color:#185FA5;color:#185FA5} .cal-dow{display:grid;grid-template-columns:repeat(7,1fr);border-bottom:1px solid #f0f0ee} .cal-dow div{padding:7px 10px;font-size:10px;font-weight:700;color:#94A3B8;text-transform:uppercase;letter-spacing:.08em;text-align:center} .cal-grid{display:grid;grid-template-columns:repeat(7,1fr)} .cal-day{min-height:104px;padding:6px 7px;border-right:1px solid #f4f6f8;border-bottom:1px solid #f4f6f8;background:#fff;transition:background .12s;min-width:0} .cal-day:nth-child(7n){border-right:none} .cal-day.wknd{background:#fdfdfc} .cal-day.out{background:#fcfcfb} .cal-day.sel{background:#EFF6FF} .cal-day:not(.has){cursor:default} .cal-num{font-size:11.5px;font-weight:600;color:#334155;border-radius:50%;width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center} .cal-day.out .cal-num{color:#CBD5E1} .cal-num.today{background:#1E3A5F;color:#fff;font-weight:800} .cal-item{display:flex;align-items:center;gap:5px;padding:2px 5px;margin-bottom:2px;border-radius:4px;border-left:2.5px solid;overflow:hidden;text-decoration:none} .cal-name{font-size:10.5px;font-weight:600;color:#1E293B;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .cal-row{display:block;padding:11px 16px;border-bottom:1px solid #f5f6f8;border-left:3px solid;text-decoration:none} .cal-row:hover{background:#fafaf8} /* Reports */ .rep-layout{display:flex;min-height:calc(100vh - 64px);background:#f8f7f5} .rep-nav{width:200px;flex-shrink:0;background:#fff;border-right:1px solid #e5e5e3;padding:16px 0} .rep-nav-title{padding:0 16px 12px;font-size:11px;font-weight:700;color:#aaa;text-transform:uppercase;letter-spacing:.07em} .rep-link{display:flex;align-items:center;gap:9px;padding:9px 16px;color:#555;font-size:13px;text-decoration:none;border-right:3px solid transparent} .rep-link svg{width:14px;height:14px;color:#94A3B8} .rep-link:hover{background:#fafaf8} .rep-link.on{background:#EFF6FF;color:#185FA5;font-weight:700;border-right-color:#185FA5} .rep-link.on svg{color:#185FA5} .rep-main{flex:1;overflow:auto;padding:24px;min-width:0} .rep-actions{display:flex;justify-content:flex-end;gap:8px;margin-bottom:-40px;position:relative;z-index:5} .rep-cards{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px} .rep-card{background:#fff;border:1px solid #e5e5e3;border-radius:10px;padding:12px 18px;min-width:120px;border-top:3px solid} .rep-k{font-size:10px;color:#aaa;font-weight:700;text-transform:uppercase} .rep-v{font-size:22px;font-weight:800} .rep-table,.rep-box{background:#fff;border:1px solid #e5e5e3;border-radius:10px;overflow:hidden} .rep-box-head{padding:12px 16px;background:#fafaf8;border-bottom:1px solid #e5e5e3;font-size:13px;font-weight:700;color:#1E3A5F} .rep-none{text-align:center;color:#aaa;padding:32px!important} .rep-count{margin-top:8px;font-size:11px;color:#aaa;text-align:right} .wl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;margin-bottom:16px} .inst-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:20px} .insight-filters{padding:12px 16px;margin:0 0 14px;display:flex;flex-direction:column;gap:10px;overflow:visible} .chip-row{display:flex;gap:6px;flex-wrap:wrap;align-items:center} .chip-lbl{font-size:10.5px;font-weight:700;color:#94A3B8;text-transform:uppercase;letter-spacing:.05em;min-width:70px} .tog{padding:4px 12px;border-radius:20px;font-size:11.5px;font-weight:600;cursor:pointer;border:1px solid #e0e0de;background:#fff;color:#64748B;--c:#185FA5} .tog input{position:absolute;opacity:0;pointer-events:none} .tog.on{border-color:var(--c);background:var(--c);color:#fff} .tog:has(input:focus-visible){outline:2px solid #185FA5;outline-offset:1px} .insight-summary{background:#EFF6FF;border:1px solid #BFDBFE;border-radius:10px;padding:13px 16px;margin-bottom:14px;font-size:13px;color:#1E3A5F;line-height:1.6} .insight-grid{display:grid;grid-template-columns:320px 1fr;gap:14px;margin-bottom:14px;align-items:stretch} @media (max-width:1000px){.insight-grid{grid-template-columns:1fr}} .legend-row{display:flex;align-items:center;gap:7px;font-size:11.5px;color:#475569} .legend-row span{width:9px;height:9px;border-radius:3px;flex-shrink:0} .legend-row b{flex:1;font-weight:400} .legend-row i{color:#B0B7C3;width:34px;text-align:right;font-style:normal} @media print{.rep-layout{display:block;background:#fff}.rep-main{padding:0}.row-click td{background:none}} /* ── Administration, Settings, Help (phase 5) ── */ .rd-scrim[hidden]{display:none} .rd-modal{text-align:left} .rd-sortable a{color:inherit;text-decoration:none} .role-chips label{background:var(--bg);color:var(--fg);border-color:var(--fg)} .role-chips input,.swatch-radio input,.opt-swatches input,.preset input{position:absolute;opacity:0;pointer-events:none} .role-chips label:has(input:checked){background:var(--fg);color:#fff} .swatch-radio{position:relative;display:inline-block} .swatch-radio:has(input:checked){transform:scale(1.08);box-shadow:0 0 0 2px currentColor} .plain-tbl{background:#fff;border:1px solid #e8e8e5;border-radius:10px;overflow:auto} .plain-tbl table{width:100%;border-collapse:collapse} .plain-tbl th{padding:9px 14px;font-size:11px;font-weight:700;color:#888;text-transform:uppercase;letter-spacing:.06em;background:#fafaf8;border-bottom:1px solid #e8e8e5;text-align:left;white-space:nowrap} .plain-tbl td{padding:11px 14px;font-size:12.5px;color:#333;border-bottom:1px solid #f2f4f7;vertical-align:middle} .plain-tbl tr:last-child td{border-bottom:none} .mini-tag{margin-left:7px;font-size:9.5px;font-weight:700;padding:2px 7px;border-radius:5px;background:#F1EFE8;color:#5F5E5A} .type-tag{font-size:10.5px;font-weight:700;padding:2px 9px;border-radius:5px;background:#F1EFE8;color:#5F5E5A} .type-tag.t-dropdown{background:#EFF6FF;color:#1D4ED8}.type-tag.t-date{background:#FEF3C7;color:#92400E}.type-tag.t-boolean{background:#DCFCE7;color:#166534} .req-tag{font-size:10.5px;font-weight:700;padding:2px 9px;border-radius:5px;background:#FEE2E2;color:#991B1B} .muted{font-size:11.5px;color:#B0B7C3} .opt-wrap{display:flex;gap:4px;flex-wrap:wrap} .opt-pill{font-size:10.5px;font-weight:600;padding:2px 8px;border-radius:20px} .opt-row{display:flex;align-items:center;justify-content:space-between;padding:6px 10px;border-radius:7px;border:1px solid #eee;margin:0} .opt-row span{font-size:12px;font-weight:600} .opt-row button{background:none;border:none;cursor:pointer;color:#999;font-size:16px;line-height:1} .opt-add{display:flex;gap:8px;align-items:center;margin:0} .opt-add input[name=option]{flex:1} .opt-swatches{display:flex;gap:4px} .opt-swatches label{position:relative;width:20px;height:20px;border-radius:50%;border:2px solid transparent;cursor:pointer;flex-shrink:0;margin:0} .opt-swatches label:has(input:checked){border-color:var(--fg)} .btn-primary.sm{padding:7px 12px;font-size:12px} .check-line{display:flex;align-items:center;gap:8px;font-size:13px;color:#555;margin:14px 0 4px;cursor:pointer;text-transform:none;letter-spacing:0;font-weight:400} .check-line input{width:16px;height:16px} .set-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start} .set-card{background:#fff;border:1px solid #e5e5e3;border-radius:12px;padding:20px 22px;margin-bottom:14px} .set-cols .set-card{margin-bottom:0} .set-card h2{font-size:14px;font-weight:700;color:#1E3A5F;margin:0 0 4px} .set-card>p{font-size:12px;color:#94A3B8;margin:0 0 16px} .set-card input:not([type=checkbox]):not([type=radio]):not([type=file]),.set-card select{width:100%} .set-card input:disabled{color:#94A3B8;cursor:not-allowed} .set-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px} .set-hint{font-size:10.5px;color:#B0B7C3;margin-top:4px} .field-err{font-size:11px;color:#DC2626;margin-top:4px} .preset-row{display:flex;gap:6px;flex-wrap:wrap} .preset{position:relative;padding:6px 14px;border-radius:20px;font-size:12px;font-weight:600;cursor:pointer;border:1px solid #e0e0de;background:#fff;color:#64748B;text-transform:none;letter-spacing:0;margin:0} .preset:has(input:checked){border-color:#185FA5;background:#185FA5;color:#fff} .btn-soft{padding:9px 18px;border:1px solid #BFDBFE;border-radius:8px;background:#EFF6FF;color:#185FA5;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit} .upload-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border:1px solid #d0d9e8;border-radius:7px;background:#fff;color:#1E3A5F;font-size:12px;font-weight:600;cursor:pointer;width:fit-content;text-transform:none;letter-spacing:0;margin:0} .link-btn{background:none;border:none;color:#94A3B8;font-size:11px;cursor:pointer;text-align:left;padding:0;font-family:inherit} .btn-outline-danger{padding:9px 18px;border:1px solid #FCA5A5;border-radius:8px;background:#fff;color:#991B1B;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit} @media(max-width:900px){.set-cols,.set-grid{grid-template-columns:1fr!important}} .help-page{display:flex;min-height:calc(100vh - 60px);background:#f8f7f5} .help-nav{width:250px;flex-shrink:0;background:#fff;border-right:1px solid #e5e5e3;padding:18px 0;position:sticky;top:0;align-self:flex-start;max-height:100vh;overflow-y:auto} .help-search{padding:0 16px 12px;margin:0} .help-eyebrow{font-size:11px;font-weight:700;color:#94A3B8;text-transform:uppercase;letter-spacing:.08em;margin-bottom:9px} .help-search input{width:100%;padding:7px 10px;font-size:12px} .help-nav>a{display:block;padding:9px 16px;color:#475569;font-size:13px;font-weight:500;text-decoration:none;border-right:3px solid transparent} .help-nav>a:hover{background:#fafaf8} .help-nav>a.on{background:#EFF6FF;color:#185FA5;font-weight:700;border-right-color:#185FA5} .help-stuck{margin:16px 16px 0;padding:12px;border-radius:9px;background:#fafaf8;border:1px solid #eee;font-size:11.5px;line-height:1.7} .help-stuck b{display:block;font-size:11px;color:#1E3A5F;margin-bottom:6px} .help-stuck a{display:block;color:#185FA5;text-decoration:none} .help-main{flex:1;min-width:0;padding:26px 32px;max-width:900px} .help-main h1{font-size:22px;font-weight:800;color:#1E3A5F;margin:0 0 5px} .help-blurb{font-size:13.5px;color:#94A3B8;margin:0 0 20px;line-height:1.6} .help-card{background:#fff;border:1px solid #e5e5e3;border-radius:12px;padding:24px 26px} .help-p{font-size:13.5px;color:#475569;line-height:1.7;margin:0 0 16px} .help-note{background:#EFF6FF;border:1px solid #BFDBFE;border-left:4px solid #185FA5;border-radius:8px;padding:12px 15px;margin:0 0 18px;font-size:13px;color:#1E3A5F;line-height:1.65} .help-note>div{font-size:10px;font-weight:800;color:#185FA5;text-transform:uppercase;letter-spacing:.09em;margin-bottom:4px} .help-block{margin:0 0 20px} .help-h{font-size:13px;font-weight:700;color:#1E3A5F;margin-bottom:10px} .help-steps{margin:0;padding:0;list-style:none} .help-steps li{display:flex;gap:11px;margin-bottom:9px;align-items:flex-start;font-size:13.5px;color:#475569;line-height:1.65} .help-steps li>span:first-child{flex-shrink:0;width:21px;height:21px;border-radius:50%;background:#1E3A5F;color:#fff;font-size:10.5px;font-weight:800;display:flex;align-items:center;justify-content:center;margin-top:1px} .help-fields{border:1px solid #eef1f5;border-radius:9px;overflow:hidden} .help-fields>div{display:grid;grid-template-columns:minmax(140px,190px) 1fr;gap:14px;padding:10px 14px;border-bottom:1px solid #f3f5f8} .help-fields>div:nth-child(even){background:#fcfdfe} .help-fields>div:last-child{border-bottom:none} .help-fields b{font-size:12.5px;color:#1E3A5F} .help-fields span{font-size:13px;color:#475569;line-height:1.6} .help-faq{margin:0 0 8px} .help-faq>div{padding:13px 0;border-bottom:1px solid #f0f3f7} .help-faq>div:last-child{border-bottom:none} .help-faq b{display:block;font-size:13.5px;color:#1E3A5F;margin-bottom:5px} .help-faq span{font-size:13px;color:#475569;line-height:1.7} .help-pager{display:flex;justify-content:space-between;margin-top:18px;gap:10px} .help-pager a{text-decoration:none} @media(max-width:768px){.help-page{flex-direction:column}.help-nav{width:auto;position:static;max-height:none;border-right:none;border-bottom:1px solid #e5e5e3}.help-main{padding:18px 16px}.help-fields>div{grid-template-columns:1fr;gap:4px}} @media print{.help-page{display:block}}