:root{--navy:#071827;--navy-2:#10293d;--blue:#19a7e0;--blue-2:#087bae;--surface:#fff;--canvas:#f3f7fa;--ink:#10202d;--muted:#62727f;--line:#dce6ec;--good:#0b7a53;--good-bg:#e6f6ef;--warn:#9a5b00;--warn-bg:#fff3d8;--shadow:0 18px 45px rgba(7,24,39,.08);--radius:14px}*{box-sizing:border-box}html{font-size:16px}body{margin:0;background:var(--canvas);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.5}a{color:inherit}button,input,select,textarea{font:inherit}.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:1rem;top:1rem;z-index:99;background:#fff;padding:.75rem;border-radius:6px}.topbar{min-height:76px;background:var(--navy);color:#fff;display:flex;align-items:center;padding:.75rem clamp(1rem,4vw,3rem);gap:2.5rem;box-shadow:0 6px 24px rgba(7,24,39,.2)}.brand{display:flex;align-items:center;gap:.75rem;text-decoration:none;white-space:nowrap}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border:1px solid rgba(255,255,255,.3);border-radius:10px;background:linear-gradient(145deg,var(--blue),#086890);font-weight:800;letter-spacing:-.04em}.brand strong,.brand small{display:block}.brand small{font-size:.75rem;color:#9fc1d6;text-transform:uppercase;letter-spacing:.12em}.topbar nav{display:flex;gap:1.5rem;flex:1}.topbar nav a{color:#c9dce8;text-decoration:none;font-weight:600}.topbar nav a:hover{color:#fff}.user-actions{display:flex;align-items:center;gap:1rem;color:#c9dce8;font-size:.875rem}.user-actions form{margin:0}.link-button{border:0;background:none;color:#fff;text-decoration:underline;cursor:pointer}.shell{width:min(1240px,calc(100% - 2rem));margin:0 auto;padding:2.5rem 0 4rem;min-height:calc(100vh - 140px)}footer{background:var(--navy);color:#8fb0c4;display:flex;justify-content:space-between;padding:1rem clamp(1rem,4vw,3rem);font-size:.8rem}.page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem;margin-bottom:1.75rem}.page-heading h1,.auth-card h1{font-size:clamp(1.8rem,3vw,2.65rem);line-height:1.05;margin:.2rem 0 .5rem;letter-spacing:-.035em}.eyebrow{color:var(--blue-2);text-transform:uppercase;letter-spacing:.14em;font-size:.75rem;font-weight:800;margin:0}.muted,.help{color:var(--muted)}h2{font-size:1.25rem;margin:.25rem 0 1rem}h3{font-size:1rem}.button{display:inline-flex;align-items:center;justify-content:center;padding:.72rem 1rem;border-radius:9px;border:1px solid transparent;text-decoration:none;font-weight:750;cursor:pointer}.button.primary{background:var(--blue-2);color:#fff}.button.primary:hover{background:#056a97}.button.secondary{background:#fff;border-color:var(--line);color:var(--ink)}.account-banner{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 1.75rem;margin-bottom:1rem;border-radius:var(--radius);color:#fff;background:linear-gradient(118deg,var(--navy),var(--navy-2) 65%,#124866)}.account-banner h2{font-size:1.5rem;margin:.1rem 0}.account-banner p{margin:0;color:#b8d0de}.account-banner .muted{color:#91b4c8}.dashboard-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.35rem;box-shadow:var(--shadow)}.span-2{grid-column:span 2}.panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.metric{font-size:2rem;color:var(--blue-2)}.status-pill{display:inline-flex;align-items:center;width:max-content;border-radius:99px;padding:.3rem .6rem;background:#eaf0f4;color:#425561;font-size:.75rem;font-weight:750}.status-pill.good{background:var(--good-bg);color:var(--good)}.status-pill.warning{background:var(--warn-bg);color:var(--warn)}.status-grid,.cards-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.mini-card,.status-grid article{padding:1rem;border:1px solid var(--line);border-radius:11px;background:#fbfdfe}.big-status{font-size:1.15rem;font-weight:750}.status-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#16a56c;margin-right:.5rem;box-shadow:0 0 0 4px #def4ea}.status-dot.bad{background:#c33838;box-shadow:0 0 0 4px #fae3e3}.status-grid dl{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem}.status-grid dl div,.detail-list div{display:flex;justify-content:space-between;gap:1rem}.status-grid dt,.detail-list dt{color:var(--muted)}.status-grid dd,.detail-list dd{margin:0;font-weight:700}.detail-list{display:grid;gap:.65rem}.item-list{display:grid}.item-list a{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 0;border-top:1px solid var(--line);text-decoration:none}.item-list a:first-child{border-top:0}.item-list strong,.item-list small,table small{display:block}.item-list small,table small{color:var(--muted);font-size:.8rem}.text-link{color:var(--blue-2);font-weight:750;text-decoration:none}.timeline{display:grid;gap:.8rem}.timeline>div{display:flex;gap:.75rem}.timeline p{margin:0}.timeline small{display:block;color:var(--muted)}.timeline>div:before{content:"";width:8px;height:8px;margin-top:.45rem;flex:0 0 auto;background:var(--blue);border-radius:50%}.auth-shell{display:grid;place-items:center;min-height:calc(100vh - 160px)}.auth-card{width:min(460px,100%);background:#fff;padding:2rem;border:1px solid var(--line);border-top:4px solid var(--blue);border-radius:var(--radius);box-shadow:var(--shadow)}.stacked-form{display:grid;gap:1rem}.stacked-form p{margin:0}.stacked-form label{font-weight:700}.stacked-form input,.stacked-form select,.stacked-form textarea,.search-bar input{width:100%;display:block;margin-top:.35rem;border:1px solid #b8c8d2;border-radius:8px;padding:.72rem;background:#fff;color:var(--ink)}.stacked-form input:focus,.stacked-form select:focus,.stacked-form textarea:focus,.search-bar input:focus{outline:3px solid rgba(25,167,224,.2);border-color:var(--blue-2)}.qr{display:block;width:190px;height:190px;margin:1.2rem auto;border:10px solid #fff;box-shadow:0 0 0 1px var(--line)}.secret{display:block;word-break:break-all;margin-top:.5rem;padding:.7rem;background:var(--canvas);border-radius:6px}.alert{padding:.8rem 1rem;background:#fff1f1;color:#8d2424;border:1px solid #f1c5c5;border-radius:8px}.error{display:block;color:#a12424}.search-bar{display:flex;gap:.6rem;margin-bottom:1rem}.search-bar input{margin:0}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left}th{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}th,td{padding:.8rem;border-bottom:1px solid var(--line);vertical-align:top}.narrow{width:min(720px,100%);margin:0 auto}.narrow>h1{font-size:2rem;margin:.2rem 0}.narrow>.panel{margin-top:1.5rem}.form-actions{display:flex;justify-content:flex-end;gap:.75rem}.ticket-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(300px,1fr);gap:1rem}.conversation{display:grid;gap:1rem}.message{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.25rem}.message.internal{background:#fffaf0;border-color:#f0d49a}.message-meta{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;color:var(--muted);font-size:.8rem}.message-meta strong{color:var(--ink);font-size:.9rem}.reply-panel{align-self:start;position:sticky;top:1rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.empty-shell{text-align:center}
@media(max-width:850px){.topbar{flex-wrap:wrap;gap:.8rem}.topbar nav{order:3;width:100%;overflow:auto}.user-actions{margin-left:auto}.dashboard-grid{grid-template-columns:1fr 1fr}.span-2{grid-column:span 2}.ticket-layout{grid-template-columns:1fr}.reply-panel{position:static}.status-grid{grid-template-columns:1fr}}
@media(max-width:600px){.shell{width:min(100% - 1rem,1240px);padding:1.25rem 0 2.5rem}.topbar{padding:.75rem}.topbar nav{gap:1rem}.user-actions>span{display:none}.page-heading{align-items:flex-start;flex-direction:column}.dashboard-grid{grid-template-columns:1fr}.span-2{grid-column:auto}.panel{padding:1rem}.account-banner{align-items:flex-start}.status-grid,.cards-row{grid-template-columns:1fr}.search-bar{align-items:stretch;flex-direction:column}.auth-card{padding:1.35rem}footer{flex-direction:column;gap:.35rem}.form-actions{flex-direction:column-reverse}.button{width:100%}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}