@import"https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap";:root{--color-cream: #fef9f3;--color-cream-dark: #f5ebe0;--color-coral: #e8a598;--color-coral-dark: #d48476;--color-teal: #7ec8c4;--color-teal-dark: #5ba8a4;--color-mint: #b8e0d8;--color-sky: #a8d4f0;--color-text: #2d2a26;--color-text-muted: #6b6560;--color-white: #ffffff;--color-overlay: rgba(45, 42, 38, .4);--color-primary: var(--color-coral);--color-primary-hover: var(--color-coral-dark);--color-secondary: var(--color-teal);--color-secondary-hover: var(--color-teal-dark);--color-background: var(--color-cream);--color-surface: var(--color-white);--color-border: var(--color-cream-dark);--font-sans: "Nunito", "Quicksand", system-ui, sans-serif;--font-size-xs: .875rem;--font-size-sm: 1rem;--font-size-base: 1.125rem;--font-size-lg: 1.375rem;--font-size-xl: 1.75rem;--font-size-2xl: 2.25rem;--font-size-3xl: 2.75rem;--font-weight-regular: 400;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.6;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--touch-min: 44px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-full: 9999px;--safe-area-inset-top: env(safe-area-inset-top, 0);--safe-area-inset-bottom: env(safe-area-inset-bottom, 0);--safe-area-inset-left: env(safe-area-inset-left, 0);--safe-area-inset-right: env(safe-area-inset-right, 0);--duration-fast: .15s;--duration-normal: .25s;--ease-out: cubic-bezier(.33, 1, .68, 1)}@media(prefers-reduced-motion:reduce){:root{--duration-fast: 0ms;--duration-normal: 0ms}}*,*:before,*:after{box-sizing:border-box}html{font-family:var(--font-sans);font-size:16px;line-height:var(--line-height-normal);color:var(--color-text);background-color:var(--color-background);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh;min-height:100dvh}#root{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}a{color:var(--color-secondary);text-decoration:none}a:hover{color:var(--color-secondary-hover)}a:focus-visible{outline:2px solid var(--color-teal);outline-offset:2px}button{font-family:inherit;cursor:pointer}button:focus-visible{outline:2px solid var(--color-teal);outline-offset:2px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.bottom-nav{position:fixed;bottom:0;left:0;right:0;background-color:var(--color-surface);border-top:1px solid var(--color-border);z-index:100}.bottom-nav__list{display:flex;justify-content:space-around;align-items:center;list-style:none;margin:0;padding:var(--space-2) var(--space-2) var(--space-4);gap:var(--space-1)}.bottom-nav__link{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:var(--touch-min);min-height:var(--touch-min);padding:var(--space-1) var(--space-2);color:var(--color-text-muted);text-decoration:none;border-radius:var(--radius-md);transition:color var(--duration-fast),background-color var(--duration-fast);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold)}.bottom-nav__link:hover{color:var(--color-text);background-color:var(--color-cream-dark)}.bottom-nav__link--active{color:var(--color-secondary)}.bottom-nav__link--active:hover{color:var(--color-secondary-hover)}.bottom-nav__label{margin-top:var(--space-1)}.layout{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh}.layout__skip{position:absolute;top:-100px;left:var(--space-4);z-index:1000;padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text);background-color:var(--color-surface);border-radius:var(--radius-md);box-shadow:0 2px 8px #2d2a2626;transition:top var(--duration-fast)}.layout__skip:focus{top:var(--space-4);outline:2px solid var(--color-teal);outline-offset:2px}.layout__main{flex:1;padding:var(--space-4);padding-top:calc(var(--space-4) + var(--safe-area-inset-top));padding-bottom:calc(var(--space-2) + var(--touch-min) + var(--space-1) + 1.25rem + var(--space-4) + var(--safe-area-inset-bottom));max-width:480px;margin:0 auto;width:100%}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--touch-min);padding:var(--space-2) var(--space-4);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);border:none;border-radius:var(--radius-lg);transition:background-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out)}.btn:active{transform:scale(.98)}.btn--primary{background-color:var(--color-primary);color:var(--color-text)}.btn--primary:hover{background-color:var(--color-primary-hover)}.btn--secondary{background-color:var(--color-secondary);color:var(--color-text)}.btn--secondary:hover{background-color:var(--color-secondary-hover)}.btn--ghost{background-color:transparent;color:var(--color-text)}.btn--ghost:hover{background-color:var(--color-cream-dark)}.btn--sm{min-height:36px;padding:var(--space-1) var(--space-3);font-size:var(--font-size-sm)}.btn--lg{min-height:52px;padding:var(--space-3) var(--space-6);font-size:var(--font-size-lg)}.btn--full{width:100%}.btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.card{background-color:var(--color-surface);border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 2px 8px #2d2a260f;transition:box-shadow var(--duration-normal) var(--ease-out),transform var(--duration-normal) var(--ease-out)}.card--interactive{cursor:pointer}.card--interactive:hover{box-shadow:0 4px 16px #2d2a261a}.card--interactive:active{transform:scale(.99)}.card--interactive:focus-visible{outline:2px solid var(--color-teal);outline-offset:2px}.card__image-wrap{aspect-ratio:16 / 10;overflow:hidden;background-color:var(--color-cream-dark);position:relative}.card__image-skeleton{position:absolute;inset:0;background:linear-gradient(90deg,#2d2a260f,#2d2a261f 20%,#2d2a260f 40% 100%);background-size:200% 100%;animation:card-skeleton-shimmer 1.15s linear infinite;pointer-events:none}.card__image-skeleton--hidden{opacity:0;animation:none;transition:opacity var(--duration-fast) var(--ease-out)}.card__image{width:100%;height:100%;object-fit:cover;display:block;opacity:0;transition:opacity var(--duration-fast) var(--ease-out)}.card__image--loaded{opacity:1}@keyframes card-skeleton-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.card__title{margin:0;padding:var(--space-3) var(--space-4) var(--space-1);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);color:var(--color-text)}.card__description{margin:0;padding:0 var(--space-4) var(--space-4);font-size:var(--font-size-sm);line-height:var(--line-height-relaxed);color:var(--color-text-muted)}.mascot{display:inline-flex;align-items:center;justify-content:center;color:var(--color-coral);transition:transform var(--duration-normal) var(--ease-out)}.mascot__icon{display:block}.mascot--sm .mascot__icon{width:32px;height:32px}.mascot--md .mascot__icon{width:44px;height:44px}.mascot--lg .mascot__icon{width:56px;height:56px}@media(prefers-reduced-motion:no-preference){.mascot--happy{animation:mascot-bounce .6s var(--ease-out) 1}.mascot--wave{animation:mascot-wave 1s var(--ease-out) 1}}@keyframes mascot-bounce{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}@keyframes mascot-wave{0%,to{transform:rotate(0)}25%{transform:rotate(-12deg)}75%{transform:rotate(12deg)}}.home__hero{position:relative;text-align:center;padding:var(--space-8) var(--space-4) var(--space-10);margin:calc(-1 * var(--space-4)) calc(-1 * var(--space-4)) var(--space-8);overflow:hidden}.home__hero-bg{position:absolute;inset:0;background:radial-gradient(ellipse 120% 80% at 50% 0%,var(--color-mint) 0%,var(--color-sky) 35%,transparent 65%),radial-gradient(circle 60% at 85% 20%,var(--color-coral) 0%,transparent 50%),radial-gradient(circle 50% at 15% 60%,var(--color-teal) 0%,transparent 45%);opacity:.5;pointer-events:none}.home__greeting{position:relative;margin:0 0 var(--space-2);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-muted)}.home__brand{position:relative;display:flex;align-items:center;justify-content:center;gap:var(--space-3);margin-bottom:var(--space-2)}.home__brand .mascot{flex-shrink:0}.home__brand .mascot__icon{width:var(--font-size-3xl);height:var(--font-size-3xl)}.home__title{position:relative;margin:0;font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-text);letter-spacing:-.02em;line-height:var(--line-height-tight)}.home__tagline{position:relative;margin:0;font-size:var(--font-size-base);color:var(--color-text-muted);line-height:var(--line-height-relaxed)}.home__progress-strip{margin-bottom:var(--space-6)}.home__progress-link{display:block;padding:var(--space-3) var(--space-4);background:linear-gradient(135deg,var(--color-mint) 0%,var(--color-sky) 100%);border-radius:var(--radius-lg);text-decoration:none;color:var(--color-text);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);box-shadow:0 2px 8px #2d2a260f;transition:box-shadow var(--duration-normal) var(--ease-out),transform var(--duration-fast) var(--ease-out)}.home__progress-link:hover{box-shadow:0 4px 12px #2d2a2614}.home__progress-link:active{transform:scale(.99)}.home__progress-text{display:block}.home__section{margin-bottom:var(--space-8)}.home__section-title{margin:0 0 var(--space-4);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text)}.home__card-grid{display:flex;flex-direction:column;gap:var(--space-4);margin-bottom:var(--space-6)}.home__card-link{text-decoration:none;color:inherit}.home__cta-row{display:flex;flex-direction:column;gap:var(--space-3)}.home__cta{display:block;text-decoration:none}.home__cta--primary{order:-1}.feed{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-4)}.feed__link{text-decoration:none;color:inherit;display:block}.feed--empty{padding:var(--space-8);text-align:center}.feed__empty-text{margin:0;font-size:var(--font-size-base);color:var(--color-text-muted);max-width:280px;margin-inline:auto}.discover__header{margin-bottom:var(--space-6)}.discover__icon{color:var(--color-teal);margin-bottom:var(--space-2)}.discover__title{margin:0 0 var(--space-1);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text)}.discover__subtitle{margin:0;font-size:var(--font-size-sm);color:var(--color-text-muted)}.discover__filters{margin-bottom:var(--space-6);overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;margin-left:calc(-1 * var(--space-4));margin-right:calc(-1 * var(--space-4));padding-left:var(--space-4);padding-right:var(--space-4)}.discover__topic-pills{display:flex;flex-wrap:nowrap;gap:var(--space-2);width:max-content}.discover__pill{min-height:var(--touch-min);padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);font-family:var(--font-sans);color:var(--color-text-muted);background-color:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-full);cursor:pointer;transition:background-color var(--duration-fast),color var(--duration-fast),border-color var(--duration-fast)}.discover__pill:hover{color:var(--color-text);background-color:var(--color-cream-dark);border-color:var(--color-teal)}.discover__pill--active{color:var(--color-text);background-color:var(--color-teal);border-color:var(--color-teal)}.discover__pill--active:hover{background-color:var(--color-teal-dark);border-color:var(--color-teal-dark)}.discover__feed{margin-top:var(--space-4)}.my-shelf__header{margin-bottom:var(--space-6)}.my-shelf__icon{color:var(--color-teal);margin-bottom:var(--space-2)}.my-shelf__title{margin:0 0 var(--space-1);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text)}.my-shelf__subtitle{margin:0;font-size:var(--font-size-sm);color:var(--color-text-muted)}.my-shelf__collections{display:flex;flex-direction:column;gap:var(--space-8)}.my-shelf__collection-title{margin:0 0 var(--space-4);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text)}.my-shelf__card-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-4)}.my-shelf__link{text-decoration:none;color:inherit;display:block}.my-shelf__empty{margin:0;padding:var(--space-4);font-size:var(--font-size-sm);color:var(--color-text-muted);background-color:var(--color-cream-dark);border-radius:var(--radius-md)}.progress-page__header{margin-bottom:var(--space-6)}.progress-page__icon{color:var(--color-teal);margin-bottom:var(--space-2)}.progress-page__title{margin:0 0 var(--space-1);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text)}.progress-page__subtitle{margin:0;font-size:var(--font-size-sm);color:var(--color-text-muted)}.progress-page__section-title{margin:0 0 var(--space-3);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text)}.progress-page__daily{margin-bottom:var(--space-8)}.progress-page__daily-card{background-color:var(--color-surface);border-radius:var(--radius-lg);padding:var(--space-4);box-shadow:0 2px 8px #2d2a260f}.progress-page__daily-row{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3)}.progress-page__check{color:var(--color-text-muted);flex-shrink:0}.progress-page__check--done{color:var(--color-teal);flex-shrink:0}.progress-page__daily-text{flex:1}.progress-page__daily-count{margin:0;font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text)}.progress-page__daily-label{margin:var(--space-1) 0 0;font-size:var(--font-size-sm);color:var(--color-text-muted)}.progress-page__daily-bar{height:8px;background-color:var(--color-cream-dark);border-radius:var(--radius-full);overflow:hidden}.progress-page__daily-fill{height:100%;background-color:var(--color-teal);border-radius:var(--radius-full);transition:width var(--duration-normal) var(--ease-out)}.progress-page__streak{margin-bottom:var(--space-8)}.progress-page__streak-card{background:linear-gradient(135deg,var(--color-coral) 0%,var(--color-coral-dark) 100%);border-radius:var(--radius-lg);padding:var(--space-6);text-align:center;color:var(--color-text)}.progress-page__flame{color:var(--color-white);opacity:.95;margin-bottom:var(--space-2)}.progress-page__streak-count{margin:0;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold)}.progress-page__streak-label{margin:var(--space-1) 0 0;font-size:var(--font-size-sm);opacity:.9}.progress-page__badges{margin-bottom:var(--space-8)}.progress-page__badge-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-3)}.progress-page__badge{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-4);background-color:var(--color-surface);border-radius:var(--radius-md);box-shadow:0 2px 8px #2d2a260f;opacity:.7}.progress-page__badge--earned{opacity:1;border:2px solid var(--color-teal)}.progress-page__badge-icon{font-size:2rem;line-height:1;flex-shrink:0}.progress-page__badge-info{flex:1;min-width:0}.progress-page__badge-name{margin:0;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text)}.progress-page__badge-desc{margin:var(--space-1) 0 0;font-size:var(--font-size-xs);color:var(--color-text-muted)}.progress-page__badge-lock{font-size:var(--font-size-xs);color:var(--color-text-muted);flex-shrink:0}.progress-page__celebration{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;background-color:var(--color-overlay);animation:progress-page-fadeIn var(--duration-normal) var(--ease-out)}.progress-page__celebration-inner{background-color:var(--color-surface);border-radius:var(--radius-xl);padding:var(--space-8);text-align:center;box-shadow:0 8px 32px #2d2a2633;animation:progress-page-pop var(--duration-normal) var(--ease-out)}.progress-page__celebration-star{color:var(--color-coral);margin-bottom:var(--space-4)}.progress-page__celebration-text{margin:0;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text)}.progress-page__celebration-sub{margin:var(--space-2) 0 0;font-size:var(--font-size-base);color:var(--color-text-muted)}@keyframes progress-page-fadeIn{0%{opacity:0}to{opacity:1}}@keyframes progress-page-pop{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.settings{padding:var(--space-4);padding-bottom:calc(var(--space-12) + var(--safe-area-inset-bottom));max-width:480px;margin:0 auto}.settings__header{margin-bottom:var(--space-8)}.settings__title{margin:0 0 var(--space-1);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);letter-spacing:-.02em;line-height:var(--line-height-tight)}.settings__subtitle{margin:0;font-size:var(--font-size-sm);color:var(--color-text-muted);line-height:var(--line-height-normal)}.settings__section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);margin-bottom:var(--space-6);box-shadow:0 1px 3px #2d2a260f}.settings__section-title{display:flex;align-items:center;gap:var(--space-2);margin:0 0 var(--space-4);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text)}.settings__section-title .settings__section-icon{color:var(--color-teal);flex-shrink:0}.settings__row{margin-bottom:var(--space-4)}.settings__row:last-child{margin-bottom:0}.settings__label{display:block;margin-bottom:var(--space-2);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text)}.settings__hint{margin:var(--space-1) 0 0;font-size:var(--font-size-xs);color:var(--color-text-muted)}.settings__range-wrap{margin-top:var(--space-2);padding:0 var(--space-3)}.settings__range-value{display:block;margin-bottom:var(--space-2);font-size:var(--font-size-base);font-weight:var(--font-weight-bold);color:var(--color-teal)}.settings__range{display:block;width:100%;min-height:var(--touch-min);box-sizing:border-box;-webkit-appearance:none;appearance:none;background:transparent;outline:none}.settings__range::-webkit-slider-runnable-track{height:16px;background:var(--color-cream-dark);border:1px solid var(--color-border);border-radius:var(--radius-full)}.settings__range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:28px;height:28px;margin-top:-6px;border-radius:50%;background:var(--color-teal);border:3px solid var(--color-white);box-shadow:0 2px 6px #2d2a2633;cursor:pointer;transition:transform var(--duration-fast) var(--ease-out)}.settings__range::-webkit-slider-thumb:hover{transform:scale(1.08)}.settings__range::-moz-range-thumb{width:28px;height:28px;border-radius:50%;background:var(--color-teal);border:3px solid var(--color-white);box-shadow:0 2px 6px #2d2a2633;cursor:pointer;transition:transform var(--duration-fast) var(--ease-out)}.settings__range::-moz-range-track{height:16px;background:var(--color-cream-dark);border:1px solid var(--color-border);border-radius:var(--radius-full)}.settings__range::-moz-focus-outer{border:0}.settings__range::-moz-range-thumb:hover{transform:scale(1.08)}.settings__topic-pills{display:flex;flex-wrap:wrap;gap:var(--space-2)}.settings__pill{min-height:var(--touch-min);padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);font-family:var(--font-sans);color:var(--color-text-muted);background-color:var(--color-cream-dark);border:2px solid var(--color-border);border-radius:var(--radius-full);cursor:pointer;transition:background-color var(--duration-fast),color var(--duration-fast),border-color var(--duration-fast)}.settings__pill:hover{color:var(--color-text);border-color:var(--color-teal);background-color:var(--color-surface)}.settings__pill--active{color:var(--color-text);background-color:var(--color-teal);border-color:var(--color-teal)}.settings__pill--active:hover{background-color:var(--color-teal-dark);border-color:var(--color-teal-dark)}.settings__info-block{padding:var(--space-4);background:var(--color-cream-dark);border-radius:var(--radius-md);border:1px solid var(--color-border)}.settings__info-text{margin:0;font-size:var(--font-size-sm);color:var(--color-text-muted);line-height:var(--line-height-relaxed)}.settings__info-badge{display:inline-block;margin-top:var(--space-2);padding:var(--space-1) var(--space-2);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-teal-dark);background:var(--color-surface);border-radius:var(--radius-sm)}.settings__account-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-3) 0}.settings__account-text{margin:0;font-size:var(--font-size-base);color:var(--color-text);min-width:0}.settings__logout-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--touch-min);min-width:44px;padding:var(--space-2) var(--space-4);flex-shrink:0}@media(max-width:400px){.settings__account-row{flex-direction:column;align-items:stretch;text-align:center}.settings__logout-btn{width:100%}}.read-along{margin-top:var(--space-6);padding:var(--space-4);background-color:var(--color-cream-dark);border-radius:var(--radius-lg)}.read-along__controls{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4);flex-wrap:wrap}.read-along__mode-btn{display:inline-flex;align-items:center;gap:var(--space-2);min-height:var(--touch-min);padding:var(--space-2) var(--space-3)}.read-along__play{min-width:var(--touch-min);min-height:var(--touch-min);padding:var(--space-2)}.read-along__text{font-size:var(--font-size-base);line-height:var(--line-height-relaxed);color:var(--color-text)}.read-along__sentence{transition:background-color var(--duration-normal),color var(--duration-normal)}.read-along__sentence--current{background-color:#7ec8c426;padding:2px;border-radius:4px}.read-along__sentence--done{color:var(--color-text-muted)}.read-along__word{transition:background-color var(--duration-normal),color var(--duration-normal);border-radius:3px;padding:0 2px}.read-along__word--current{background-color:var(--color-teal);color:var(--color-text)}.read-along__unsupported{margin:var(--space-3) 0 0;font-size:var(--font-size-xs);color:var(--color-text-muted)}.content-detail{padding:0}.content-detail__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-4)}.content-detail__back,.content-detail__save{min-width:var(--touch-min);min-height:var(--touch-min);padding:var(--space-2)}.content-detail__save-menu{background-color:var(--color-surface);border-radius:var(--radius-md);padding:var(--space-3);margin-bottom:var(--space-4);box-shadow:0 2px 8px #2d2a2614}.content-detail__save-title{margin:0 0 var(--space-2);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-muted)}.content-detail__save-list{list-style:none;margin:0;padding:0}.content-detail__save-item{display:flex;align-items:center;gap:var(--space-3);min-height:var(--touch-min);width:100%;padding:var(--space-2) var(--space-3);font-size:var(--font-size-base);font-family:var(--font-sans);color:var(--color-text);background:none;border:none;border-radius:var(--radius-sm);cursor:pointer;text-align:left;transition:background-color var(--duration-fast)}.content-detail__save-item:hover{background-color:var(--color-cream-dark)}.content-detail__save-check{display:inline-block;width:20px;height:20px;border:2px solid var(--color-border);border-radius:4px}.content-detail__body{padding:0}.content-detail__body .card__image-wrap{border-radius:var(--radius-md);margin-bottom:var(--space-4)}.content-detail__title{margin:0 0 var(--space-2);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);color:var(--color-text)}.content-detail__meta{margin:0 0 var(--space-4);font-size:var(--font-size-sm);color:var(--color-text-muted)}.content-detail__text{font-size:var(--font-size-base);line-height:var(--line-height-relaxed);color:var(--color-text)}.content-detail__text p{margin:0 0 var(--space-4)}.content-detail__placeholder{margin:var(--space-4) 0;font-size:var(--font-size-base);color:var(--color-text-muted)}.content-detail__finished{margin-top:var(--space-6);padding:var(--space-4);background-color:var(--color-mint);border-radius:var(--radius-lg);text-align:center}.content-detail__mascot{margin-bottom:var(--space-2)}.content-detail__finished-text{margin:0;font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text)}.content-detail__done-btn{margin-top:var(--space-6);width:100%}.login{position:relative;min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:var(--space-4);padding-top:max(var(--space-6),var(--safe-area-inset-top));padding-bottom:max(var(--space-6),var(--safe-area-inset-bottom));overflow-x:hidden}.login__bg{position:fixed;inset:0;background:radial-gradient(ellipse 140% 90% at 50% -20%,var(--color-mint) 0%,var(--color-sky) 30%,rgba(168,212,240,.3) 55%,transparent 70%),radial-gradient(circle 50% at 90% 15%,var(--color-coral) 0%,transparent 45%),radial-gradient(circle 45% at 10% 85%,var(--color-teal) 0%,transparent 40%),var(--color-cream);pointer-events:none}.login__content{position:relative;width:100%;max-width:400px;display:flex;flex-direction:column;align-items:center;gap:var(--space-6)}.login__header{text-align:center}.login__brand{display:flex;align-items:center;justify-content:center;gap:var(--space-3);margin-bottom:var(--space-2)}.login__brand .login__logo{animation:login-logo-in .5s var(--ease-out) forwards}.login__brand .login__logo .mascot__icon{width:var(--font-size-2xl);height:var(--font-size-2xl)}@keyframes login-logo-in{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}@media(prefers-reduced-motion:reduce){.login__brand .login__logo{animation:none}}.login__title{margin:0;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);letter-spacing:-.02em;line-height:var(--line-height-tight)}.login__tagline{margin:0;font-size:var(--font-size-sm);color:var(--color-text-muted)}.login__card{width:100%;padding:var(--space-8);background:var(--color-surface);border-radius:var(--radius-xl);box-shadow:0 4px 24px #2d2a260f,0 1px 3px #2d2a260a;border:1px solid var(--color-border)}.login__card-title{margin:0 0 var(--space-1);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text)}.login__card-sub{margin:0 0 var(--space-6);font-size:var(--font-size-sm);color:var(--color-text-muted)}.login__form{display:flex;flex-direction:column;gap:var(--space-4)}.login__field{display:flex;flex-direction:column;gap:var(--space-2)}.login__label-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}.login__label{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text)}.login__forgot{font-size:var(--font-size-xs);font-weight:var(--font-weight-regular);color:var(--color-secondary);text-decoration:none;background:none;border:none;padding:0;cursor:pointer;font-family:inherit}.login__forgot:hover{color:var(--color-secondary-hover);text-decoration:underline}.login__back-link,.login__back-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);margin-top:var(--space-6);padding:var(--space-2) 0;font-family:var(--font-sans);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-secondary);background:none;border:none;border-radius:var(--radius-md);cursor:pointer;text-decoration:none;transition:color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out)}.login__back-link:hover,.login__back-btn:hover{color:var(--color-secondary-hover)}.login__back-btn{min-height:var(--touch-min);padding:var(--space-3) var(--space-4);width:100%;background:var(--color-cream);border:1px solid var(--color-border);margin-top:var(--space-4)}.login__back-btn:hover{background:var(--color-cream-dark);border-color:var(--color-teal)}.login__forgot-success{text-align:center}.login__forgot-success-icon{display:flex;align-items:center;justify-content:center;width:80px;height:80px;margin:0 auto var(--space-6);color:var(--color-teal);background:linear-gradient(135deg,#7ec8c433,#b8e0d84d);border-radius:var(--radius-full)}.login__forgot-success .login__card-title{margin-bottom:var(--space-2)}.login__forgot-success-text{margin-bottom:0;max-width:28ch;margin-left:auto;margin-right:auto}.login__forgot-success-email{font-weight:var(--font-weight-semibold);color:var(--color-text)}.login__input-wrap{position:relative;display:flex;align-items:center}.login__input{width:100%;min-height:var(--touch-min);padding:var(--space-3) var(--space-4);font-family:var(--font-sans);font-size:var(--font-size-base);color:var(--color-text);background:var(--color-cream);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out)}.login__input-wrap .login__input{padding-right:calc(var(--space-4) + 28px)}.login__input::placeholder{color:var(--color-text-muted);opacity:.7}.login__input:hover{border-color:var(--color-teal)}.login__input:focus{outline:none;border-color:var(--color-teal);box-shadow:0 0 0 3px #7ec8c440}.login__toggle-password{position:absolute;right:var(--space-3);display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;background:none;border:none;border-radius:var(--radius-sm);color:var(--color-text-muted);transition:color var(--duration-fast) var(--ease-out)}.login__toggle-password:hover{color:var(--color-text)}.login__remember{display:flex;align-items:center;gap:var(--space-3);cursor:pointer;font-size:var(--font-size-sm);color:var(--color-text)}.login__checkbox{width:20px;height:20px;margin:0;accent-color:var(--color-teal);cursor:pointer}.login__remember-text{-webkit-user-select:none;user-select:none}.login__submit{margin-top:var(--space-2);position:relative;gap:var(--space-2);transition:background-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out),opacity var(--duration-normal) var(--ease-out)}.login__submit.is-loading{cursor:wait;pointer-events:none}.login__submit.is-loading .login__submit-text{opacity:.95}.login__submit-spinner{display:none;width:20px;height:20px;flex-shrink:0;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:login-spin .7s linear infinite;opacity:.9}.login__submit.is-loading .login__submit-spinner{display:block}@keyframes login-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.login__submit-spinner{animation:none;border-top-color:currentColor;opacity:.6}}.login__divider{display:flex;align-items:center;gap:var(--space-4);margin:var(--space-6) 0 var(--space-4)}.login__divider:before,.login__divider:after{content:"";flex:1;height:1px;background:var(--color-border)}.login__divider-text{font-size:var(--font-size-xs);color:var(--color-text-muted);white-space:nowrap}.login__social{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}.login__social-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--touch-min);padding:var(--space-3) var(--space-4);font-family:var(--font-sans);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text);background:var(--color-cream);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out)}.login__social-btn:hover{background:var(--color-cream-dark);border-color:var(--color-teal)}.login__social-btn:active{transform:scale(.98)}.login__social-btn:disabled,.login__social-btn.is-loading{cursor:wait;opacity:.85}.login__social-btn.is-loading{pointer-events:none}.login__org-alert{display:flex;gap:var(--space-4);margin-top:var(--space-4);padding:var(--space-4);background:linear-gradient(135deg,#e8a5981f,#f5ebe099);border:1px solid rgba(212,132,118,.4);border-radius:var(--radius-md);text-align:left;animation:login-org-alert-in .25s var(--ease-out)}@keyframes login-org-alert-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.login__org-alert-icon{flex-shrink:0;display:flex;align-items:flex-start;justify-content:center;width:40px;height:40px;color:var(--color-coral-dark);background:#ffffffb3;border-radius:var(--radius-full)}.login__org-alert-content{flex:1;min-width:0}.login__org-alert-title{margin:0 0 var(--space-2);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);color:var(--color-text);line-height:var(--line-height-tight)}.login__org-alert-text{margin:0 0 var(--space-4);font-size:var(--font-size-xs);color:var(--color-text-muted);line-height:var(--line-height-normal)}.login__org-alert-dismiss{font-family:var(--font-sans);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-secondary);background:none;border:none;padding:var(--space-2) 0;cursor:pointer;text-decoration:none;transition:color var(--duration-fast) var(--ease-out)}.login__org-alert-dismiss:hover{color:var(--color-secondary-hover);text-decoration:underline}@media(prefers-reduced-motion:reduce){.login__org-alert{animation:none}}.login__signup{margin:var(--space-6) 0 0;padding-top:var(--space-4);border-top:1px solid var(--color-border);font-size:var(--font-size-sm);color:var(--color-text-muted);text-align:center}.login__signup-link{font-weight:var(--font-weight-semibold);color:var(--color-secondary);text-decoration:none}.login__signup-link:hover{color:var(--color-secondary-hover);text-decoration:underline}.login__skip-app{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-muted);text-decoration:none}.login__skip-app:hover{color:var(--color-text);text-decoration:underline}.signup{position:relative;min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:var(--space-4);padding-top:max(var(--space-6),var(--safe-area-inset-top));padding-bottom:max(var(--space-6),var(--safe-area-inset-bottom));overflow-x:hidden}.signup__bg{position:fixed;inset:0;background:radial-gradient(ellipse 140% 90% at 50% -20%,var(--color-mint) 0%,var(--color-sky) 30%,rgba(168,212,240,.3) 55%,transparent 70%),radial-gradient(circle 50% at 90% 15%,var(--color-coral) 0%,transparent 45%),radial-gradient(circle 45% at 10% 85%,var(--color-teal) 0%,transparent 40%),var(--color-cream);pointer-events:none}.signup__content{position:relative;width:100%;max-width:400px;max-height:100%;overflow-y:auto;display:flex;flex-direction:column;align-items:center;gap:var(--space-6);padding-bottom:var(--space-4)}.signup__header{text-align:center}.signup__brand{display:flex;align-items:center;justify-content:center;gap:var(--space-3);margin-bottom:var(--space-2)}.signup__brand .mascot{flex-shrink:0}.signup__brand .mascot__icon{width:var(--font-size-2xl);height:var(--font-size-2xl)}.signup__title{margin:0;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);letter-spacing:-.02em;line-height:var(--line-height-tight)}.signup__tagline{margin:0;font-size:var(--font-size-sm);color:var(--color-text-muted)}.signup__card{width:100%;padding:var(--space-8);background:var(--color-surface);border-radius:var(--radius-xl);box-shadow:0 4px 24px #2d2a260f,0 1px 3px #2d2a260a;border:1px solid var(--color-border)}.signup__card-title{margin:0 0 var(--space-1);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text)}.signup__card-sub{margin:0 0 var(--space-6);font-size:var(--font-size-sm);color:var(--color-text-muted)}.signup__form{display:flex;flex-direction:column;gap:var(--space-4)}.signup__field{display:flex;flex-direction:column;gap:var(--space-2)}.signup__label{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text)}.signup__input-wrap{position:relative;display:flex;align-items:center}.signup__input{width:100%;min-height:var(--touch-min);padding:var(--space-3) var(--space-4);font-family:var(--font-sans);font-size:var(--font-size-base);color:var(--color-text);background:var(--color-cream);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out)}.signup__input-wrap .signup__input{padding-right:calc(var(--space-4) + 28px)}.signup__input::placeholder{color:var(--color-text-muted);opacity:.7}.signup__input:hover{border-color:var(--color-teal)}.signup__input:focus{outline:none;border-color:var(--color-teal);box-shadow:0 0 0 3px #7ec8c440}.signup__input--has-notice{border-color:var(--color-sky);box-shadow:0 0 0 1px #a8d4f066}.signup__input--has-notice:focus{border-color:var(--color-teal);box-shadow:0 0 0 3px #7ec8c440}.signup__notice{display:flex;align-items:center;gap:var(--space-2);margin:0;padding:var(--space-2) var(--space-3);font-size:var(--font-size-xs);line-height:var(--line-height-normal);color:var(--color-text-muted);background:#a8d4f033;border-radius:var(--radius-md);border:1px solid rgba(168,212,240,.35);animation:signup-notice-in var(--duration-normal) var(--ease-out)}@keyframes signup-notice-in{0%{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}.signup__notice-icon{flex-shrink:0;color:var(--color-sky);opacity:.9}@media(prefers-reduced-motion:reduce){.signup__notice{animation:none}}.signup__toggle-password{position:absolute;right:var(--space-3);display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;background:none;border:none;border-radius:var(--radius-sm);color:var(--color-text-muted);transition:color var(--duration-fast) var(--ease-out)}.signup__toggle-password:hover{color:var(--color-text)}.signup__submit{margin-top:var(--space-2);position:relative;gap:var(--space-2);transition:background-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out),opacity var(--duration-normal) var(--ease-out)}.signup__submit.is-loading{cursor:wait;pointer-events:none}.signup__submit.is-loading .signup__submit-text{opacity:.95}.signup__submit-spinner{display:none;width:20px;height:20px;flex-shrink:0;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:signup-spin .7s linear infinite;opacity:.9}.signup__submit.is-loading .signup__submit-spinner{display:block}@keyframes signup-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.signup__submit-spinner{animation:none;border-top-color:currentColor;opacity:.6}}.signup__divider{display:flex;align-items:center;gap:var(--space-4);margin:var(--space-6) 0 var(--space-4)}.signup__divider:before,.signup__divider:after{content:"";flex:1;height:1px;background:var(--color-border)}.signup__divider-text{font-size:var(--font-size-xs);color:var(--color-text-muted);white-space:nowrap}.signup__social{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}.signup__social-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--touch-min);padding:var(--space-3) var(--space-4);font-family:var(--font-sans);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text);background:var(--color-cream);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out)}.signup__social-btn:hover{background:var(--color-cream-dark);border-color:var(--color-teal)}.signup__social-btn:active{transform:scale(.98)}.signup__social-btn:disabled,.signup__social-btn.is-loading{cursor:wait;opacity:.85}.signup__social-btn.is-loading{pointer-events:none}.signup__org-alert{display:flex;gap:var(--space-4);margin-top:var(--space-4);padding:var(--space-4);background:linear-gradient(135deg,#e8a5981f,#f5ebe099);border:1px solid rgba(212,132,118,.4);border-radius:var(--radius-md);text-align:left;animation:signup-org-alert-in .25s var(--ease-out)}@keyframes signup-org-alert-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.signup__org-alert-icon{flex-shrink:0;display:flex;align-items:flex-start;justify-content:center;width:40px;height:40px;color:var(--color-coral-dark);background:#ffffffb3;border-radius:var(--radius-full)}.signup__org-alert-content{flex:1;min-width:0}.signup__org-alert-title{margin:0 0 var(--space-2);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);color:var(--color-text);line-height:var(--line-height-tight)}.signup__org-alert-text{margin:0 0 var(--space-4);font-size:var(--font-size-xs);color:var(--color-text-muted);line-height:var(--line-height-normal)}.signup__org-alert-dismiss{font-family:var(--font-sans);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-secondary);background:none;border:none;padding:var(--space-2) 0;cursor:pointer;text-decoration:none;transition:color var(--duration-fast) var(--ease-out)}.signup__org-alert-dismiss:hover{color:var(--color-secondary-hover);text-decoration:underline}@media(prefers-reduced-motion:reduce){.signup__org-alert{animation:none}}.signup__login{margin:var(--space-6) 0 0;padding-top:var(--space-4);border-top:1px solid var(--color-border);font-size:var(--font-size-sm);color:var(--color-text-muted);text-align:center}.signup__login-link{font-weight:var(--font-weight-semibold);color:var(--color-secondary);text-decoration:none}.signup__login-link:hover{color:var(--color-secondary-hover);text-decoration:underline}