/* My reading. Uses the site's own colours and type (site-base.css). */
.hub-wrap{padding-top:28px;padding-bottom:56px;display:flex;flex-direction:column;gap:22px}
.hub-wrap h1{font-size:40px;margin:0}
.hub-wrap .lede{color:var(--muted);margin:0;max-width:66ch}
#hub{display:flex;flex-direction:column;gap:22px}
#hub h2{font-family:var(--serif);font-size:24px;margin:0}
#hub h3{font-family:var(--serif);font-size:19px;margin:0}
.hb{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:0 16px;border-radius:8px;background:var(--green);color:#fff;border:1px solid var(--green);font:600 14px var(--sans);cursor:pointer;text-decoration:none;white-space:nowrap}
.hb:hover{background:var(--green-dark)}.hb.small{min-height:34px;padding:0 12px;font-size:13px}
.hb.ghost{background:var(--surface);color:var(--green)}.hb.danger,.lnk.danger{background:#A23B32;border-color:#A23B32;color:#fff}.lnk.danger{background:none;color:#A23B32}
.lnk{background:none;border:0;padding:0;color:var(--green);font:inherit;text-decoration:underline;cursor:pointer}
.acct{display:flex;flex-wrap:wrap;gap:10px;align-items:center;background:var(--green-tint);border:1px solid var(--green-line);border-radius:10px;padding:12px 16px;font-size:15px}
.acct.on{background:var(--surface);border-color:var(--line)}
.acct input,.inl input,.inl select,.nbbar input{font:15px var(--sans);padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);min-width:0}
.acct input{flex:1 1 220px}
.err{color:#A23B32}.ok{color:var(--green);font-weight:600}
.cont-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;margin-top:10px}
.ct{display:flex;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px;color:inherit;text-decoration:none}
.ct:hover{border-color:var(--green)}
.ct-b{display:flex;flex-direction:column;gap:4px;min-width:0}.ct-t{font-family:var(--serif);font-weight:600;font-size:17px;line-height:1.25}
.cv{--h:150;flex:0 0 auto;width:64px;height:92px;border-radius:3px 6px 6px 3px;background:linear-gradient(90deg,hsl(var(--h) 30% 24%) 0 6px,hsl(var(--h) 32% 34%) 6px);color:#fff;display:flex;flex-direction:column;justify-content:space-between;padding:8px 6px 6px 12px;box-shadow:0 2px 6px rgba(20,32,30,.18);overflow:hidden}
.cv-t{font:600 9.5px/1.2 var(--serif);display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.cv-a{font:500 8px var(--sans);letter-spacing:.08em;text-transform:uppercase;opacity:.85}
.bk.sm .cv{width:52px;height:74px}
.pg{display:block;height:5px;background:var(--line-2);border-radius:3px;overflow:hidden;width:100%;max-width:220px}.pg i{display:block;height:100%;background:var(--green)}
.yr{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:16px 18px;display:flex;flex-direction:column;gap:12px}
.yr-c{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.yr-c p{margin:4px 0 0}
.ring{width:84px;height:84px;flex:0 0 auto}
.yr-s{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin:0}
.yr-s div{border-top:1px solid var(--line-2);padding-top:8px}.yr-s dt{font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}.yr-s dd{margin:2px 0 0;font:700 24px var(--serif);font-variant-numeric:tabular-nums}
.inl{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:8px}.inl input[type=number]{width:90px}
.tabs{display:flex;flex-wrap:wrap;gap:6px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:10px}
.tabs button{white-space:nowrap;font:500 14px var(--sans);border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:7px 13px;cursor:pointer}
.tabs button[aria-current="true"]{background:var(--green);border-color:var(--green);color:#fff}
.tabs .n{font-variant-numeric:tabular-nums;opacity:.75}.tabs .add{border-style:dashed;color:var(--green)}.tabs .sep{flex:0 0 12px}
.panel{display:flex;flex-direction:column;gap:18px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.bk{display:flex;gap:14px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px;min-width:0}
.bk-b{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.bk-t{font-family:var(--serif);font-weight:600;font-size:17px;line-height:1.25;color:var(--ink);text-decoration:none;overflow-wrap:anywhere}.bk-t:hover{color:var(--green)}
.bk-a{font-size:14px;color:var(--ink-2)}.bk-a a{color:inherit}
.bk-m{font-size:13px;color:var(--muted)}
.bk-x{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:6px}
.empty{background:var(--surface);border:1px dashed var(--line);border-radius:10px;padding:28px;text-align:center;color:var(--muted)}.empty p{margin:0 auto 12px;max-width:52ch}
.shh{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline}.pill{font-size:12px;background:var(--saffron-tint);color:var(--saffron-text);border-radius:999px;padding:3px 10px;font-weight:600}
.nbbar{display:flex;gap:8px;flex-wrap:wrap}.nbbar input{flex:1 1 260px}
.nb{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px 18px;display:flex;flex-direction:column;gap:10px}
.nb h3 a{color:var(--ink);text-decoration:none}
.hl{margin:0;padding:6px 0 6px 14px;border-left:4px solid #E9C46A;font-family:var(--serif);font-size:16px;line-height:1.5}
.hl.b{border-color:#7FB3D5}.hl.p{border-color:#E8A0BF}.hl.g{border-color:#8BC48A}.hl.k{border-color:var(--muted)}
.hl .note{font-family:var(--sans);font-size:14px;margin:6px 0 0;color:var(--ink-2)}.hl footer{font:12px var(--sans);color:var(--muted);margin-top:4px}
.rl{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 16px}.rl summary{cursor:pointer;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}.rl summary h2{font-size:20px!important}.rl .grid{margin-top:12px}
.kd{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:16px 18px;display:flex;flex-direction:column;gap:10px}.kd p{margin:0}
.steps{margin:0;padding-left:20px;line-height:1.7}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}.cols ul{margin:6px 0 0;padding-left:18px}
.yib{display:flex;flex-direction:column;gap:14px}.yib .big{font-size:18px;margin:0}
.ck{display:inline-flex;gap:6px;align-items:center;font-size:14px}
.confirm{background:var(--saffron-tint);border-radius:8px;padding:10px 12px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.also h2{margin-bottom:10px!important}
@media (max-width:620px){.hub-wrap h1{font-size:32px}.grid,.cont-g{grid-template-columns:1fr}.tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px}.tabs button{padding:6px 11px;font-size:13px}}