Simplify styles for Tolino-friendly reader layout

static/styles.css

@@ -1,19 +1,12 @@
 :root {
   color-scheme: light;
-  --bg: #f6f4ee;
-  --surface: #ffffff;
-  --surface-muted: #f0ece2;
-  --text: #1d1b16;
-  --muted: #6b6458;
-  --border: #d6cebf;
-  --shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
 }
 
 html, body {
   margin: 0;
   padding: 0;
-  background: var(--bg);
-  color: var(--text);
+  background: #fff;
+  color: #000;
   font-family: Arial, sans-serif;
   font-size: 18px;
   line-height: 1.45;
@@ -24,9 +17,8 @@ img {
 }
 
 .header {
-  border-bottom: 1px solid var(--border);
-  background: var(--surface);
-  padding: 0.9rem 1rem;
+  border-bottom: 2px solid #000;
+  padding: 0.75rem 1rem;
 }
 
 .header h1 {
@@ -41,13 +33,12 @@ img {
 
 .container {
   padding: 1rem;
-  max-width: 56rem;
-  margin: 0 auto;
+  max-width: 42rem;
 }
 
 h2 {
   margin-top: 0;
-  font-size: 1.4rem;
+  font-size: 1.25rem;
 }
 
 .page-head {
@@ -55,8 +46,7 @@ h2 {
 }
 
 .page-subtitle {
-  margin: 0.35rem 0 0;
-  color: var(--muted);
+  margin: 0.25rem 0 0;
   font-size: 0.95rem;
 }
 
@@ -64,112 +54,87 @@ h2 {
   list-style: none;
   margin: 0;
   padding: 0;
-  display: grid;
-  gap: 0.85rem;
 }
 
 .book-item {
-  margin: 0;
+  border: 1px solid #000;
+  margin-bottom: 0.6rem;
+  padding: 0.6rem;
 }
 
 .book-card {
-  display: grid;
-  grid-template-columns: 5.5rem 1fr;
-  gap: 0.9rem;
-  align-items: start;
-  border: 1px solid var(--border);
-  border-radius: 14px;
-  background: var(--surface);
-  padding: 0.8rem;
+  display: table;
+  width: 100%;
   color: inherit;
   text-decoration: none;
-  box-shadow: var(--shadow);
 }
 
 .book-card-cover,
-.book-detail-cover {
-  display: flex;
-  align-items: flex-start;
-  justify-content: center;
+.book-card-body {
+  display: table-cell;
+  vertical-align: top;
+}
+
+.book-card-cover {
+  width: 4.8rem;
+  padding-right: 0.75rem;
 }
 
 .book-cover,
 .book-cover-placeholder {
-  width: 100%;
-  max-width: 5.5rem;
-  aspect-ratio: 2 / 3;
-  border-radius: 10px;
-  border: 1px solid var(--border);
-  background: var(--surface-muted);
+  display: block;
+  width: 4.2rem;
+  height: 6rem;
+  border: 1px solid #000;
   object-fit: cover;
-  overflow: hidden;
 }
 
 .book-cover-placeholder {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: var(--muted);
-  font-size: 0.85rem;
+  text-align: center;
+  line-height: 6rem;
+  font-size: 0.8rem;
   font-weight: bold;
-  letter-spacing: 0.08em;
 }
 
 .book-cover-detail,
 .book-cover-placeholder-detail {
-  max-width: 12rem;
-}
-
-.book-card-body {
-  min-width: 0;
+  width: 8rem;
+  height: 11.5rem;
+  margin-bottom: 1rem;
 }
 
 .book-title {
   display: block;
-  font-size: 1.05rem;
+  min-height: 44px;
+  font-weight: bold;
 }
 
 .book-author,
 .book-author-detail {
   display: block;
-  color: var(--muted);
+  margin-top: 0.2rem;
 }
 
-.book-author {
+.format {
+  display: block;
   margin-top: 0.2rem;
   font-size: 0.95rem;
 }
 
-.book-author-detail {
-  margin: -0.35rem 0 1rem;
-}
-
-.format {
-  display: inline-block;
-  margin-top: 0.6rem;
-  padding: 0.15rem 0.5rem;
-  border: 1px solid var(--border);
-  border-radius: 999px;
-  font-size: 0.85rem;
-  text-transform: uppercase;
-  background: var(--surface-muted);
-}
-
 .book-detail {
-  display: grid;
-  gap: 1.25rem;
+  display: block;
 }
 
-.book-detail-body {
-  min-width: 0;
+.book-detail-cover {
+  margin-bottom: 1rem;
 }
 
 .book-meta {
-  margin: 0 0 1.25rem;
+  margin: 0 0 1rem;
 }
 
 .book-meta div {
-  margin-bottom: 0.8rem;
+  margin-bottom: 0.6rem;
 }
 
 .book-meta dt {
@@ -177,38 +142,24 @@ h2 {
 }
 
 .book-meta dd {
-  margin: 0.2rem 0 0;
-  color: var(--muted);
-  word-break: break-word;
+  margin: 0.15rem 0 0;
 }
 
 .back-link {
-  color: var(--muted);
-  text-decoration: none;
+  color: inherit;
 }
 
 .btn {
   display: inline-block;
   min-height: 44px;
   padding: 0.7rem 1rem;
-  border: 1px solid var(--text);
-  border-radius: 999px;
+  border: 2px solid #000;
   text-decoration: none;
-  color: #fff;
-  background: var(--text);
+  color: #000;
   font-weight: bold;
 }
 
 code {
-  border: 1px solid var(--border);
-  border-radius: 6px;
-  background: var(--surface);
+  border: 1px solid #000;
   padding: 0.1rem 0.3rem;
 }
-
-@media (min-width: 700px) {
-  .book-detail {
-    grid-template-columns: 12rem 1fr;
-    align-items: start;
-  }
-}