*,:before,:after{box-sizing:border-box}html,body,#app{min-height:100%;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}body{color:#f4eeff;-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;background-color:#0f1040;background-image:radial-gradient(at 20% 0,#2a1b5e 0%,#0000 55%),radial-gradient(at 80% 100%,#1a1b4b 0%,#0000 60%),linear-gradient(#0f1040 0%,#1a1b4b 100%);background-attachment:fixed;font-family:Quicksand,ui-rounded,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica Neue,sans-serif;line-height:1.6}body:before{content:"";pointer-events:none;z-index:0;background-image:radial-gradient(1.5px 1.5px at 12% 18%,#fff9,#0000),radial-gradient(1px 1px at 42% 82%,#ffffff73,#0000),radial-gradient(1.5px 1.5px at 78% 28%,#ffffff8c,#0000),radial-gradient(1px 1px at 88% 74%,#fff6,#0000),radial-gradient(1px 1px at 26% 58%,#ffffff59,#0000);position:fixed;inset:0}#app{z-index:1;position:relative}h1,h2,h3{letter-spacing:-.01em;color:#ffeec2;margin:0;font-family:Fraunces,Cochin,Georgia,serif;font-weight:600;line-height:1.2}a{color:#ffd39a;text-decoration:none}a:hover,a:focus-visible{text-decoration:underline}img{max-width:100%;height:auto;display:block}.home,.story-view{max-width:1200px;margin:0 auto;padding:24px 16px 48px}.story-view{max-width:720px;padding-bottom:140px}@media (width>=768px){.home,.story-view{padding:40px 32px 64px}.story-view{padding-bottom:64px}}.hero{text-align:center;padding:24px 8px 32px}.hero__moon{filter:drop-shadow(0 0 24px #ffdc9673);width:72px;height:72px;margin:0 auto 16px}.hero__title{margin-bottom:12px;font-size:clamp(2rem,1.4rem + 3vw,3.2rem)}.hero__subtitle{color:#d6cfe8;max-width:32ch;margin:0 auto;font-size:1.05rem}.countdown{background:#ffffff0d;border:1px solid #ffd39a33;border-radius:18px;flex-direction:column;align-items:center;gap:4px;margin-top:24px;padding:14px 22px;display:inline-flex;box-shadow:0 10px 30px #00000040}.countdown__label{letter-spacing:.08em;text-transform:uppercase;color:#b9b1d4;font-size:.78rem}.countdown__when{color:#d6cfe8;font-size:.95rem}.countdown__time{color:#ffd39a;font-variant-numeric:tabular-nums;letter-spacing:.01em;font-family:Fraunces,Cochin,Georgia,serif;font-size:1.35rem}@media (width>=768px){.countdown__time{font-size:1.5rem}}.story-grid{grid-template-columns:1fr;gap:24px;margin-top:8px;display:grid}@media (width>=768px){.story-grid{grid-template-columns:repeat(2,1fr);gap:32px}}@media (width>=1200px){.story-grid{grid-template-columns:repeat(3,1fr)}}.story-card{color:inherit;background:#ffffff0a;border:1px solid #ffffff14;border-radius:20px;flex-direction:column;text-decoration:none;transition:transform .18s,box-shadow .18s,border-color .18s;display:flex;overflow:hidden}.story-card:hover,.story-card:focus-visible{border-color:#ffd39a66;outline:none;text-decoration:none;transform:translateY(-2px);box-shadow:0 16px 40px #0000004d}.story-card__image-wrap{aspect-ratio:16/9;background:linear-gradient(135deg,#2a2b6e 0%,#1a1b4b 100%);position:relative}.story-card__image{object-fit:cover;width:100%;height:100%}.story-card__image--placeholder{display:block}.story-card__body{flex-direction:column;gap:6px;padding:16px 18px 20px;display:flex}.story-card__date{color:#b9b1d4;letter-spacing:.01em;font-size:.8rem}.story-card__title{margin:2px 0;font-size:1.25rem}.story-card__preview{color:#d6cfe8;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;margin:0;display:-webkit-box;overflow:hidden}.badge{color:#ffeec2;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0f1040bf;border:1px solid #ffffff26;border-radius:999px;padding:6px 12px;font-size:.78rem;font-weight:600;position:absolute;top:12px;left:12px}.story__header .badge{margin-bottom:12px;display:inline-block;position:static}.back-link{color:#ffd39a;align-items:center;gap:6px;min-height:44px;padding:10px 4px;font-size:.95rem;display:inline-flex}.story{margin-top:12px}.story__image-wrap{aspect-ratio:16/9;background:linear-gradient(135deg,#2a2b6e 0%,#1a1b4b 100%);border-radius:20px;margin-bottom:24px;overflow:hidden;box-shadow:0 20px 50px #00000059}.story__image{object-fit:cover;width:100%;height:100%}.story__header{margin-bottom:28px}.story__title{margin-bottom:8px;font-size:clamp(1.85rem,1.3rem + 2.4vw,2.6rem)}.story__date{color:#b9b1d4;margin-bottom:6px;font-size:.95rem;display:block}.story__theme{color:#d6cfe8;margin:0;font-size:.95rem;font-style:italic}.story__body{max-width:62ch;margin:0 auto}.story__body p{color:#f4eeff;margin:0 0 1.4em;font-size:clamp(1.125rem,1rem + .5vw,1.375rem);line-height:1.75}.story__body p:first-of-type:first-letter{float:left;color:#ffd39a;margin:.1em .08em 0 0;font-family:Fraunces,Cochin,Georgia,serif;font-size:3.2em;line-height:.85}.story__bottom-back{text-align:center;margin-top:32px}.related{background:#ffffff0a;border:1px solid #ffffff1a;border-radius:16px;margin-top:40px;padding:20px 22px}.related__title{margin-bottom:12px;font-size:1.15rem}.related__list{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.related__list a{min-height:44px;padding:8px 0;display:block}.related__list span{color:#b9b1d4;font-size:.9rem}.prev-next{padding:10px 12px calc(10px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:10;background:#0f1040eb;border-top:1px solid #ffffff14;grid-template-columns:1fr 1fr;gap:8px;display:grid;position:fixed;bottom:0;left:0;right:0}.prev-next__button{color:#f4eeff;background:#ffffff0f;border-radius:12px;align-items:center;gap:8px;min-height:48px;padding:8px 12px;font-size:.85rem;display:flex;overflow:hidden}.prev-next__button:hover{background:#ffffff1f;text-decoration:none}.prev-next__button:last-child{text-align:right;justify-content:flex-end}.prev-next__button--disabled{opacity:.4;pointer-events:none}.prev-next__arrow{color:#ffd39a;flex-shrink:0;font-size:1.2rem}.prev-next__label{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}@media (width>=768px){.prev-next{-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border:none;margin-top:48px;padding:0;position:static}.prev-next__button{padding:14px 18px;font-size:.95rem}}.empty-state{text-align:center;color:#d6cfe8;padding:40px 16px;font-size:1.1rem}.site-footer{text-align:center;color:#9c94b8;margin-top:64px;font-size:.9rem}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}
