:root { --teal:#1a5f7a; --red:#e6194b; --ink:#1c2733; --muted:#6b7785; --bg:#f4f6f8; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, Arial, sans-serif; color:var(--ink); background:var(--bg); }
.topbar { display:flex; align-items:center; gap:1rem; background:var(--teal); color:#fff; padding:.6rem 1rem; }
.brand { font-weight:700; }
.tabs { display:flex; gap:.25rem; margin-left:1rem; }
.tab { color:#dceaf0; text-decoration:none; padding:.4rem .7rem; border-radius:6px; }
.tab.active, .tab:hover { background:rgba(255,255,255,.18); color:#fff; }
.logout { margin-left:auto; display:flex; align-items:center; gap:.5rem; }
.logout button { background:var(--red); color:#fff; border:0; padding:.35rem .7rem; border-radius:6px; cursor:pointer; }
.who { opacity:.9; font-size:.9rem; }
.content { max-width:1000px; margin:2rem auto; padding:0 1rem; }
.login { max-width:320px; margin:3rem auto; background:#fff; padding:1.5rem; border-radius:10px; box-shadow:0 2px 12px rgba(0,0,0,.08); }
.login label { display:block; margin:.6rem 0; }
.login input { width:100%; padding:.5rem; border:1px solid #cdd6de; border-radius:6px; }
.login button { width:100%; margin-top:.8rem; background:var(--teal); color:#fff; border:0; padding:.6rem; border-radius:6px; cursor:pointer; }
.error { color:var(--red); }
.muted { color:var(--muted); }

/* Saker (tickets) */
.filters { display:flex; gap:.5rem; margin:1rem 0; }
.chip { padding:.3rem .8rem; border-radius:999px; background:#e7edf1; color:var(--ink); text-decoration:none; font-size:.9rem; }
.chip.on { background:var(--teal); color:#fff; }
table.tickets { width:100%; border-collapse:collapse; background:#fff; border-radius:10px; overflow:hidden; box-shadow:0 1px 6px rgba(0,0,0,.06); }
table.tickets th, table.tickets td { text-align:left; padding:.6rem .8rem; border-bottom:1px solid #eef2f5; }
table.tickets tbody tr:hover { background:#f7fafc; cursor:pointer; }
table.tickets a { color:var(--teal); text-decoration:none; font-weight:600; }
.badge { padding:.15rem .55rem; border-radius:999px; font-size:.8rem; font-weight:600; }
.badge.open { background:#fde2e7; color:#9b1c34; }
.badge.solved { background:#d1fae5; color:#065f46; }
.newticket { margin-top:1.5rem; background:#fff; padding:1rem; border-radius:10px; box-shadow:0 1px 6px rgba(0,0,0,.06); }
.newticket summary { cursor:pointer; font-weight:600; color:var(--teal); }
.newticket label, .reply label { display:block; margin:.6rem 0; }
.newticket input, .newticket textarea, .reply textarea { width:100%; padding:.5rem; border:1px solid #cdd6de; border-radius:6px; font:inherit; }
.newticket button, .reply button, .statusform button { background:var(--teal); color:#fff; border:0; padding:.5rem 1rem; border-radius:6px; cursor:pointer; }
.back { color:var(--teal); text-decoration:none; }
.ticket-head { display:flex; align-items:center; gap:.8rem; }
.thread { margin:1rem 0; display:flex; flex-direction:column; gap:.7rem; }
.msg { padding:.7rem .9rem; border-radius:10px; max-width:80%; }
.msg.in { background:#fff; align-self:flex-start; box-shadow:0 1px 4px rgba(0,0,0,.06); }
.msg.out { background:#e3f0f5; align-self:flex-end; }
.msg-meta { font-size:.8rem; color:var(--muted); margin-bottom:.25rem; }
.msg-body { white-space:pre-wrap; }
.reply { margin-top:1rem; background:#fff; padding:1rem; border-radius:10px; box-shadow:0 1px 6px rgba(0,0,0,.06); }
.statusform { margin-top:.8rem; }
.statusform .solve { background:#065f46; }
.hint { font-size:.85rem; }

/* Oversikt cards */
.since { margin:1rem 0; }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1rem; }
.card { background:#fff; padding:1rem; border-radius:10px; box-shadow:0 1px 6px rgba(0,0,0,.06); }
.card.warn { border-left:4px solid var(--red); }
.card-label { color:var(--muted); font-size:.85rem; }
.card-value { font-size:1.8rem; font-weight:700; margin:.2rem 0; }
.card-sub { font-size:.8rem; }
.card-link { font-size:.85rem; color:var(--teal); text-decoration:none; }
.warn-text { color:var(--red); }

/* Snarveier */
.linkgroup { margin:1.5rem 0; }
.linkgroup h2 { font-size:1.05rem; }
.linkcards { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:.7rem; }
.linkcard { display:flex; flex-direction:column; background:#fff; padding:.8rem 1rem; border-radius:10px; text-decoration:none; box-shadow:0 1px 6px rgba(0,0,0,.06); }
.linkcard-label { color:var(--teal); font-weight:600; }
.linkcard-desc { font-size:.8rem; }
.ssh-hints { list-style:none; padding:0; }
.ssh-hints li { margin:.4rem 0; }
.ssh-hints code { background:#eef2f5; padding:.2rem .45rem; border-radius:5px; }

/* Prosjekter */
.projgrid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1rem; }
.projcard { background:#fff; padding:1rem; border-radius:10px; text-decoration:none; color:var(--ink); box-shadow:0 1px 6px rgba(0,0,0,.06); }
.projcard-name { font-weight:600; margin-bottom:.5rem; }
.pill { display:inline-block; padding:.1rem .5rem; border-radius:999px; font-size:.75rem; margin-right:.2rem; }
.pill.doing { background:#fef3c7; color:#92400e; }
.pill.todo { background:#e7edf1; color:#334; }
.pill.done { background:#d1fae5; color:#065f46; }
table.tasks { width:100%; border-collapse:collapse; background:#fff; border-radius:10px; overflow:hidden; box-shadow:0 1px 6px rgba(0,0,0,.06); margin-bottom:.8rem; }
table.tasks td { padding:.5rem .7rem; border-bottom:1px solid #eef2f5; vertical-align:top; }
.task.done .task-title { text-decoration:line-through; color:var(--muted); }
.task-actions { display:flex; gap:.4rem; }
.task-actions select { padding:.25rem; border:1px solid #cdd6de; border-radius:5px; }
.addrow { display:flex; gap:.5rem; margin:.6rem 0; }
.addrow input { flex:1; padding:.5rem; border:1px solid #cdd6de; border-radius:6px; }
.addrow button { background:var(--teal); color:#fff; border:0; padding:.5rem 1rem; border-radius:6px; cursor:pointer; }
.note { background:#fff; padding:.6rem .8rem; border-radius:8px; margin:.4rem 0; box-shadow:0 1px 4px rgba(0,0,0,.05); }
.note-meta { font-size:.78rem; margin-top:.2rem; }

/* Ops */
table.svc { width:100%; border-collapse:collapse; background:#fff; border-radius:10px; overflow:hidden; box-shadow:0 1px 6px rgba(0,0,0,.06); margin-bottom:1rem; }
table.svc th, table.svc td { text-align:left; padding:.5rem .8rem; border-bottom:1px solid #eef2f5; }
.opsactions { display:flex; flex-wrap:wrap; gap:.6rem; }
.opsactions button { background:var(--teal); color:#fff; border:0; padding:.55rem 1rem; border-radius:6px; cursor:pointer; }

/* Lisenser deep-link */
.deeplink { margin-top:1.5rem; background:#fff; padding:1.2rem; border-radius:10px; box-shadow:0 1px 6px rgba(0,0,0,.06); }
.biglink { display:inline-block; margin-top:.6rem; background:var(--teal); color:#fff; text-decoration:none; padding:.6rem 1.2rem; border-radius:8px; font-weight:600; }