/* DRAFT — to be manually revised. */

@font-face{font-family:'Ioskeley Mono';src:url(IoskeleyMono-Regular.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Ioskeley Mono';src:url(IoskeleyMono-Italic.woff2) format('woff2');font-weight:400;font-style:italic;font-display:swap;}
@font-face{font-family:'Ioskeley Mono';src:url(IoskeleyMono-Bold.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap;}

/* Masthead face — same as the invoice (brand.md: Source Serif 4 Display, Bold Italic) */
@font-face{font-family:'Source Serif 4 Display';src:url(SourceSerif4Display-BoldIt.woff2) format('woff2');font-weight:700;font-style:italic;font-display:swap;}

:root{
  --bg:#fff;
  --fg:#000;
  --muted:#bbbbbb;
  --bar-bg:#f0f0f0;
  --shimmer:#fbfbfb;
}

@media (prefers-color-scheme:dark){
  :root{
    --bg:#000;
    --fg:#fff;
    --muted:#999;
    --bar-bg:#141414;
    --shimmer:#0f0f0f;
  }
}

body{
  margin: 0;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  background:var(--bg);
  color:var(--fg);
  font-family:'Ioskeley Mono',monospace;
  text-rendering:optimizeLegibility;
}

main{
  margin: 35px auto;
  margin-bottom: 5px;
  width:768px;
  max-width:calc(100% - 24px);
  position:relative;
  z-index:1;
}

#masthead{
  display:flex;
  align-items:baseline;
  gap:0.6em;
}

#masthead h1{
  font-family:'Source Serif 4 Display',serif;
  font-weight:700;
  font-style:italic;
  font-size:30pt;
  margin:0;
}

#masthead p{
  margin:0;
  font-style:italic;
  font-size:14px;
}

h2{
  font-size:17px;
}

h2, p{
  margin:12px 0;
}

p{
  line-height:1.5;
}

hr{
  width:100%;
  margin:1.5em auto;
  border:none;
  border-top:1pt dotted var(--muted);
}

.table-scroll{
  overflow-x:auto;
}

.table-scroll table{
  min-width:520px;
}

table{
  width:100%;
  border-collapse:collapse;
  border:1.5pt solid var(--muted);
  border-left:0.6em solid var(--muted);
}

th, td{
  border:0.5pt solid var(--muted);
  padding:6px;
}

th{
  border-bottom:1pt solid var(--fg);
}

th:nth-child(-n+3), td:nth-child(-n+3){
  width:20%;
}

ul{
  list-style:none;
  padding:0;
  margin:0.5em 0;
}

li{
  margin:0.4em 0;
}

a{
  color:var(--fg);
}

#imprint{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:1em;
  background:var(--bar-bg);
  font-style:italic;
  font-size:14px;
  padding:6px 12px;
  position:relative;
  z-index:1;
  margin-top:auto;
}

#imprint p{
  margin:0;
}