*{box-sizing:border-box}:root{--browser-bottom-overlay:0px;--nav-clearance:124px}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) calc(var(--nav-clearance) + env(safe-area-inset-bottom) + var(--browser-bottom-overlay))}.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;z-index:10;left:50%;bottom:calc(12px + env(safe-area-inset-bottom) + var(--browser-bottom-overlay));transform:translateX(-50%);width:min(480px,calc(100% - 32px));display:flex;justify-content:space-around;background:rgba(255,253,248,.94);border:1px solid var(--line);border-radius:var(--r-pill);box-shadow:var(--shadow);padding:7px}.nav-item{border:0;background:transparent;color:var(--ink-soft);padding:9px 16px;border-radius:var(--r-pill)}.nav-item.active{background:var(--rice-deep);color:var(--ink)}.toast{position:fixed;z-index:12;left:50%;bottom:calc(90px + env(safe-area-inset-bottom) + var(--browser-bottom-overlay));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)}

.install-help{position:fixed;inset:0;z-index:20;display:flex;align-items:flex-end;justify-content:center;padding:20px;background:rgba(35,32,27,.38)}
.install-help.hidden{display:none}
.install-help-card{width:min(480px,100%);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px;box-shadow:0 18px 60px rgba(35,32,27,.22)}
.install-help-card h2{margin:4px 0 12px;font-weight:600}
.install-steps{margin:16px 0 20px;padding-left:24px;color:var(--ink);line-height:1.9}
.install-help-card .primary-btn{width:100%}

/* 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;
  }
}

/* Alpha-01: photo, data and cross-device stability */
.photo-field{display:grid;gap:var(--s-2)}
.photo-preview{display:block;width:100%;max-height:360px;object-fit:contain;border-radius:var(--r-md);background:var(--rice-deep)}
.photo-preview.hidden{display:none}
.photo-actions{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap}
.field-hint,.version-line{margin:0;color:var(--ink-soft);font-size:var(--fs-sm)}
.data-panel button{width:100%}
.bottom-nav{padding-bottom:7px}
@supports not (backdrop-filter:blur(10px)){
  .recent-card,.quiet-card,.page-card,.capture-form,.bottom-nav{background:var(--paper)}
}
@media (max-width:380px){
  .nav-item{padding:10px 12px}
  .app-shell{padding-left:16px;padding-right:16px}
}
@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}
}