:root{--cream: #faf8f5;--paper: #ffffff;--brown: #3d1c09;--brown-soft: #6b4a33;--gold: #c9a84c;--gold-soft: rgba(201, 168, 76, .14);--line: #e8e2d8;--ok: #3a7d44;--warn: #b4552d;--radius: 14px;font-family:Georgia,Times New Roman,serif}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{background:var(--cream);color:var(--brown)}button,input,select,textarea{font:inherit;color:inherit}.app{max-width:640px;margin:0 auto;padding:0 16px 90px}.topbar{display:flex;align-items:center;gap:10px;padding:14px 2px 10px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--cream);z-index:5}.brandmark{width:34px;height:34px;border-radius:50%;background:var(--brown);color:var(--gold);display:grid;place-items:center;font-weight:700;font-size:14px;letter-spacing:.5px;flex:none}.brandname{font-weight:700;letter-spacing:.04em;font-size:15px}.brandsub{font-size:11px;color:var(--brown-soft);letter-spacing:.14em;text-transform:uppercase}.spacer{flex:1}.clientpick{border:1px solid var(--line);background:var(--paper);border-radius:10px;padding:7px 10px;font-size:14px;max-width:180px}.logout{background:none;border:none;color:var(--brown-soft);font-size:12px;cursor:pointer;text-decoration:underline}.tabs{position:fixed;bottom:0;left:0;right:0;z-index:6;display:flex;justify-content:center;gap:8px;background:#faf8f5f5;border-top:1px solid var(--line);padding:10px 12px calc(10px + env(safe-area-inset-bottom))}.tab{flex:1;max-width:200px;border:1px solid var(--line);background:var(--paper);border-radius:12px;padding:10px 0;font-size:14px;cursor:pointer;position:relative}.tab.active{background:var(--brown);color:var(--cream);border-color:var(--brown)}.tab .badge{position:absolute;top:-7px;right:10px;min-width:20px;height:20px;border-radius:10px;background:var(--warn);color:#fff;font-size:12px;line-height:20px;padding:0 6px}.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:16px;margin:14px 0}h2{font-size:18px;margin:18px 2px 4px}.sub{color:var(--brown-soft);font-size:13px;margin:0 2px 10px}.field{margin-bottom:12px}.field label{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--brown-soft);margin-bottom:4px}.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:10px;background:var(--cream);padding:10px 12px;font-size:16px}.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}.btn{width:100%;border:none;border-radius:12px;padding:13px;font-size:16px;background:var(--brown);color:var(--cream);cursor:pointer}.btn.gold{background:var(--gold);color:var(--brown);font-weight:700}.btn.ghost{background:var(--paper);border:1px solid var(--line);color:var(--brown)}.btn.danger{background:#fff;border:1px solid var(--warn);color:var(--warn)}.btn:disabled{opacity:.55;cursor:default}.btnrow{display:flex;gap:10px}.btnrow .btn{flex:1}.drop{border:2px dashed var(--gold);border-radius:var(--radius);background:var(--gold-soft);padding:34px 16px;text-align:center;cursor:pointer}.drop .big{font-size:40px;line-height:1}.drop p{margin:8px 0 0;color:var(--brown-soft);font-size:14px}.viewer{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#2b2b2b;margin-bottom:12px}.viewer img{display:block;width:100%;max-height:46vh;object-fit:contain}.viewer iframe{display:block;width:100%;height:46vh;border:none;background:#fff}.parse-note{background:var(--gold-soft);border:1px solid var(--gold);border-radius:10px;padding:8px 12px;font-size:13px;margin-bottom:12px}.qitem{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;margin:10px 0;cursor:pointer}.qitem .amt{font-weight:700;font-size:16px;margin-left:auto;white-space:nowrap}.chip{font-size:11px;letter-spacing:.06em;text-transform:uppercase;background:var(--gold-soft);border:1px solid var(--gold);border-radius:999px;padding:2px 8px;white-space:nowrap}.chip.ok{background:#3a7d441f;border-color:var(--ok);color:var(--ok)}.chip.warn{background:#b4552d1a;border-color:var(--warn);color:var(--warn)}.muted{color:var(--brown-soft);font-size:13px}.empty{text-align:center;color:var(--brown-soft);padding:40px 10px}.error{color:var(--warn);font-size:14px;margin:8px 0}.success{background:#3a7d441a;border:1px solid var(--ok);color:var(--ok);border-radius:10px;padding:10px 12px;font-size:14px;margin:10px 0}.login-wrap{min-height:100vh;display:grid;place-items:center;padding:20px}.login{width:100%;max-width:380px;background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:28px}.login .brandmark{width:52px;height:52px;margin:0 auto 10px;font-size:20px}.login h1{text-align:center;font-size:20px;margin:0 0 2px}.login .tag{text-align:center;color:var(--brown-soft);font-size:12px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:20px}.pin-who{text-align:center;font-size:13px;margin-bottom:10px}.pin-dots{display:flex;justify-content:center;gap:12px;margin:6px 0 16px}.pin-dots .dot{width:14px;height:14px;border-radius:50%;border:1.5px solid var(--brown-soft);background:transparent;transition:background .1s}.pin-dots .dot.on{background:var(--gold);border-color:var(--gold)}.pinpad{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:264px;margin:0 auto 6px;justify-items:center}.pinkey{width:100%;max-width:74px;aspect-ratio:1;border-radius:50%;border:1px solid var(--line);background:linear-gradient(180deg,#fffdf8,#f4efe6);box-shadow:0 2px 5px #3d1c091a,0 1px 1px #3d1c090f,inset 0 1px #ffffffe6;font-size:24px;font-weight:600;color:var(--brown);cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;-webkit-user-select:none;user-select:none;transition:transform .05s,box-shadow .05s}.pinkey:active{transform:translateY(1px);background:linear-gradient(180deg,#f1e9da,#ece4d3);box-shadow:0 1px 2px #3d1c0914,inset 0 2px 4px #3d1c091f}.pinkey.soft{background:linear-gradient(180deg,#fdf6e7,#f3e7c9);border:1px solid var(--gold);color:var(--brown);font-size:24px;box-shadow:0 2px 5px #a17e2c2e,inset 0 1px #ffffffd9}.pinkey.soft:active{transform:translateY(1px);background:linear-gradient(180deg,#f0e2be,#ecdcb2);box-shadow:inset 0 2px 4px #3d1c0924}.pinkey:disabled{opacity:.4}.passkey-btn{margin-top:14px}.login-alt{text-align:center;margin-top:12px}.linky{background:none;border:none;color:var(--brown-soft);font-size:13px;cursor:pointer;text-decoration:underline;padding:0}.menuwrap{position:relative}.menu{position:absolute;right:0;top:26px;z-index:20;background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:0 6px 24px #3d1c091f;min-width:200px;overflow:hidden}.menu button{display:block;width:100%;text-align:left;background:none;border:none;padding:11px 14px;font-size:14px;cursor:pointer;border-bottom:1px solid var(--line)}.menu button:last-child{border-bottom:none}.menu button:hover{background:var(--gold-soft)}.meta-stamp{font-size:12px;color:var(--brown-soft);margin:-4px 2px 10px}.meta-stamp a{color:var(--brown)}.seg{display:flex;gap:8px;margin:4px 0 12px}.seg button{flex:1;padding:9px 0;border-radius:10px;border:1px solid var(--line);background:var(--paper);font-size:14px;cursor:pointer}.seg button.on{background:var(--brown);color:var(--cream);border-color:var(--brown)}.admin-row{align-items:flex-start}.admin-row .grow{flex:1;min-width:0}.admin-row.inactive{opacity:.55}.rowactions{display:flex;gap:14px;margin-top:4px}.pwreveal{font-family:Consolas,monospace;background:var(--paper);border:1px solid var(--ok);border-radius:6px;padding:1px 6px;font-size:15px;-webkit-user-select:all;user-select:all}.colordot{width:16px;height:16px;border-radius:50%;flex:none;border:1px solid var(--line)}.admin-detail{margin-top:-6px}.inline-row{display:flex;justify-content:space-between;align-items:center;padding:6px 2px;border-bottom:1px dashed var(--line);font-size:14px}.inline-row.inactive span{opacity:.5;text-decoration:line-through}.inline-add{display:flex;gap:8px;margin-top:8px}.inline-add input{flex:1;min-width:0;border:1px solid var(--line);border-radius:10px;background:var(--cream);padding:8px 10px;font-size:15px}.inline-add input[type=color]{flex:none;width:52px;height:38px;padding:2px}.inline-add input.short{flex:none;width:76px}.btn.slim{width:auto;padding:8px 14px;font-size:14px;flex:none}
