@tailwind base;@tailwind components;@tailwind utilities;:root{color-scheme:dark;font-family:"Noto Serif SC",serif;--icon-color: #dbeafe;--icon-hover: #fff;--glow-color: rgba(255, 255, 255, .25)}*{box-sizing:border-box}html,body,#app{width:100%;min-height:100%;margin:0}body{overflow:hidden;background:#101820;color:#fff}button,input,select{font:inherit}button,a,select,input{-webkit-tap-highlight-color:transparent}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid rgba(255,255,255,.95);outline-offset:4px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;z-index:100;top:1rem;left:1rem;padding:.7rem 1rem;color:#17202a;background:#fff;border-radius:999px;transform:translateY(-180%);transition:transform .2s}.skip-link:focus{transform:translateY(0)}.hero{position:relative;min-height:100vh;min-height:100dvh;overflow:hidden;isolation:isolate}.hero__backdrop,.hero__gradient,.hero__vignette,.hero__rain,.wallpaper-transition{position:absolute;inset:0}.hero__backdrop,.wallpaper-transition{background-position:center;background-size:cover}.hero__backdrop{z-index:-5;transform:scale(1.008);animation:heroReveal 1.8s cubic-bezier(.2,.75,.25,1) both}.hero__gradient{z-index:-4;background:linear-gradient(to bottom,rgba(4,9,17,.18),transparent 32%,transparent 67%,rgba(3,8,15,.48))}.hero__vignette{z-index:-3;background:radial-gradient(ellipse at center,transparent 48%,rgba(2,7,13,.2) 100%);pointer-events:none}.hero__rain{z-index:-2;width:100%;height:100%;opacity:.5;mix-blend-mode:screen;pointer-events:none}.wallpaper-transition{z-index:-1;opacity:0;filter:blur(18px);transform:scale(1.05);transition:opacity .7s ease,transform .7s ease;pointer-events:none}.wallpaper-transition.is-visible{opacity:1;transform:scale(1)}.hero__content{width:min(100% - 3rem,92rem);min-height:100dvh;margin:0 auto;padding:max(3rem,env(safe-area-inset-top)) 0 max(1.75rem,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;text-align:center}.brand-button{margin-top:clamp(1.5rem,8.5vh,6.5rem);padding:.5rem;border:0;background:transparent;cursor:pointer;text-shadow:0 3px 24px rgba(0,0,0,.48);animation:contentReveal 1.1s .18s cubic-bezier(.2,.75,.25,1) both;touch-action:manipulation;user-select:none}.brand{display:block;font-size:clamp(2.8rem,6vw,4.75rem);font-weight:300;letter-spacing:.095em;line-height:1}.date-line{margin:1rem 0 0;display:flex;justify-content:center;align-items:center;gap:.55rem;font:400 .68rem/1.4 ui-sans-serif,sans-serif;letter-spacing:.13em;opacity:.66;text-shadow:0 2px 12px rgba(0,0,0,.6);animation:contentReveal 1.1s .28s ease-out both}.quick-search{width:min(82vw,24rem);margin-top:1rem;opacity:0;transform:translateY(-6px);transition:opacity .18s ease,transform .18s ease}.quick-search.is-visible{opacity:1;transform:none}.quick-search__form{height:2.75rem;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.7rem;padding:0 .9rem;border:1px solid rgba(255,255,255,.24);border-radius:.85rem;background:#08101933;box-shadow:0 10px 30px #0000001f;backdrop-filter:blur(12px)}.quick-search__icon{width:1rem;height:1rem;display:grid;opacity:.72}.quick-search__icon svg{width:100%;fill:none;stroke:currentColor;stroke-width:1.5}.quick-search input{min-width:0;border:0;outline:0;color:inherit;background:transparent;font:400 .78rem/1 ui-sans-serif,sans-serif;letter-spacing:.04em}.quick-search input::placeholder{color:#ffffff94}.quick-search input::-webkit-search-cancel-button{filter:invert(1);opacity:.55}.quote{min-height:1.6rem;margin:clamp(1.25rem,3.2vh,2.5rem) 0 0;display:flex;gap:.8rem;align-items:center;font-size:clamp(.72rem,1vw,.88rem);letter-spacing:.1em;opacity:.74;text-shadow:0 2px 16px rgba(0,0,0,.66);transition:opacity .45s,transform .45s;animation:contentReveal 1.1s .38s ease-out both}.quote i{width:1.8rem;height:1px;background:currentColor;opacity:.4}.quote.is-changing{opacity:0;transform:translateY(-5px)}.bookmark-rail{width:100%;margin-top:auto;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;scrollbar-width:none;mask-image:linear-gradient(to right,transparent,#000 2rem,#000 calc(100% - 2rem),transparent);animation:contentReveal 1.15s .55s ease-out both}.bookmark-rail::-webkit-scrollbar{display:none}.bookmarks{width:max-content;min-width:100%;padding:1.5rem 2.5rem .5rem;display:flex;justify-content:center;gap:clamp(.7rem,1.6vw,1.45rem)}.bookmark{position:relative;min-width:0;display:flex;justify-content:center;border:0;background:transparent}.bookmark__link,.bookmark--add{width:4.35rem;min-width:0;display:flex;flex-direction:column;align-items:center;gap:.65rem;border:0;color:inherit;text-decoration:none;cursor:pointer;scroll-snap-align:center}.bookmark__icon{width:2.8rem;height:2.8rem;display:grid;place-items:center;border:1px solid rgba(255,255,255,.17);border-radius:.85rem;background:#08101929;box-shadow:0 8px 26px #0000001f;backdrop-filter:blur(9px);color:var(--icon-color);font-family:ui-sans-serif,sans-serif;transition:transform .3s cubic-bezier(.2,.75,.25,1),border-color .3s,background .3s,color .3s,box-shadow .3s}.bookmark__link:hover .bookmark__icon,.bookmark--add:hover .bookmark__icon{transform:translateY(-5px);border-color:#ffffff80;background:#ffffff1a;color:var(--icon-hover);box-shadow:0 13px 34px var(--glow-color)}.bookmark__icon img,.bookmark__mask{width:1.65rem;height:1.65rem;object-fit:contain}.bookmark__mask{display:block;background:currentColor;mask-position:center;mask-repeat:no-repeat;mask-size:contain}.bookmark__label{max-width:4.35rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:ui-sans-serif,sans-serif;font-size:.62rem;letter-spacing:.07em;opacity:.72;text-shadow:0 2px 10px rgba(0,0,0,.72)}.bookmark__actions{position:absolute;top:-.55rem;right:.15rem;display:flex;gap:.2rem;opacity:0;transform:translateY(3px);transition:opacity .2s,transform .2s}.bookmark:hover .bookmark__actions,.bookmark:focus-within .bookmark__actions{opacity:1;transform:none}.bookmark__action{width:1.4rem;height:1.4rem;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.25);border-radius:50%;background:#091019b8;cursor:pointer;font-family:ui-sans-serif,sans-serif;font-size:.72rem}.bookmark__action--remove:hover{background:#a73030}.icon-button{width:2.75rem;height:2.75rem;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.22);border-radius:50%;background:#0a121c47;backdrop-filter:blur(14px);cursor:pointer}.icon-button svg{width:1.25rem;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5}.sync-button{position:absolute;z-index:5;top:max(1rem,env(safe-area-inset-top));right:max(1rem,env(safe-area-inset-right))}.sync-button img{width:100%;height:100%;border-radius:50%;object-fit:cover}.sync-button[data-state=sync_loading]{animation:breathe 1.4s infinite}.sync-button[data-state=sync_error],.sync-button[data-state=offline]{border-color:#fca5a5}.dialog[hidden]{display:none}.dialog{position:fixed;z-index:30;inset:0;padding:max(1rem,env(safe-area-inset-top)) 1rem max(1rem,env(safe-area-inset-bottom));display:grid;place-items:center;overflow-y:auto;background:#04080e7a;backdrop-filter:blur(10px);opacity:0;transition:opacity .2s}.dialog.is-open{opacity:1}.dialog__panel{width:min(100%,30rem);max-height:calc(100dvh - 2rem);overflow-y:auto;padding:clamp(1.25rem,4vw,2rem);border:1px solid rgba(255,255,255,.5);border-radius:1.5rem;background:#f1f5f9f0;box-shadow:0 28px 80px #00000052;color:#243141;transform:scale(.96) translateY(8px);transition:transform .2s}.dialog.is-open .dialog__panel{transform:none}.dialog__panel--wide{width:min(100%,58rem)}.dialog__header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.4rem}.dialog__header h2{margin:.15rem 0 0;font-size:1.55rem;font-weight:400}.eyebrow{margin:0;color:#64748b;font:600 .62rem/1.2 ui-sans-serif,sans-serif;letter-spacing:.2em}.dialog__close{flex:none;width:2.25rem;height:2.25rem;color:#475569;background:transparent;border-color:#cbd5e1;font:300 1.5rem/1 ui-sans-serif,sans-serif}.setting-row{min-height:3rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;border-top:1px solid #dbe2ea;color:#475569;font-family:ui-sans-serif,sans-serif;font-size:.82rem}.setting-row select,.setting-row input{accent-color:#334155}.setting-row select{padding:.4rem .65rem;border:1px solid #cbd5e1;border-radius:.55rem;color:#334155;background:#fff}.wallpaper-grid{margin-top:1.2rem;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem}.wallpaper-choice{min-width:0;padding:0;overflow:hidden;border:2px solid transparent;border-radius:.8rem;background:#e2e8f0;color:#334155;cursor:pointer}.wallpaper-choice[aria-pressed=true]{border-color:#334155}.wallpaper-choice img{width:100%;aspect-ratio:16/10;display:block;object-fit:cover}.wallpaper-choice span{display:block;padding:.55rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:.68rem ui-sans-serif,sans-serif}.bookmark-form{display:grid;gap:1rem}.icon-preview{width:4.5rem;height:4.5rem;margin:0 auto .5rem;display:grid;place-items:center;border:1px solid #cbd5e1;border-radius:1rem;color:#64748b;background:#fff}.icon-preview img,.icon-preview .bookmark__mask{width:2.6rem;height:2.6rem;object-fit:contain}.metadata-status{min-height:1rem;margin:-.45rem 0 0;color:#64748b;font:.7rem/1.4 ui-sans-serif,sans-serif;text-align:center}.field{display:grid;gap:.45rem;color:#64748b;font:.72rem ui-sans-serif,sans-serif;letter-spacing:.08em;text-transform:uppercase}.field input{width:100%;padding:.85rem 1rem;border:1px solid #cbd5e1;border-radius:.7rem;color:#1e293b;background:#fff;font-size:.9rem;letter-spacing:normal;text-transform:none}.form-error{min-height:1.1rem;margin:0;color:#b42318;font:.75rem ui-sans-serif,sans-serif}.dialog__actions{display:flex;gap:.7rem;justify-content:flex-end}.button{padding:.75rem 1.25rem;border:1px solid #334155;border-radius:.7rem;color:#fff;background:#334155;cursor:pointer;font:.75rem ui-sans-serif,sans-serif}.button--secondary{color:#475569;border-color:#cbd5e1;background:transparent}.status-toast{position:fixed;z-index:40;left:50%;bottom:max(1.25rem,env(safe-area-inset-bottom));margin:0;padding:.65rem 1rem;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:#080f18c7;backdrop-filter:blur(12px);font:.72rem ui-sans-serif,sans-serif;opacity:0;transform:translate(-50%,8px);pointer-events:none;transition:opacity .2s,transform .2s}.status-toast.is-visible{opacity:1;transform:translate(-50%)}.dialog-open{overflow:hidden}@media(min-width:900px){.bookmark-rail{width:min(calc(100vw - 3rem),132rem);overflow:visible;overscroll-behavior-inline:auto;scroll-snap-type:none;mask-image:none;-webkit-mask-image:none}.bookmarks{width:100%;min-width:0;padding:1.2rem 1rem .5rem;flex-wrap:wrap;align-content:flex-end;gap:.9rem clamp(.5rem,.7vw,.85rem)}.bookmark{flex:0 0 4rem}.bookmark__link,.bookmark--add{width:4rem;scroll-snap-align:none}.bookmark__label{max-width:4rem}}@media(max-width:640px){.hero__content{width:100%;padding-inline:.75rem}.brand-button{margin-top:11vh}.date-line{margin-top:.8rem;font-size:.63rem}.quick-search{width:min(86vw,22rem)}.quote{flex-direction:column;gap:.25rem}.quote i{width:1px;height:.8rem}.bookmark-rail{width:calc(100% + 1.5rem);margin-inline:-.75rem;mask-image:linear-gradient(to right,transparent,#000 1rem,#000 calc(100% - 1rem),transparent)}.bookmarks{justify-content:flex-start;gap:.6rem;padding:1.25rem 1.5rem max(.35rem,env(safe-area-inset-bottom))}.bookmark__actions{top:-.6rem;right:-.1rem;opacity:1}.bookmark__action{width:1.5rem;height:1.5rem}.wallpaper-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.hero__rain{display:none}}@keyframes heroReveal{0%{opacity:0;transform:scale(1.04);filter:saturate(.72) brightness(.8)}to{opacity:1;transform:scale(1.008);filter:saturate(1) brightness(1)}}@keyframes contentReveal{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes breathe{50%{opacity:.5;transform:scale(.96)}}
