@layer defaults,components,themes,decorations;@layer components{:root[data-scheme=dark]:has(.landing,.blog-page){color-scheme:dark}.landing,.blog-page{min-height:100dvh;background-color:var(--background);background-image:var(--background-pattern);color:var(--text);font:var(--size-large) / 1.6 var(--font-ui);overflow-x:clip}.landing h1,.landing h2,.landing h3,.blog-page h1,.blog-page h2,.blog-page h3{font-family:var(--font-heading);font-weight:var(--heading-weight)}.landing-signin{display:flex;align-items:center}.landing{display:flex;flex-direction:column}.landing main{flex:1;box-sizing:border-box;width:100%;max-width:1184px;margin:0 auto;padding:0 32px}.landing-cta{padding:12px 28px;font-size:var(--size-large);text-decoration:none}.landing-heading{width:fit-content;margin-bottom:8px}.landing-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:56px;align-items:start;padding:56px 0 40px}.landing h1,.landing-sample{width:fit-content;font-size:44px;line-height:1.25;margin:0 0 28px;color:var(--primary)}.landing-shelf{container-type:inline-size}.landing-books{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}@container (max-width: 420px){.landing-books{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 16px}}.landing-book{display:flex;flex-direction:column;gap:2px;color:inherit;text-decoration:none;line-height:1.3}.landing-book>:first-child{margin-bottom:8px}.landing-book b{color:var(--primary);text-decoration:underline}.landing-book span{margin-top:auto;padding-top:2px;font-size:var(--size-small)}.landing-cover{display:block;width:100%;aspect-ratio:2 / 3;object-fit:cover;box-sizing:border-box}.landing-more{grid-column:1 / -1;width:fit-content;margin-top:22px}@container (max-width: 420px){.landing-more{grid-column:2;margin-top:0}}.landing-shot{position:relative}.landing-tape,.landing-sample{display:none}.landing-screen{display:grid;gap:14px;padding:14px;border-radius:var(--corner-large);background-color:var(--background);background-image:var(--background-pattern);box-shadow:var(--card-shadow)}.landing-page{margin:0;padding:18px 20px;border-radius:var(--corner);background:var(--book-page-fill);color:var(--text);font:24px/2 "Noto Serif JP",Hiragino Mincho ProN,serif}.landing-sentence{background:color-mix(in srgb,var(--primary) 10%,transparent)}.landing-word{cursor:pointer}.landing-word:focus-visible{outline:2px solid var(--primary)}@media (hover: hover){.landing-word:hover{background:color-mix(in srgb,var(--word-highlight) 50%,transparent)}}.landing-word[aria-pressed=true]{background:var(--word-highlight)}.landing-popup{padding:12px 14px;font-size:var(--size-body)}.landing-headword{font-size:28px}.landing-shot .landing-popup{padding:14px 16px;font-size:var(--size-large)}.landing-shot .landing-headword{font-size:34px}.landing-meaning{margin:4px 0 8px}.landing-popup mark{background:var(--word-highlight);color:inherit}.landing-form{margin:0 0 8px;font-size:var(--size-small)}.landing-translation{margin:0;padding-top:8px;border-top:1px dashed var(--line)}.landing-foot{padding:14px 32px;border-top:1px solid var(--line);font-size:var(--size-small);color:var(--text-muted)}@media (max-width: 800px){.landing main{padding:0 18px}.landing h1,.landing-sample{font-size:30px}.landing-hero{grid-template-columns:minmax(0,1fr);gap:28px;padding:28px 0 24px}.landing-page{font-size:20px}.landing-sample{display:block}}}@layer decorations{[data-theme=heisei] :is(.landing h1,.landing-sample){padding:0 10px;background:#b6e03a;color:#18181c;rotate:-1.5deg}[data-theme=heisei] .landing-shot{rotate:1.5deg}@media (max-width: 800px){[data-theme=heisei] .landing-shot{rotate:none}}[data-theme=heisei] .landing-screen{border:6px solid var(--sticker-edge);box-shadow:0 0 0 2px var(--sticker-shadow),8px 8px 0 2px var(--sticker-shadow)}[data-theme=heisei] .landing-tape{display:block;position:absolute;z-index:2;top:-16px;left:40%;width:110px;height:28px;rotate:-6deg;background:repeating-linear-gradient(90deg,#fffa 0,#fffa 6px,#ffe03aaa 6px,#ffe03aaa 12px);box-shadow:0 1px 2px #0002}[data-theme=heisei] .landing-book>:first-child{border:5px solid var(--sticker-edge);box-shadow:0 0 0 2px var(--sticker-shadow),5px 5px 0 2px var(--sticker-shadow)}[data-theme=heisei] .landing-book:nth-child(odd)>:first-child{rotate:-1.5deg}[data-theme=heisei] .landing-book:nth-child(2n)>:first-child{rotate:1.5deg}[data-theme=heisei] .landing-foot{border-top:2px solid var(--sticker-shadow);background:var(--panel)}}
