:root{--ink:#14181b;--paper:#f5f6f7;--card:#fff;--accent:#01a8e7;--accent-dark:#017daf;--accent-darker:#016291;--accent-bg:#e6f6fd;--available:#017daf;--unavailable:#6b7570;--unavailable-bg:#eef0f1;--rating:#b8873a;--red:#c23b3b;--border:#e1e4e7;--muted:#5b6670;--font-sans:"Work Sans", "Segoe UI", system-ui, sans-serif;--font-display:"Space Grotesk", "Segoe UI", system-ui, sans-serif;font-family:var(--font-sans);color:var(--ink)}*{box-sizing:border-box}h1,h2{font-family:var(--font-display);font-weight:700}body{background:var(--paper);margin:0}.app{max-width:1100px;margin:0 auto;padding:0 1.5rem 4rem}.header{border-bottom:2px solid var(--border);flex-wrap:wrap;align-items:center;gap:2rem;margin-bottom:2rem;padding:1.25rem 0;display:flex}.logo{align-items:center;gap:.5rem;text-decoration:none;display:inline-flex}.logo-mark{background:var(--accent);border-radius:9px;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;display:inline-flex}.logo-bookmark{clip-path:polygon(0 0,100% 0,100% 100%,50% 76%,0 100%);background:#fff;width:12px;height:16px}.logo-dot{color:var(--accent)}.logo-text{font-family:var(--font-display);color:var(--ink);font-size:1.35rem;font-weight:700;line-height:1.15}.logo-sub{font-family:var(--font-sans);color:var(--muted);letter-spacing:.03em;font-size:.7rem;font-weight:500;display:block}.nav{flex:1;gap:1.25rem;display:flex}.nav a{min-height:44px;color:var(--ink);border-bottom:2px solid #0000;align-items:center;padding:.35rem 0;text-decoration:none;display:inline-flex}.nav a.active{border-bottom-color:var(--accent-dark);font-weight:600}.who{color:var(--ink);align-items:center;gap:.75rem;font-size:.85rem;font-weight:500;display:flex}.who .text-button{color:var(--muted);font-weight:400}.who .text-button:hover:not(:disabled){color:var(--ink)}input,textarea{font:inherit;border:1px solid var(--border);background:var(--card);border-radius:6px;padding:.45rem .6rem}input:focus,textarea:focus{outline:2px solid var(--accent-dark);outline-offset:1px}button{font:inherit;background:var(--accent-dark);color:#fff;cursor:pointer;border:none;border-radius:14px;justify-content:center;align-items:center;min-height:44px;padding:.5rem 1.1rem;font-weight:700;display:inline-flex}button:hover:not(:disabled){background:var(--accent-darker)}button:disabled{opacity:.5;cursor:not-allowed}.text-button{color:var(--red);text-underline-offset:3px;background:0 0;min-height:auto;padding:.35rem 0;font-weight:500;text-decoration:underline}.text-button:hover:not(:disabled){color:#9c3030;background:0 0}.login-page{text-align:center;background:var(--card);border:1px solid var(--border);border-radius:10px;max-width:420px;margin:3rem auto;padding:2.5rem 2rem}.login-page h1{margin-top:0}.login-page button{margin-top:1rem}.toolbar{flex-wrap:wrap;align-items:center;gap:1rem;margin-bottom:1.5rem;display:flex}.search{flex:1;min-width:220px}.chip{background:var(--card);color:var(--ink);border:1px solid var(--border);border-radius:999px;margin-left:.4rem;padding:.35rem .9rem;font-weight:500}.chip-active{background:var(--accent-dark);border-color:var(--accent-dark);color:#fff;font-weight:600}.book-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:1.25rem;margin:0;padding:0;list-style:none;display:grid}.book-card{background:var(--card);border:1px solid var(--border);height:100%;color:inherit;border-radius:10px;flex-direction:column;text-decoration:none;transition:transform .1s,box-shadow .1s;display:flex;overflow:hidden}.book-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #14181b1a}.book-card-body{flex-direction:column;gap:.3rem;padding:.75rem;display:flex}.book-card-body strong{font-family:var(--font-display);font-size:1.05rem;font-weight:700;line-height:1.3}.cover{aspect-ratio:2/3;object-fit:cover;width:100%;display:block}.cover-large{border-radius:10px;width:240px;box-shadow:0 4px 12px #14181b26}.cover-placeholder{text-align:center;color:#3e6377;background:repeating-linear-gradient(135deg,#dcebf3,#dcebf3 6px,#cfe2ed 6px 12px);justify-content:center;align-items:center;padding:1rem;font-weight:600;display:flex}.badge{align-self:flex-start;margin-top:.25rem;font-size:.72rem;font-weight:600}.badge-in{color:var(--available)}.badge-out{color:var(--unavailable)}.back{color:var(--muted);margin-bottom:1rem;text-decoration:none;display:inline-block}.detail-layout{flex-wrap:wrap;gap:2rem;display:flex}.detail-info{flex:1;min-width:280px}.detail-info h1{margin:0 0 .25rem}.detail-author{color:var(--muted);margin-top:0}.detail-info>.text-button{margin-top:1rem;display:block}.loan-box{border-radius:10px;margin:1.25rem 0;padding:1rem 1.25rem}.loan-box p{margin-top:0}.loan-box-in{background:var(--accent-bg)}.loan-box-out{background:var(--unavailable-bg)}.comments{max-width:640px;margin-top:2.5rem}.comments ul{padding:0;list-style:none}.comment{background:var(--card);border:1px solid var(--border);border-radius:10px;margin-bottom:.75rem;padding:.75rem 1rem}.comment p{margin:.35rem 0 0}.comments form{flex-direction:column;gap:.6rem;margin-top:1rem;display:flex}.comments button{align-self:flex-start}.form-page{max-width:540px}.isbn-lookup{gap:.6rem;display:flex}.isbn-lookup input{flex:1;min-width:0}@media (width<=480px){.isbn-lookup{flex-direction:column}}.search-results{flex-direction:column;gap:.5rem;max-height:min(600px,60vh);margin:.75rem 0;padding:0;list-style:none;display:flex;overflow-y:auto}.search-result{background:var(--card);width:100%;color:var(--ink);border:1px solid var(--border);text-align:left;border-radius:10px;justify-content:flex-start;align-items:center;gap:.75rem;min-height:auto;padding:.5rem;font-weight:400;display:flex}.search-result:hover:not(:disabled){background:var(--accent-bg)}.cover-thumb{aspect-ratio:auto;border-radius:4px;flex-shrink:0;width:44px;height:66px}.cover-thumb.cover-placeholder{color:var(--accent-dark);padding:0}.cover-thumb svg{opacity:.7;width:20px;height:20px}.search-result-info{flex-direction:column;gap:.15rem;min-width:0;display:flex}.search-result-info strong{overflow-wrap:anywhere}.form-page form{flex-direction:column;gap:.9rem;margin-top:1.5rem;display:flex}.form-page label{flex-direction:column;gap:.3rem;font-size:.9rem;font-weight:600;display:flex}.form-page button[type=submit]{align-self:flex-start}.muted{color:var(--muted)}.small{font-size:.82rem}.error{color:var(--red)}
