@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
:root{--navy:#08254c;--blue:#167be8;--ink:#103556;--muted:#7690ad;--line:#dce8f4;--bg:#f0f6fc}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.45 Inter,Arial,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}
.demo-app{display:flex;min-height:100vh}.app-sidebar{width:210px;flex:none;background:linear-gradient(#061b3a,#0a305e);color:#d2e3f7;padding:9px 10px;display:flex;flex-direction:column}.sidebar-logo{background:#fff;border-radius:9px;height:113px;display:grid;place-items:center;margin-bottom:13px}.sidebar-logo img{width:180px;max-height:100px;object-fit:contain}.sidebar-nav{display:grid;gap:3px}.sidebar-nav>*{padding:12px 13px;border-radius:9px;font-weight:700;font-size:13px}.sidebar-nav span{opacity:.7}.sidebar-nav .active{background:linear-gradient(90deg,#126de0,#278ff0);color:white}.sidebar-bottom{margin-top:auto;padding:12px;border:1px solid #7794bb66;border-radius:9px}.sidebar-bottom strong,.sidebar-bottom small{display:block}.sidebar-bottom small{font-size:11px;color:#aabfd9;margin-top:4px}
.app-content{min-width:0;flex:1}.app-topbar{height:85px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:15px;padding:0 25px}.app-topbar strong{font-size:18px}.app-topbar div{display:flex;align-items:center;gap:20px;color:#6982a0;font-size:12px}.app-topbar a{background:#eef6ff;color:#076bd2;border-radius:8px;padding:10px 12px;font-weight:800}.demo-content{max-width:1700px;padding:24px 25px 55px;margin:auto}.demo-notice{font-size:12px;color:#567899;margin-bottom:14px}.surface{background:#fff;border:1px solid var(--line);border-radius:15px;box-shadow:0 8px 25px #173d6b08}.page-title{font-size:26px;margin:0 0 17px}.button{padding:10px 14px;background:#f5faff;border:1px solid #cde0f4;border-radius:9px;color:#1168c2;font-weight:800}.button.primary{background:linear-gradient(90deg,#116ddc,#208af0);color:#fff;border-color:#1275e2}.button:hover{filter:brightness(.97)}
.filter-bar{padding:14px;display:flex;align-items:center;justify-content:space-between;gap:13px}.filters,.filter-actions{display:flex;align-items:center;gap:9px}.filters{flex:1;min-width:0}.filters input{flex:1;min-width:130px}.filters input,.filters select,.form-grid select,.form-grid input,.form-grid textarea{padding:10px 12px;border:1px solid #d5e4f3;border-radius:9px;background:#fff;color:var(--ink)}.filters select{max-width:170px}.filter-actions{white-space:nowrap}.table-card{margin-top:13px;overflow:hidden}.table-scroll{overflow-x:auto}.service-table,.actions-table{width:100%;border-collapse:collapse;text-align:left}.service-table th,.service-table td,.actions-table th,.actions-table td{padding:13px 11px;border-bottom:1px solid #e7eff8;vertical-align:middle}.service-table th,.actions-table th{font-size:11px;color:#587391;background:#f9fcff;white-space:nowrap}.service-table td,.actions-table td{font-size:12px}.service-table td strong,.service-table td small{display:block}.service-table td small{color:var(--muted);margin-top:4px}.service-table tbody tr:hover{background:#f6fbff}.code{padding:5px 8px;border-radius:7px;color:#1169c5;background:#eaf4ff;font-weight:800;white-space:nowrap}.link{color:#086fda;font-weight:800}.tag{display:inline-flex;padding:5px 9px;border-radius:18px;background:#eaf3ff;color:#1269bf;white-space:nowrap;font-size:11px;font-weight:800}.tag.waiting{background:#fff5e5;color:#9f620b}.tag.closed{background:#e8f8f0;color:#157344}.tag.high{background:#fff0ec;color:#a9502c}.table-footer{padding:13px;color:#6b85a0;font-size:12px;border-top:1px solid var(--line)}.empty{padding:28px;color:var(--muted);text-align:center}
.detail-hero{padding:3px 10px 17px}.back{font-size:12px;color:#0c6ed1;font-weight:800}.detail-hero h1{font-size:26px;margin:12px 0 2px}.detail-hero h1 .tag{vertical-align:middle;margin-left:10px}.detail-hero p{font-size:12px;color:var(--muted);margin:0}.tabs{display:flex;gap:5px;padding:6px;margin-bottom:13px;overflow-x:auto}.tabs button{border:0;background:#fff;color:#53708e;border-radius:9px;padding:12px 15px;font-weight:800;white-space:nowrap}.tabs button.active{background:var(--blue);color:#fff}.tabs b{background:#edf5fd;color:#0d72d5;padding:4px 7px;border-radius:6px;margin-left:4px}.tabs .active b{color:#fff;background:#ffffff35}.cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}.card,.panel{padding:18px 21px}.card h2,.panel h2{font-size:16px;margin:0 0 13px}.card h2{padding-bottom:14px;border-bottom:1px solid var(--line)}.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:12px}.facts>div,.owner>div{padding:10px;border-right:1px solid var(--line)}.facts>div:nth-child(4n),.owner>div:last-child{border:0}.facts span,.owner span,.assigned span{display:block;color:var(--muted);font-size:11px}.facts strong,.owner strong,.assigned strong{display:block;font-size:13px;margin-top:5px}.owner{display:grid;grid-template-columns:repeat(3,1fr);margin-top:12px}.owner small,.assigned small{display:block;color:var(--muted);font-size:11px;margin-top:5px}.assigned{display:flex;align-items:center;gap:16px;margin-top:13px}.assigned>div{padding:11px;background:#f6faff;border:1px solid var(--line);border-radius:9px;min-width:215px}.description{color:#385d7d;margin:15px 0 0}.record{padding:12px 14px;border:1px solid var(--line);border-radius:9px;background:#f9fcff;margin:9px 0}.record strong,.record small{display:block}.record small{color:var(--muted);margin-top:4px}.history-row{display:flex;justify-content:space-between;gap:15px}.form-grid{display:grid;gap:10px;max-width:900px}.form-grid label{display:grid;gap:5px;font-weight:700}.form-grid textarea{width:100%;height:95px;resize:vertical}.form-grid textarea.result{height:55px}.form-grid select,.form-grid input{max-width:420px}.form-grid .button{justify-self:start}.conditional{display:none;gap:9px;background:#f5faff;border:1px solid #c8dff5;border-radius:10px;padding:13px}.conditional.visible{display:grid}.action-buttons{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.locked{background:#fff9ea;color:#78684d;border-radius:9px;padding:12px;font-size:12px}.form-sheet{margin-top:15px;background:#fff;padding:24px;border:1px solid #cbdceb;border-radius:10px}.form-sheet header{display:flex;justify-content:space-between;gap:15px;border-bottom:2px solid #0c3b76;padding-bottom:13px}.form-sheet header strong{font-size:19px}.form-sheet .form-columns{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-sheet p{color:#385d7b;margin:6px 0}.form-sheet h3{margin:17px 0 5px;font-size:14px}
@media(max-width:1050px){.app-sidebar{width:180px}.filter-bar{flex-wrap:wrap}.cards{grid-template-columns:1fr}}@media(max-width:740px){.demo-app{display:block}.app-sidebar{width:auto;padding:7px}.sidebar-logo{height:64px;margin:0}.sidebar-logo img{max-height:58px;width:150px}.sidebar-nav,.sidebar-bottom{display:none}.app-topbar{height:auto;min-height:65px;padding:10px 14px}.app-topbar div span{display:none}.demo-content{padding:17px 12px 35px}.filters{flex-wrap:wrap}.filters input{flex-basis:100%}.filter-actions{justify-content:space-between;width:100%}.facts{grid-template-columns:repeat(2,1fr)}.facts>div:nth-child(even){border:0}.owner{grid-template-columns:1fr}.owner>div{border-right:0;border-bottom:1px solid var(--line)}.detail-hero h1{font-size:21px}.assigned{display:block}.form-sheet .form-columns{grid-template-columns:1fr}}@media print{.app-sidebar,.app-topbar,.demo-notice,.tabs,.detail-hero,.action-buttons{display:none!important}.demo-content,.panel{padding:0}.surface,.form-sheet{border:0;box-shadow:none}}
.sidebar-nav button{appearance:none;border:0;background:transparent;color:#d2e3f7;text-align:left;cursor:pointer}.sidebar-nav button:hover{background:#ffffff16}.sidebar-nav button.active{background:linear-gradient(90deg,#126de0,#278ff0);color:white}.service-table tbody tr[data-row]{cursor:pointer}.service-table tbody tr[data-row]:focus-visible{outline:3px solid var(--blue);outline-offset:-3px}.aux-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}.aux-card{padding:20px}.aux-card strong{display:block;font-size:24px;color:#126bd0}.aux-card span{color:var(--muted);font-size:12px}.aux-table{margin-top:15px}.aux-table .button{margin:5px 0}.demo-feedback{margin:13px 0;background:#eaf8f2;color:#19744d;border:1px solid #bce4cf;padding:11px 13px;border-radius:9px}.demo-qr{display:flex;gap:9px;max-width:530px}.demo-qr input{flex:1;min-width:0;padding:10px 12px;border:1px solid var(--line);border-radius:9px}@media(max-width:740px){.aux-grid{grid-template-columns:1fr}.demo-qr{display:block}.demo-qr .button{margin-top:9px}}