:root{--bg:#faf7f2;--surface:#fff;--text-primary:#2c1f14;--text-secondary:#7a6552;--text-muted:#b09880;--border:#e8ddd0;--tag-bg:#f0e8dc;--accent:#7b5041;--highlight:#f5ede3;--input-bg:#fffcf8;--app-vh:100dvh;--app-vh-top:0px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body{height:100%;overflow:hidden}body{background:var(--bg);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Hiragino Sans GB,sans-serif;font-size:15px;line-height:1.6}button,input,textarea{font-family:inherit}button{touch-action:manipulation}#token-setup{top:var(--app-vh-top);height:var(--app-vh);background:var(--bg);z-index:200;justify-content:center;align-items:center;padding:40px;display:flex;position:fixed;left:0;right:0}.token-box{text-align:center;width:100%;max-width:320px}.token-box h1{margin-bottom:8px;font-size:26px;font-weight:700}.token-hint{color:var(--text-muted);margin-bottom:24px;font-size:13px;line-height:1.7}.token-box input{background:var(--input-bg);border:1px solid var(--border);width:100%;color:var(--text-primary);border-radius:12px;outline:none;padding:13px 14px;font-size:16px}.token-box input:focus{border-color:var(--accent)}.token-error{color:#c0392b;text-align:left;margin-top:10px;font-size:13px}.token-box button{background:var(--text-primary);width:100%;color:var(--bg);cursor:pointer;border:none;border-radius:12px;margin-top:16px;padding:14px;font-size:16px;font-weight:600}.token-box button:active{opacity:.75}.token-box button:disabled{opacity:.4}.page{top:var(--app-vh-top);height:var(--app-vh);background:var(--bg);flex-direction:column;display:flex;position:fixed;left:0;right:0}.page-bar{background:var(--bg);padding:calc(env(safe-area-inset-top,12px) + 10px) 16px 12px;border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:4px;display:flex}.kb-open .page-bar{padding-top:10px}.bar-title{text-align:center;color:var(--text-secondary);flex:1;font-size:16px;font-weight:600}.bar-btn{cursor:pointer;min-width:44px;color:var(--text-secondary);background:0 0;border:none;flex-shrink:0;padding:6px 8px;font-size:16px}.bar-btn.strong{color:var(--accent);font-weight:600}.bar-btn:active{opacity:.5}.bar-btn:disabled{opacity:.35}.page-body{-webkit-overflow-scrolling:touch;padding:16px;padding-bottom:calc(env(safe-area-inset-bottom,0px) + 32px);flex:1;overflow-y:auto}.app-header{background:var(--bg);padding:calc(env(safe-area-inset-top,12px) + 10px) 20px 12px;border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;display:flex}.kb-open .app-header{padding-top:10px}.app-title{letter-spacing:.04em;font-size:17px;font-weight:700}.header-right{align-items:center;gap:8px;display:flex}.sync-hint{color:var(--text-muted);font-size:12px}.header-btn{background:var(--tag-bg);width:34px;height:34px;color:var(--text-muted);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;display:flex}.header-btn:active{color:var(--text-primary)}.header-btn.on{background:var(--accent);color:#fff}.header-btn.primary{background:var(--accent);color:#fff;width:32px;height:32px;font-size:21px;font-weight:400;line-height:1}.header-btn.primary:active{opacity:.8;color:#fff}.page-body.list{padding:0 0 calc(env(safe-area-inset-bottom,0px) + 32px)}.tip{color:var(--text-muted);text-align:center;padding:48px 24px;font-size:14px}.memo-item{text-align:left;border:none;border-bottom:1px solid var(--border);cursor:pointer;background:0 0;align-items:baseline;gap:12px;width:100%;padding:15px 16px;display:flex}.memo-item:active{background:var(--highlight)}.memo-item-title{min-width:0;color:var(--text-primary);text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:16px;overflow:hidden}.memo-item-date{color:var(--text-muted);font-variant-numeric:tabular-nums;flex-shrink:0;font-size:12px}.search-row{border-bottom:1px solid var(--border);background:var(--bg);flex-shrink:0;align-items:center;gap:8px;padding:10px 16px;display:flex}.search-row input{background:var(--input-bg);border:1px solid var(--border);color:var(--text-primary);border-radius:10px;outline:none;flex:1;padding:9px 12px;font-size:16px}.search-row input:focus{border-color:var(--accent)}.search-clear{background:var(--tag-bg);width:28px;height:28px;color:var(--text-secondary);cursor:pointer;border:none;border-radius:50%;flex-shrink:0;font-size:16px}.form-title{border:none;border-bottom:1px solid var(--border);width:100%;color:var(--text-primary);background:0 0;outline:none;padding:8px 0;font-size:20px;font-weight:600}.form-title::placeholder{color:var(--text-muted);font-weight:400}.form-title:focus{border-bottom-color:var(--accent)}.thumb-row{flex-wrap:wrap;gap:8px;margin:16px 0;display:flex}.thumb{background:var(--tag-bg);border-radius:10px;flex-shrink:0;width:76px;height:76px;position:relative;overflow:hidden}.thumb img{object-fit:cover;width:100%;height:100%;display:block}.thumb-empty{background:var(--tag-bg);width:100%;height:100%}.thumb-x{color:#fff;cursor:pointer;background:#0000008c;border:none;border-radius:50%;justify-content:center;align-items:center;width:22px;height:22px;font-size:15px;line-height:1;display:flex;position:absolute;top:2px;right:2px}.thumb-loading,.thumb-add{border:1px dashed var(--border);background:var(--input-bg);color:var(--text-muted);cursor:pointer;justify-content:center;align-items:center;display:flex}.thumb-loading{font-size:12px}.thumb-add{font-size:24px}.thumb-add:active{background:var(--highlight)}.form-body{resize:none;width:100%;min-height:240px;color:var(--text-primary);background:0 0;border:none;outline:none;padding:0;font-size:16px;line-height:1.7}.form-body::placeholder{color:var(--text-muted)}.detail-title{margin-bottom:14px;font-size:21px;font-weight:700;line-height:1.45}.detail-image{background:var(--tag-bg);border-radius:12px;margin-bottom:12px;overflow:hidden}.detail-image img{width:100%;display:block}.detail-image-loading{text-align:center;color:var(--text-muted);padding:48px 0;font-size:13px}.detail-body{white-space:pre-wrap;margin-top:4px;font-size:16px;line-height:1.75}.detail-delete{border:1px solid var(--border);color:#c0392b;cursor:pointer;background:0 0;border-radius:10px;margin:40px auto 0;padding:10px 20px;font-size:14px;display:block}.detail-delete:active{background:var(--highlight)}
