:root{--paper:oklch(98.5% .002 255);--surface:oklch(100% 0 0);--ink:oklch(25% .012 255);--muted:oklch(46% .014 255);--rule:oklch(91% .004 255);--accent:oklch(49% .075 220);--accent-strong:oklch(25% .012 255);--accent-contrast:oklch(100% 0 0);--accent-ring:oklch(49% .075 220/.28);--danger:oklch(48% .11 25);--font-serif:Georgia, "Iowan Old Style", "Times New Roman", serif;--font-sans:system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--fs-display:1.5rem;--fs-title:1.25rem;--fs-headline:1.075rem;--fs-body:.95rem;--fs-label:.8rem;--radius-sm:6px;--radius-md:10px;--scrim:oklch(15% .01 255/.82);--shadow-modal:0 12px 40px oklch(20% .02 255/.18);--step:.16s;font-family:var(--font-sans);font-size:var(--fs-body);color:var(--ink);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--paper:oklch(19% .008 255);--surface:oklch(22.5% .008 255);--ink:oklch(91% .006 255);--muted:oklch(66% .012 255);--rule:oklch(30% .008 255);--accent:oklch(70% .08 220);--accent-strong:oklch(91% .006 255);--accent-contrast:oklch(19% .008 255);--accent-ring:oklch(70% .08 220/.32);--danger:oklch(68% .11 25);--shadow-modal:0 12px 40px oklch(0% 0 0/.5)}}*{box-sizing:border-box}body{background:var(--paper);color:var(--ink);font-size:var(--fs-body);margin:0}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}button{font:inherit;cursor:pointer;color:inherit;background:0 0;border:none}input,select{font:inherit;border:1px solid var(--rule);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);width:100%;transition:border-color var(--step) ease, box-shadow var(--step) ease;padding:.55rem .7rem}input[type=checkbox]{border:0;width:auto;padding:0}input:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring);outline:none}input::placeholder{color:var(--muted)}label{font-size:var(--fs-label);letter-spacing:.01em;color:var(--muted);flex-direction:column;gap:.35rem;font-weight:500;display:flex}@media (pointer:coarse){input,select,textarea{font-size:16px}}:focus-visible{box-shadow:0 0 0 3px var(--accent-ring);border-radius:var(--radius-sm);outline:none}.card{background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius-md);padding:1.4rem}.muted{color:var(--muted)}.small{font-size:var(--fs-label)}.big{font-family:var(--font-serif);font-size:var(--fs-title);font-weight:600}.error{color:var(--danger);font-size:var(--fs-body)}.notice{color:var(--ink);font-size:var(--fs-body);border-left:2px solid var(--accent);padding-left:.6rem}.center{place-items:center;min-height:60vh;display:grid}.primary{background:var(--accent);color:var(--accent-contrast);border-radius:var(--radius-sm);font-weight:600;font-size:var(--fs-body);transition:background var(--step) ease;padding:.55rem 1rem}.primary:hover:not(:disabled){background:var(--accent-strong)}.primary:disabled{opacity:.45;cursor:default}.link{color:var(--accent);font-size:var(--fs-body);padding:.4rem .2rem}.link.danger{color:var(--danger)}.auth-wrap{place-items:center;min-height:100vh;padding:1rem;display:grid}.auth-card{flex-direction:column;gap:.9rem;width:100%;max-width:360px;display:flex}.brand{font-family:var(--font-serif);letter-spacing:-.01em;margin:0;font-weight:600}.confirm-notice{flex-direction:column;align-items:flex-start;gap:.5rem;display:flex}.confirm-notice p{margin:0}.button-link{text-align:center;display:inline-block}.button-link:hover{text-decoration:none}.topbar{background:var(--surface);border-bottom:1px solid var(--rule);z-index:20;align-items:center;gap:1.5rem;padding:.8rem 1.4rem;display:flex;position:sticky;top:0}.topbar .brand{font-size:var(--fs-display)}.nav{flex:1;gap:.2rem;display:flex}.nav a{color:var(--muted);border-radius:var(--radius-sm);font-size:var(--fs-body);transition:background var(--step) ease, color var(--step) ease;padding:.4rem .7rem}.nav a:hover{background:var(--paper);color:var(--ink);text-decoration:none}.nav a.active{color:var(--ink);background:var(--paper);font-weight:600}.account{align-items:center;gap:.8rem;display:flex}.content{max-width:680px;margin:0 auto;padding:2rem 1.4rem 5rem}.tabbar{display:none}.account-mobile{display:none;position:relative}.icon-btn{border-radius:var(--radius-sm);width:40px;height:40px;color:var(--muted);transition:background var(--step) ease, color var(--step) ease;justify-content:center;align-items:center;display:inline-flex}.icon-btn:hover{background:var(--paper);color:var(--ink)}.account-menu{z-index:40;background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius-md);flex-direction:column;gap:.1rem;min-width:190px;padding:.35rem;display:flex;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 8px 28px oklch(20% .02 255/.14)}.account-menu-email{border-bottom:1px solid var(--rule);text-overflow:ellipsis;white-space:nowrap;margin-bottom:.25rem;padding:.4rem .55rem .5rem;overflow:hidden}.account-menu a,.account-menu button{text-align:left;border-radius:var(--radius-sm);width:100%;color:var(--ink);font-size:var(--fs-body);background:0 0;padding:.55rem;display:block}.account-menu a:hover,.account-menu button:hover{background:var(--paper);text-decoration:none}.feed-header{justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:1.4rem;display:flex}.feed-header h2{font-family:var(--font-serif);font-weight:600;font-size:var(--fs-display);margin:0}.counter{color:var(--muted);font-size:var(--fs-label);font-variant-numeric:tabular-nums;white-space:nowrap}.empty{text-align:center;padding:3.5rem 1rem}.empty .big{margin-bottom:.5rem}.item{border-bottom:1px solid var(--rule);gap:1.1rem;padding:1.25rem 0;display:flex}.item:first-child{padding-top:0}.item.compact{padding:1rem 0}.thumb{aspect-ratio:16/9;border-radius:var(--radius-sm);background:var(--rule);flex-shrink:0;width:160px;position:relative;overflow:hidden}.thumb.small{width:116px}.thumb img{object-fit:cover;width:100%;height:100%;display:block}.badge.duration{background:var(--scrim);color:#fff;font-size:var(--fs-label);border-radius:var(--radius-sm);font-variant-numeric:tabular-nums;padding:1px 6px;position:absolute;bottom:6px;right:6px}.item-body{flex-direction:column;flex:1;gap:.45rem;min-width:0;display:flex}.item-meta{font-size:var(--fs-label);letter-spacing:.01em;color:var(--muted);flex-wrap:wrap;align-items:center;gap:.4rem;font-weight:500;display:flex}.item-meta .duration{font-variant-numeric:tabular-nums}.item-title{font-family:var(--font-serif);color:var(--ink);font-weight:600;font-size:var(--fs-headline);text-wrap:balance;line-height:1.3}.item-title:hover{color:var(--accent);text-decoration:none}.pill{font-size:var(--fs-label);letter-spacing:.02em;background:var(--paper);border:1px solid var(--rule);color:var(--muted);border-radius:999px;padding:0 7px}.actions{opacity:0;transition:opacity var(--step) ease;flex-wrap:wrap;gap:.4rem;margin-top:.25rem;display:flex}.item:hover .actions,.item:focus-within .actions{opacity:1}@media (hover:none){.actions{opacity:1}}.chip{border:1px solid var(--rule);background:var(--surface);font-size:var(--fs-label);color:var(--muted);transition:border-color var(--step) ease, color var(--step) ease, background var(--step) ease;border-radius:999px;padding:.3rem .65rem}.chip:hover{border-color:var(--accent);color:var(--ink)}.chip.on{background:var(--accent);color:var(--accent-contrast);border-color:var(--accent)}.chip.danger:hover{border-color:var(--danger);color:var(--danger)}.sources h2,.archive h2,.settings h2{font-family:var(--font-serif);font-weight:600;font-size:var(--fs-display)}.add-source{flex-direction:column;gap:.7rem;margin-bottom:1.8rem;display:flex}.row{gap:.6rem;display:flex}.row input{flex:1}.preview,.sub{align-items:center;gap:.8rem;display:flex}.preview{border-top:1px solid var(--rule);padding-top:.9rem}.grow{flex:1;align-items:center;gap:.5rem;min-width:0;display:flex}.grow strong{font-family:var(--font-serif);font-weight:600}.avatar{object-fit:cover;border-radius:50%;flex-shrink:0;width:40px;height:40px}.checkbox{color:var(--ink);flex-direction:row;align-items:center;gap:.4rem;font-weight:400}.sources-search{margin-bottom:.5rem}.sub-list{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.sub-list .sub{border-bottom:1px solid var(--rule);padding:.9rem 0}.sub-list .sub:last-child{border-bottom:none}.sub .grow{flex-direction:column;align-items:flex-start;gap:.25rem}.sub strong{font-family:var(--font-serif);font-weight:600;font-size:var(--fs-headline)}.filters{flex-direction:column;gap:.8rem;margin:1.2rem 0 1.4rem;display:flex}.tag-filters,.tag-row,.suggestions{flex-wrap:wrap;gap:.4rem;display:flex}.tag-row{margin-top:.35rem}.tag{background:var(--paper);border:1px solid var(--rule);font-size:var(--fs-label);border-radius:999px;align-items:center;gap:.3rem;padding:2px 9px;display:inline-flex}.tag.static{color:var(--muted)}.tag button{color:var(--muted);font-size:var(--fs-body);line-height:1}.modal-backdrop{z-index:40;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:oklch(20% .02 255/.4);place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.modal{width:100%;max-width:420px;box-shadow:var(--shadow-modal);flex-direction:column;gap:.9rem;display:flex}.modal h3{font-family:var(--font-serif);font-weight:600;font-size:var(--fs-title);margin:0}.taginput{border:1px solid var(--rule);border-radius:var(--radius-sm);flex-wrap:wrap;align-items:center;gap:.35rem;padding:.4rem;display:flex}.taginput:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring)}.taginput input{border:none;flex:1;min-width:120px;padding:.2rem}.taginput input:focus{box-shadow:none}.modal-actions{justify-content:flex-end;align-items:center;gap:.6rem;display:flex}.modal .link-url{margin-bottom:.2rem}.add-link{gap:.6rem;margin-bottom:1.4rem;display:flex}.add-link input{flex:1}.header-actions{flex-shrink:0;gap:.4rem;display:flex}.filters .sort{flex-direction:row;align-items:center;gap:.5rem}.filters .sort select{width:auto}.excerpt{font-family:var(--font-serif);font-size:var(--fs-body);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:.1rem 0 0;line-height:1.4;display:-webkit-box;overflow:hidden}textarea{font:inherit;border:1px solid var(--rule);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);resize:vertical;width:100%;transition:border-color var(--step) ease, box-shadow var(--step) ease;padding:.5rem .6rem;line-height:1.4}textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring);outline:none}.note{text-align:left;font-size:var(--fs-body);color:var(--muted);border-left:2px solid var(--rule);align-self:flex-start;padding:.05rem .55rem;line-height:1.4}.note:hover{color:var(--ink);border-color:var(--accent);text-decoration:none}.note-add{opacity:0;transition:opacity var(--step) ease;align-self:flex-start}.item:hover .note-add,.item:focus-within .note-add{opacity:1}@media (hover:none){.note-add{opacity:1}}.note-edit{flex-direction:column;align-self:stretch;gap:.4rem;display:flex}.note-actions{justify-content:flex-end;align-items:center;gap:.5rem;display:flex}.tag-manage{flex-direction:column;max-height:50vh;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.tag-manage li{border-bottom:1px solid var(--rule);justify-content:space-between;align-items:center;gap:.8rem;padding:.5rem 0;display:flex}.tag-manage li:last-child{border-bottom:none}.tag-manage li input{flex:1;width:auto}.row-actions{flex-shrink:0;gap:.3rem;display:flex}.settings .card{flex-direction:column;gap:.9rem;margin-bottom:1rem;display:flex}@media (width<=820px){.topbar{justify-content:space-between;gap:.8rem;padding:.7rem 1rem}.nav,.account{display:none}.account-mobile{display:flex}.tabbar{z-index:30;background:var(--surface);border-top:1px solid var(--rule);padding-bottom:env(safe-area-inset-bottom);display:flex;position:fixed;bottom:0;left:0;right:0}.tab{min-height:54px;color:var(--muted);font-size:var(--fs-label);letter-spacing:.01em;transition:color var(--step) ease;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:3px;padding:.45rem .25rem;font-weight:500;display:flex}.tab:hover{text-decoration:none}.tab svg{width:24px;height:24px}.tab.active{color:var(--accent)}.content{padding:1.6rem 1.1rem calc(76px + env(safe-area-inset-bottom))}}@media (width<=640px){.thumb{width:116px}.thumb.small{width:92px}.content{padding-left:1rem;padding-right:1rem}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}
