*{box-sizing:border-box}body{margin:0;background:var(--rice);color:var(--ink);font-family:var(--font-main);line-height:var(--lh)}button,input,textarea{font:inherit}button{cursor:pointer}.app-shell{max-width:520px;margin:0 auto;min-height:100vh;padding:env(safe-area-inset-top) var(--s-4) 96px}.topbar{display:flex;justify-content:space-between;align-items:center;padding:var(--s-4) 0}.eyebrow{font-size:var(--fs-xs);letter-spacing:.12em;text-transform:uppercase;color:var(--tea);margin:0}.topbar h1,.page-head h2{margin:2px 0 0;font-size:var(--fs-lg);font-weight:600}.view{display:none}.view.active{display:block}.study-hero{margin-top:var(--s-5);min-height:430px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.soft-line{color:var(--ink-soft);margin:0 0 var(--s-2)}.study-hero h2{font-size:var(--fs-xl);line-height:1.25;margin:0 0 var(--s-5);font-weight:500}.leaf-mark{font-size:42px;margin:0 0 var(--s-4)}blockquote{margin:0 0 var(--s-5);font-size:18px;color:var(--ink);line-height:2}.primary-btn{border:0;background:var(--moss);color:#fff;border-radius:var(--r-pill);padding:14px 24px;box-shadow:var(--shadow);min-width:160px}.ghost-btn{border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:var(--r-pill);padding:8px 14px}.hidden{display:none}.recent-card,.quiet-card,.page-card,.capture-form{background:rgba(255,253,248,.72);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s-4);box-shadow:var(--shadow);backdrop-filter:blur(10px)}.section-title{margin:0 0 var(--s-2);color:var(--tea);font-size:var(--fs-sm)}.empty-text{color:var(--ink-soft)}.quiet-card{width:100%;margin-top:var(--s-3);display:flex;justify-content:space-between;align-items:center;text-align:left;color:var(--ink)}.quiet-card small{color:var(--ink-soft)}.page-head{padding:var(--s-4) 0 var(--s-3)}.tabs{display:flex;gap:var(--s-2);overflow:auto;padding-bottom:var(--s-3)}.tab,.chip{border:1px solid var(--line);background:rgba(255,253,248,.55);border-radius:var(--r-pill);padding:8px 14px;color:var(--ink-soft);white-space:nowrap}.tab.active,.chip.active{background:var(--ink);color:var(--rice);border-color:var(--ink)}.pages-list{display:grid;gap:var(--s-3)}.page-card{position:relative}.page-no{color:var(--tea);font-size:var(--fs-sm);margin:0 0 var(--s-2)}.book{font-weight:600;margin:0 0 var(--s-2)}.quote{white-space:pre-wrap;margin:0 0 var(--s-3);font-size:17px}.note{color:var(--ink-soft);white-space:pre-wrap;border-left:2px solid var(--sage);padding-left:var(--s-2)}.card-actions{display:flex;gap:var(--s-2);margin-top:var(--s-3)}.text-btn{border:0;background:transparent;color:var(--moss);padding:6px}.danger{color:#9a5f4c}.capture-form{display:grid;gap:var(--s-3)}label{display:grid;gap:var(--s-1);color:var(--ink-soft)}input,textarea{border:1px solid var(--line);border-radius:var(--r-md);background:var(--paper);padding:13px;color:var(--ink);outline:none}textarea{resize:vertical}.type-row{display:flex;gap:var(--s-2)}.favorite-line{display:flex;grid-template-columns:auto 1fr;align-items:center;gap:var(--s-2)}.bottom-nav{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);width:min(480px,calc(100% - 32px));display:flex;justify-content:space-around;background:rgba(255,253,248,.86);border:1px solid var(--line);border-radius:var(--r-pill);box-shadow:var(--shadow);padding:8px}.nav-item{border:0;background:transparent;color:var(--ink-soft);padding:10px 18px;border-radius:var(--r-pill)}.nav-item.active{background:var(--rice-deep);color:var(--ink)}.toast{position:fixed;left:50%;bottom:92px;transform:translateX(-50%) translateY(16px);opacity:0;background:var(--ink);color:var(--rice);border-radius:var(--r-md);padding:12px 18px;transition:all var(--fast) var(--ease);max-width:320px;text-align:center;pointer-events:none}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* Beta-01 mobile/product layout fixes */
.app-shell{
  width:100%;
  max-width:520px;
  margin:0 auto;
}
body{
  display:flex;
  justify-content:center;
}
img, input, textarea, button{
  max-width:100%;
}
@media (min-width:700px){
  .app-shell{
    margin:40px auto;
  }
}