body{display:flex;min-height:100vh;background:var(--bg)}.home-main{margin-left:var(--sidebar-w);flex:1;display:flex;flex-direction:column}.home-page{max-width:860px;width:100%;margin:0 auto;background:var(--page);min-height:100vh;border-left:1px solid #e0ddd5;border-right:1px solid #e0ddd5;box-shadow:0 0 40px #0000000f;position:relative;padding-bottom:5rem}.home-page:before{content:"";position:absolute;left:3.6rem;top:0;bottom:0;width:1px;background:#c0392b33;pointer-events:none}.cover{padding:4rem 3.5rem 3rem 5rem;border-bottom:2px solid var(--line);background:linear-gradient(180deg,#f5f0e8 0%,var(--page) 100%);position:relative;overflow:hidden}.cover-eyebrow{font-family:IBM Plex Mono,monospace;font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--red);margin-bottom:.9rem}.cover h1{font-family:Lora,serif;font-size:clamp(2rem,5vw,2.8rem);font-weight:600;line-height:1.15;color:var(--ink);margin-bottom:.6rem}.cover h1 em{font-style:italic;color:var(--accent)}.cover-sub{font-size:.9rem;color:var(--muted);font-style:italic;max-width:500px;line-height:1.65;margin-bottom:1.5rem}.cover-meta{font-family:IBM Plex Mono,monospace;font-size:.72rem;color:var(--muted);display:flex;gap:2rem;flex-wrap:wrap}.cover-meta span:before{content:"— ";color:var(--red);opacity:.5}.cover-atom{position:absolute;right:3rem;top:50%;transform:translateY(-50%);opacity:.07;pointer-events:none}.home-section{padding:2.2rem 3.5rem 1.5rem 5rem;border-bottom:1px solid var(--line)}.home-section:last-of-type{border-bottom:none}.home-section-num{font-family:IBM Plex Mono,monospace;font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);margin-bottom:.3rem}.home-section h2{font-family:Lora,serif;font-size:1.3rem;font-weight:600;color:var(--accent);margin:0 0 1.2rem;padding-bottom:.35rem;border-bottom:1.5px solid var(--line)}.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:.9rem;margin-bottom:.5rem}.note-card{background:#fdfcf8;border:1px solid var(--line);border-radius:6px;padding:1.2rem 1.2rem 1rem;text-decoration:none;color:var(--ink);display:block;transition:box-shadow .18s,transform .18s,border-color .18s;position:relative;overflow:hidden}.note-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--card-color, var(--accent));border-radius:3px 0 0 3px}.note-card:hover{box-shadow:0 4px 16px #00000017;transform:translateY(-2px);border-color:var(--card-color, var(--accent))}.note-card-num{font-family:IBM Plex Mono,monospace;font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:var(--card-color, var(--accent));margin-bottom:.4rem}.note-card h3{font-family:Lora,serif;font-size:1rem;font-weight:600;color:var(--ink);text-transform:none;letter-spacing:0;margin:0 0 .45rem;line-height:1.25}.note-card p{font-size:.8rem;color:var(--muted);line-height:1.55;margin:0 0 .8rem}.note-card-chips{display:flex;gap:.35rem;flex-wrap:wrap}.chip{font-family:IBM Plex Mono,monospace;font-size:.6rem;letter-spacing:.04em;padding:.12rem .4rem;border-radius:3px;background:var(--accent-soft);color:var(--accent)}.sandbox-card{background:#fdfcf8;border:1px solid var(--line);border-radius:6px;padding:1.5rem 1.5rem 1.3rem;text-decoration:none;color:var(--ink);display:block;transition:box-shadow .18s,transform .18s,border-color .18s;position:relative;overflow:hidden;grid-column:1 / -1;border-left:3px solid #6b21a8}.sandbox-card:before{content:"";position:absolute;top:-60px;right:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(107,33,168,.05) 0%,transparent 70%);pointer-events:none}.sandbox-card:hover{box-shadow:0 4px 18px #00000017;transform:translateY(-2px);border-color:#6b21a8}.sandbox-card .note-card-num{color:#6b21a8}.sandbox-card h3{font-family:Lora,serif;font-size:1.05rem;font-weight:600;color:var(--ink);text-transform:none;letter-spacing:0;margin:0 0 .35rem}.sandbox-card p{font-size:.8rem;color:var(--muted);margin:0 0 .9rem}.sandbox-arrow{font-family:IBM Plex Mono,monospace;font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:#6b21a8;display:inline-flex;align-items:center;gap:.4rem;border:1px solid rgba(107,33,168,.3);padding:.25rem .7rem;border-radius:var(--border-r);background:#fff;transition:all .15s}.sandbox-card:hover .sandbox-arrow{background:#6b21a8;color:#fff;border-color:#6b21a8}.concepts-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:.45rem;margin-bottom:.5rem}.concept-item{background:#fdfcf8;border:1px solid var(--line);border-radius:5px;padding:.55rem .8rem;text-decoration:none;color:var(--ink);display:block;transition:border-color .15s,background .15s}.concept-item:hover{border-color:var(--accent);background:var(--accent-soft)}.concept-item strong{display:block;font-family:IBM Plex Mono,monospace;font-size:.75rem;font-weight:600;color:var(--accent);margin-bottom:.1rem}.concept-item span{font-family:IBM Plex Mono,monospace;font-size:.65rem;color:var(--muted)}.how-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem;margin-bottom:1.2rem}.how-step{display:flex;gap:.8rem;align-items:flex-start}.how-num{width:26px;height:26px;background:var(--accent);color:#fff;border-radius:50%;font-family:IBM Plex Mono,monospace;font-size:.75rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:.1rem}.how-step p{font-size:.84rem;color:var(--ink2);line-height:1.55;margin:0}.home-footer{background:#f0ece0;border-top:1px solid var(--line);padding:2rem 3rem}.footer-inner{max-width:900px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:2rem}.footer-label{display:block;font-family:IBM Plex Mono,monospace;font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:var(--red);margin-bottom:.5rem}.footer-attribution,.footer-qjs{font-size:.85rem;color:var(--ink2);line-height:1.7}.footer-attribution strong,.footer-qjs strong{color:var(--ink);font-weight:600}.footer-qjs a{color:var(--accent);text-decoration:none}.footer-qjs a:hover{text-decoration:underline}@media(max-width:768px){.home-main{margin-left:0}.home-page:before{display:none}.cover,.home-section{padding-left:1.5rem;padding-right:1.5rem}.cover-atom{display:none}}@media(max-width:700px){.footer-inner{grid-template-columns:1fr}.home-footer{padding:1.5rem}}@media(max-width:480px){.cards-grid{grid-template-columns:1fr}.concepts-grid{grid-template-columns:1fr 1fr}}
