/* Pacific — Y2K-ish early 2000s (yellow / sky blue) */

:root{
  --y2k-yellow: #ffdf4a;
  --y2k-yellow-2: #ffe980;
  --y2k-sky: #7fd7ff;
  --y2k-sky-2: #c8f1ff;
  --y2k-blue: #0b4fae;
  --y2k-ink: #0b0b0b;
  --y2k-border: #1d3f8f;
  --y2k-shadow: rgba(0,0,0,.25);
  --y2k-bg: #f4fbff;
}

*{ box-sizing: border-box; }

html, body{
  margin: 0;
  padding: 0;
  background: var(--y2k-bg);
  color: var(--y2k-ink);
  font-family: Tahoma, Verdana, Arial, sans-serif;
  font-size: 14px;
}

a{
  color: #003a99;
  text-decoration: none;
}
a:hover{
  text-decoration: underline;
}

.y2k-topbar{
  background: linear-gradient(180deg, var(--y2k-sky) 0%, var(--y2k-sky-2) 100%);
  border-bottom: 3px solid var(--y2k-border);
  box-shadow: 0 2px 0 var(--y2k-shadow);
  padding: 10px 14px;
}

.y2k-brand{
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.y2k-logo{
  font-weight: 800;
  letter-spacing: .5px;
  font-size: 24px;
  color: var(--y2k-blue);
  text-shadow: 1px 1px 0 #fff;
}
.y2k-tag{
  font-size: 12px;
  color: #003a99;
  background: rgba(255,255,255,.7);
  border: 1px solid rgba(0,0,0,.15);
  padding: 2px 6px;
  border-radius: 6px;
}

.y2k-container{
  max-width: 1200px;
  margin: 16px auto;
  padding: 0 14px;
}

.y2k-tabs{
  display: flex;
  gap: 6px;
  margin-top: 10px;
  flex-wrap: wrap;
}
.y2k-tab{
  display: inline-block;
  padding: 7px 10px;
  border: 2px solid var(--y2k-border);
  border-bottom-width: 3px;
  border-radius: 10px 10px 0 0;
  background: linear-gradient(180deg, var(--y2k-yellow) 0%, var(--y2k-yellow-2) 100%);
  color: #143a8a;
  font-weight: 700;
  box-shadow: 0 2px 0 var(--y2k-shadow);
}
.y2k-tab:hover{
  filter: brightness(1.02);
}
.y2k-tab.is-active{
  background: linear-gradient(180deg, #fff 0%, #fff 100%);
}

.y2k-card{
  background: #fff;
  border: 2px solid var(--y2k-border);
  border-radius: 14px;
  box-shadow: 3px 3px 0 var(--y2k-shadow);
  padding: 14px;
}

.y2k-header-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.y2k-userpill{
  background: linear-gradient(180deg, var(--y2k-yellow) 0%, var(--y2k-yellow-2) 100%);
  border: 2px solid var(--y2k-border);
  border-radius: 999px;
  padding: 6px 10px;
  box-shadow: 2px 2px 0 var(--y2k-shadow);
  font-size: 12px;
}

.y2k-btn{
  background: linear-gradient(180deg, var(--y2k-yellow) 0%, var(--y2k-yellow-2) 100%);
  border: 2px solid var(--y2k-border);
  border-radius: 10px;
  padding: 7px 10px;
  cursor: pointer;
  font-weight: 700;
  color: #143a8a;
  box-shadow: 2px 2px 0 var(--y2k-shadow);
}
.y2k-btn:hover{ filter: brightness(1.03); }
.y2k-btn:active{ transform: translate(1px, 1px); box-shadow: 1px 1px 0 var(--y2k-shadow); }

.y2k-input, .y2k-select{
  width: 100%;
  padding: 8px 10px;
  border: 2px solid var(--y2k-border);
  border-radius: 10px;
  background: linear-gradient(180deg, #fff 0%, #f7fdff 100%);
  box-shadow: inset 1px 1px 0 rgba(0,0,0,.08);
}

.y2k-grid{
  display: grid;
  grid-template-columns: repeat(6, minmax(140px, 1fr));
  gap: 8px;
}
@media (max-width: 980px){
  .y2k-grid{ grid-template-columns: repeat(2, minmax(140px, 1fr)); }
}

.y2k-table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin-top: 12px;
  overflow: hidden;
  border: 2px solid var(--y2k-border);
  border-radius: 14px;
  box-shadow: 3px 3px 0 var(--y2k-shadow);
}
.y2k-table th{
  background: linear-gradient(180deg, var(--y2k-sky) 0%, var(--y2k-sky-2) 100%);
  color: #083b86;
  text-align: left;
  padding: 10px;
  border-bottom: 2px solid var(--y2k-border);
  font-size: 12px;
  letter-spacing: .2px;
}
.y2k-table td{
  padding: 10px;
  border-bottom: 1px solid rgba(0,0,0,.08);
  background: #fff;
}
.y2k-table tr:nth-child(even) td{
  background: #f7fdff;
}
.y2k-muted{
  color: #4b5a78;
  font-size: 12px;
}

.y2k-login-wrap{
  max-width: 460px;
  margin: 70px auto;
}

.y2k-title{
  margin: 0 0 6px 0;
  font-size: 20px;
  color: var(--y2k-blue);
  text-shadow: 1px 1px 0 #fff;
}

.y2k-audio{
  width: 100%;
  margin-top: 12px;
  border: 2px solid var(--y2k-border);
  border-radius: 12px;
  padding: 6px;
  background: linear-gradient(180deg, var(--y2k-sky-2) 0%, #fff 100%);
  box-shadow: inset 1px 1px 0 rgba(0,0,0,.08);
}
/* Pacific 2003 interface, shared across pages */
    body { background: #d8e6ef; color: #16243b; font-family: Tahoma, Verdana, Arial, sans-serif; }
    .scan-shell { max-width: 1160px; margin: 22px auto; padding: 0 14px 32px; }
    .scan-top { border: 1px solid #21508a; box-shadow: 2px 2px 0 #8c9dad; background: #f8fbff; }
    .scan-titlebar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 12px; background: linear-gradient(180deg, #76b7ea, #2e6eaf 52%, #20518f); color: white; border-bottom: 1px solid #143a70; }
    .scan-titlebar strong { font-size: 17px; letter-spacing: .3px; text-shadow: 1px 1px #173d70; }
    .scan-titlebar span { font-size: 11px; }
    .scan-nav { display: flex; gap: 8px; flex-wrap: wrap; padding: 8px 12px; background: #dcecf9; border-bottom: 1px solid #9bb8d1; font-size: 12px; }
    .scan-nav a { color: #164277; font-weight: bold; }
    .scan-content { padding: 16px; }
    .scan-intro { margin: 0 0 18px; font-size: 12px; color: #415575; }
    .scan-panel { margin: 0 0 18px; border: 1px solid #8fa7bd; background: #f7f9fc; box-shadow: inset 1px 1px #fff, 2px 2px 0 #b7c7d4; }
    .scan-panel h2 { margin: 0; padding: 8px 11px; font-size: 13px; color: #163d70; background: linear-gradient(#fff5b7, #f1d766); border-bottom: 1px solid #b9a34c; }
    .scan-panel-body { padding: 12px; }
    .scan-step { display: inline-block; min-width: 20px; margin-right: 7px; padding: 2px 5px; color: white; background: #2d68a6; border: 1px solid #164776; text-align: center; font-size: 11px; }
    .scan-search { display: grid; grid-template-columns: 1fr 1fr auto; align-items: end; gap: 10px; }
    .scan-field { display: block; font-weight: bold; font-size: 12px; color: #24466e; }
    .scan-field input { display: block; width: 100%; margin-top: 5px; padding: 8px; font: inherit; border: 1px solid #7d97b2; border-top-color: #415e7e; border-left-color: #415e7e; background: white; border-radius: 0; }
    .scan-button { display: inline-block; padding: 8px 13px; border: 1px solid #466c98; border-bottom-color: #173d6c; border-right-color: #173d6c; background: linear-gradient(#fffdf1, #d8e8f5 58%, #bad2e7); color: #123c70; font: bold 12px Tahoma, Verdana, sans-serif; cursor: pointer; box-shadow: inset 1px 1px white, 1px 1px 0 #9cacc0; text-decoration: none; white-space: nowrap; }
    .scan-button:hover { background: linear-gradient(#fff9db, #dbeaff 58%, #9dc5ed); text-decoration: none; }
    .scan-button:active { transform: translate(1px, 1px); box-shadow: inset 1px 1px #8b9ba9; }
    .scan-button.primary { background: linear-gradient(#fff7bd, #ffd65b 58%, #e5ad2b); border-color: #987330; color: #4b3500; }
    .scan-help { margin: 8px 0 0; color: #53647a; font-size: 11px; line-height: 1.45; }
    .scan-table-wrap { overflow-x: auto; }
    .scan-table { width: 100%; border-collapse: collapse; font-size: 12px; }
    .scan-table th { padding: 7px 8px; color: #163e6e; background: #d8e7f4; border: 1px solid #9eb8d0; text-align: left; white-space: nowrap; }
    .scan-table td { padding: 8px; border: 1px solid #c0cfdd; vertical-align: top; background: #fff; }
    .scan-table tr:nth-child(even) td { background: #f3f8fc; }
    .scan-table tr:has(input[type=radio]:checked) td { background: #fff8d7; }
    .scan-table input[type=radio] { accent-color: #19589e; }
    .scan-isrc { font: bold 12px Consolas, Monaco, monospace; color: #174b84; white-space: nowrap; }
    .scan-muted { color: #65758a; font-size: 11px; }
    .scan-badge { display: inline-block; padding: 2px 6px; border: 1px solid #8ca8be; background: #eaf2f8; color: #284e75; font-size: 11px; white-space: nowrap; }
    .scan-badge.approved { border-color: #69a16a; background: #e5f4dd; color: #236329; }
    .scan-badge.rejected { border-color: #b77a75; background: #ffebe7; color: #9c2e25; }
    .scan-badge.manual { border-color: #b6a052; background: #fff5cf; color: #775b14; }
    .scan-submit { display: grid; grid-template-columns: minmax(230px, 1fr) auto; gap: 12px; align-items: end; padding-top: 13px; border-top: 1px solid #ccdae5; }
    .scan-submit .scan-field { font-weight: bold; }
    .scan-feedback { padding: 9px 11px; margin-bottom: 15px; border: 1px solid #7a9b68; background: #e9f5de; color: #315c24; font-size: 12px; }
    .scan-feedback.error { border-color: #b77970; background: #ffedeb; color: #8a2921; }
    .scan-filters { display: flex; gap: 6px; flex-wrap: wrap; margin: 0 0 10px; }
    .scan-filters a { padding: 4px 8px; border: 1px solid #9aafc2; background: #e6eef6; font-size: 11px; }
    .scan-filters a.active { background: #fff2b3; border-color: #aa9252; font-weight: bold; }
    @media (max-width: 700px) { .scan-search, .scan-submit { grid-template-columns: 1fr; } .scan-titlebar { align-items: start; flex-direction: column; } }

/* Shared page details */
.scan-top { min-width: 0; }
.scan-content { min-width: 0; }
.scan-titlebar a { color: #fff; text-decoration: underline; }
.scan-titlebar form { margin: 0; }
.scan-titlebar .scan-button { padding: 4px 9px; }
.scan-nav .active { color: #102f59; text-decoration: underline; }
.scan-panel-body p:first-child { margin-top: 0; }
.scan-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.scan-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.scan-grid .scan-field input, .scan-grid .scan-field select { width: 100%; }
.scan-field select { display: block; width: 100%; margin-top: 5px; padding: 8px; font: inherit; border: 1px solid #7d97b2; border-top-color: #415e7e; border-left-color: #415e7e; background: white; border-radius: 0; }
.scan-field input[type="checkbox"] { display: inline-block; width: auto; margin: 0 5px 0 0; }
.scan-field input[type="radio"] { display: inline-block; width: auto; margin: 0 5px 0 0; }
.scan-inline { display: inline-flex; align-items: center; gap: 5px; margin: 0 5px 5px 0; }
.scan-inline input, .scan-inline select { width: auto; min-width: 90px; padding: 5px; border: 1px solid #7d97b2; font: inherit; }
.scan-inline .scan-button { padding: 5px 8px; }
.scan-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.scan-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; margin: 0; }
.scan-meta div { display: grid; grid-template-columns: 135px minmax(0, 1fr); border-bottom: 1px solid #d4e0e9; padding: 7px 0; gap: 8px; }
.scan-meta dt { font-weight: bold; color: #24466e; }
.scan-meta dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.scan-checklist { display: grid; gap: 6px; margin: 6px 0; }
.scan-checklist label { display: block; font-size: 11px; }
.scan-checklist input { accent-color: #19589e; }
.scan-audio { display: block; width: 100%; margin-top: 13px; border: 1px solid #a6bfd2; background: #e9f1f8; }
.scan-login { max-width: 465px; margin: 58px auto; }
.scan-login .scan-content { padding: 18px; }
.scan-login .scan-panel { margin-bottom: 0; }
.scan-login .scan-field + .scan-field { margin-top: 12px; }
.scan-table td { overflow-wrap: anywhere; }
.scan-requests-table { table-layout: fixed; min-width: 930px; }
.scan-requests-table th:nth-child(1) { width: 105px; }
.scan-requests-table th:nth-child(2) { width: 24%; }
.scan-requests-table th:nth-child(3) { width: 16%; }
.scan-requests-table th:nth-child(4) { width: 145px; }
.scan-requests-table th:nth-child(5) { width: 90px; }
.scan-requests-table th:nth-child(6) { width: 100px; }
.scan-requests-table td:nth-child(5) { white-space: nowrap; }
.scan-error-details { margin-top: 6px; max-width: 100%; font-size: 11px; }
.scan-error-details summary { color: #164277; cursor: pointer; }
.scan-error-details pre { max-width: 100%; max-height: 150px; overflow: auto; padding: 7px; background: #f5f7fa; border: 1px solid #c0cfdd; white-space: pre-wrap; overflow-wrap: anywhere; font: 11px Consolas, Monaco, monospace; }
.scan-table td .scan-muted { margin-top: 3px; }
.scan-table-wrap { max-width: 100%; }
.scan-empty { padding: 15px 8px; color: #65758a; font-size: 12px; }
@media (max-width: 800px) { .scan-grid, .scan-grid.two, .scan-meta { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .scan-shell { margin: 0 auto; padding: 0 0 20px; } .scan-content { padding: 10px; } .scan-meta div { grid-template-columns: 100px minmax(0, 1fr); } }