:root{--ink: #0f172a;--bg: #e5e7eb;--card: #ffffff;--accent: #1f5fa8;--muted: #64748b;--field: rgba(31, 95, 168, .1);--field-focus: rgba(31, 95, 168, .22)}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-text-size-adjust:100%}button{font:inherit}.bar{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:8px;padding:10px 12px;padding-top:calc(10px + env(safe-area-inset-top));background:var(--ink);color:#fff}.bar h1{font-size:17px;margin:0;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bar .sub{display:block;font-size:11px;font-weight:400;opacity:.75}.bar button{background:#1e293b;color:#fff;border:1px solid #334155;border-radius:8px;padding:8px 12px;min-height:40px}.bar button.primary{background:var(--accent);border-color:var(--accent)}.bar button:disabled{opacity:.5}.tabs{display:flex;background:var(--ink);padding:0 12px 8px;gap:8px}.tabs button{flex:1;background:transparent;color:#cbd5e1;border:1px solid #334155;border-radius:8px;padding:8px}.tabs button[aria-pressed=true]{background:#fff;color:var(--ink);border-color:#fff}main{padding:12px;padding-bottom:calc(24px + env(safe-area-inset-bottom))}footer.stamp{text-align:center;color:var(--muted);font-size:11px;padding:16px}.group-title{margin:14px 4px 8px;font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.card{background:var(--card);border-radius:10px;box-shadow:0 1px 3px #00000026;padding:8px;text-align:left;border:0;cursor:pointer;display:flex;flex-direction:column;gap:6px}.card .thumb{overflow:hidden;border:1px solid #e2e8f0;background:#fff;aspect-ratio:612 / 792;pointer-events:none}.card .name{font-size:13px;font-weight:600;line-height:1.2}.card .meta{font-size:11px;color:var(--muted)}.list{display:flex;flex-direction:column;gap:8px}.row{background:var(--card);border-radius:10px;box-shadow:0 1px 3px #00000026;display:flex;align-items:center;gap:10px;padding:10px 12px}.row .thumb{width:44px;aspect-ratio:612 / 792;border:1px solid #e2e8f0;overflow:hidden;flex:none;pointer-events:none}.row .text{flex:1;min-width:0}.row .title{font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row .meta{font-size:12px;color:var(--muted)}.row button{background:#f1f5f9;border:1px solid #e2e8f0;border-radius:8px;padding:8px 10px;min-height:40px}.empty{text-align:center;color:var(--muted);padding:40px 16px}.editor{overflow:auto;padding:12px 0 40px}.pages{display:flex;flex-direction:column;align-items:center;gap:16px}.sheet{position:relative;background:#fff;box-shadow:0 1px 6px #00000040;overflow:hidden;flex:none}.sheet>.page{position:absolute;left:0;top:0;width:612px;height:792px;transform-origin:0 0;font-family:Helvetica,Arial,Liberation Sans,sans-serif;color:#000;line-height:1}.page>*{position:absolute}.page .t{white-space:pre}.page .t.c{transform:translate(-50%)}.page .t.r{transform:translate(-100%)}.page input,.page textarea,.page button.circle{position:absolute;margin:0;padding:0 1px;border:0;border-radius:0;outline:none;background:var(--field);font-family:inherit;color:#000;resize:none;overflow:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}.page input:focus,.page textarea:focus{background:var(--field-focus)}.page textarea{line-height:var(--gap);white-space:pre-wrap}.page input[type=checkbox]{background:transparent;padding:0;cursor:pointer}.page input[type=checkbox].box{border:.8px solid #000}.page input[type=checkbox]:checked{background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'><path d='M1.5 5.2 4 7.8 8.6 2.2' fill='none' stroke='black' stroke-width='1.4'/></svg>") center / 90% no-repeat}.page button.circle{background:transparent;border:1px solid transparent;border-radius:50%;cursor:pointer}.page button.circle[aria-pressed=true]{border-color:#000}.readonly .page input,.readonly .page textarea,.readonly .page button.circle{background:transparent;pointer-events:none}.zoom{display:flex;gap:4px}.zoom button{min-width:40px;padding:8px 6px}