:root{--bg: #f8f4ea;--card-sage: #e7f0df;--card-white: #fefdf8;--inset: #edf0e9;--pill: #ffffff;--field: #f4f6ef;--ink: #1c2a1e;--ink-2: #3f4b3f;--ink-3: #6b776b;--line: #c9cfc4;--line-soft: #dfe3da;--danger: #c04a3a;--radius-card: 22px;--radius-inner: 12px;--shadow-ink: #2a4c34;--shadow-card: 5px 5px 0 var(--shadow-ink)}*{box-sizing:border-box}#app{height:100vh;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}body{margin:0;font-family:system-ui,-apple-system,PingFang SC,Microsoft YaHei,sans-serif;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}.app{max-width:720px;margin:0 auto;padding:0 10px calc(78px + env(safe-area-inset-bottom))}.topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 4px 10px;background:var(--bg)}.brand{font-size:15px;font-weight:700;letter-spacing:.16em;color:var(--ink)}.logout{background:var(--pill);color:var(--ink-2);border:1px solid var(--ink);border-radius:var(--radius-inner);font-size:12px;padding:5px 14px}.card{border:2px solid var(--ink);background:var(--card-white);border-radius:var(--radius-card);box-shadow:var(--shadow-card);padding:18px 18px 16px;margin-bottom:18px}.card-sage{background:var(--card-sage);padding:20px 18px 16px;position:relative}.card-title{display:flex;align-items:center;gap:8px;margin:0 0 6px;font-size:17px;font-weight:700;color:var(--ink)}.card-note strong{font-weight:700;color:var(--ink);letter-spacing:0}.card-note{margin:0;font-size:12.5px;line-height:1.7;color:var(--ink-2)}.seg-label{display:flex;align-items:baseline;gap:6px;margin:0 0 8px;font-size:12.5px;font-weight:700;letter-spacing:.04em;color:var(--ink)}.seg-label small{font-weight:400;color:var(--ink-3);letter-spacing:0}.dashed{border:0;border-top:1px dashed var(--line);margin:14px 0}.eyebrow{margin:0 0 10px;font-size:11.5px;font-weight:700;letter-spacing:.2em;color:var(--ink-2)}.hero-title{margin:0 0 8px;font-size:34px;line-height:1.15;font-weight:800;letter-spacing:.02em;color:var(--ink)}.hero-sub{margin:0 0 16px;font-size:13.5px;line-height:1.6;color:var(--ink-2)}.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.chip{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;background:var(--pill);border:1px solid var(--ink);border-radius:var(--radius-inner);font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap}.chip.sage{background:var(--card-sage)}.chip.soft{background:var(--inset);border-color:var(--line);color:var(--ink-2)}.chips .chip{margin:0}.chip .dot{width:6px;height:6px;border-radius:50%;background:var(--ink-2)}.card .chip{margin:0}.card>.chip{margin:4px 0 10px}.page{padding-top:2px}.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:8px 0}.hint{color:var(--ink-3);font-size:12.5px;line-height:1.6}.err{color:#8f2f22;background:#fbeee9;border:1px solid #e8c4b9;border-radius:var(--radius-inner);padding:8px 12px;font-size:13px;margin:10px 0}.ok{color:#2c5433;background:#e9f2e2;border:1px solid #b9d3ae;border-radius:var(--radius-inner);padding:8px 12px;font-size:13px;margin:10px 0}input,select,textarea,button{font:inherit;color:var(--ink);padding:10px 12px;border:1px solid var(--line);border-radius:var(--radius-inner);background:var(--field);-webkit-appearance:none;-moz-appearance:none;appearance:none}input::placeholder,textarea::placeholder{color:#98a296}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--ink);background:#fff}select{border:1px solid var(--ink);background-color:var(--pill);font-weight:600;padding-right:30px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' fill='none' stroke='%231c2a1e' stroke-width='1.6' stroke-linecap='round'/></svg>");background-repeat:no-repeat;background-position:right 12px center}textarea{width:100%;min-height:84px;resize:vertical;line-height:1.6}button{background:var(--ink);color:#fbfaf3;border:1px solid var(--ink);font-weight:600;padding:10px 20px;cursor:pointer}button:active{opacity:.86}button:disabled{opacity:.55;cursor:default}button.ghost{background:var(--pill);color:var(--ink);border:1px solid var(--ink);font-size:13px;font-weight:600;padding:8px 16px}button.ghost:disabled{color:var(--ink-3);border-color:var(--line)}.pass-input{letter-spacing:.08em;font-size:16px}.login-wrap{min-height:100%;display:flex;align-items:center;justify-content:center;padding:24px 12px}.login{width:100%;max-width:380px}.login .card-sage{margin-bottom:12px}.login-title{margin:0 0 6px;font-size:30px;font-weight:800;letter-spacing:.04em;color:var(--ink)}.login-form{display:flex;flex-direction:column;gap:10px}.login-form label{font-size:12.5px;font-weight:700;color:var(--ink);letter-spacing:.04em}.login-form input,.login-form select{width:100%;padding:12px 14px}.login-form button{margin-top:4px;padding:12px 20px;font-size:15px}.tabbar{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:720px;display:flex;gap:4px;background:var(--bg);border-top:2px solid var(--ink);padding:6px 8px calc(6px + env(safe-area-inset-bottom));z-index:20}.tab{flex:1;text-align:center;text-decoration:none;color:var(--ink-3);font-size:12.5px;font-weight:600;letter-spacing:.06em;padding:9px 0;border:1px solid transparent;border-radius:var(--radius-inner)}.tab.router-link-active{color:var(--ink);background:var(--card-sage);border-color:var(--ink)}.entries{list-style:none;padding:0;margin:0}.entries>li{position:relative;background:var(--inset);border-radius:var(--radius-inner);padding:12px 14px;margin:0 0 12px}.entries>li.hint{background:transparent;padding:4px 2px;margin:0}.entry-head{display:flex;gap:8px;flex-wrap:wrap;align-items:baseline;padding-right:52px}.entry-title{font-size:15px;font-weight:700;color:var(--ink)}.entry-meta{font-size:12px;color:var(--ink-3)}.del-group{position:absolute;top:8px;right:10px;display:flex;gap:6px;align-items:center}button.del-entry{background:transparent;color:var(--ink-3);border:1px solid transparent;border-radius:var(--radius-inner);font-size:12px;font-weight:600;padding:2px 8px}button.del-entry.danger{background:var(--danger);color:#fff;border-color:var(--danger)}button.del-entry:disabled{opacity:.6;cursor:default}.content{margin:8px 0 0;font-size:13.5px;line-height:1.7;color:var(--ink-2);white-space:pre-wrap}.picker{margin-top:10px}.thumbs{list-style:none;display:flex;gap:8px;flex-wrap:wrap;padding:0;margin:10px 0 0}.thumbs li{position:relative;margin:0}.thumbs img{width:68px;height:68px;object-fit:cover;border-radius:var(--radius-inner);border:1px solid var(--ink);cursor:zoom-in;display:block}.thumbs .del{position:absolute;top:-7px;right:-7px;width:20px;height:20px;line-height:1;padding:0;border-radius:var(--radius-inner);background:var(--ink);color:#fbfaf3;border:1px solid var(--card-white);font-size:12px}.mask{position:fixed;top:0;right:0;bottom:0;left:0;background:#141c14e6;display:flex;align-items:center;justify-content:center;padding:16px;z-index:50}.mask img{max-width:100%;max-height:100%;border-radius:var(--radius-inner)}.add-form{display:flex;flex-direction:column;gap:10px;margin-top:12px}.add-form .row{margin:0}.add-form .row>input{flex:1 1 130px;min-width:0}.add-form>button{margin-top:4px;padding:12px 20px;font-size:15px}.field-note{margin:2px 0 0;font-size:12px;line-height:1.6;color:var(--ink-3)}ul{padding-left:18px}li{margin:4px 0}.device,.statusbar,.punch,.homebar{display:none}@media (min-width: 760px){:root{--screen-h: min(832px, calc(100vh - 48px) );--screen-w: calc(var(--screen-h) * .4615385);--bezel: 8px;--device-w: calc(var(--screen-w) + var(--bezel) * 2);--device-h: calc(var(--screen-h) + var(--bezel) * 2);--screen-radius: 26px;--device-radius: 32px;--statusbar-h: 34px}body{display:block;min-height:100vh;background:radial-gradient(120% 86% at 50% -12%,#f4efe4,#e7e0d1 44%,#d7cdb8) fixed}.device{display:block;position:fixed;top:0;right:0;bottom:0;left:0;margin:auto;width:var(--device-w);height:var(--device-h);border-radius:var(--device-radius);background:linear-gradient(150deg,#cfd4d7,#959b9f,#c6ccd0 16%,#7d8387 30%,#a8aeb2,#71777b 60%,#bcc1c4 76%,#868c90 90%,#cbcfd2);box-shadow:0 0 0 1px #3f4548,inset 0 0 0 1px #ffffff8c,inset 0 2px 5px #ffffff4d,inset 0 -3px 7px #0000002e,0 10px 18px -8px #181e186b,0 40px 80px -28px #181e1899;z-index:0}.device:before{content:"";position:absolute;inset:var(--bezel);border-radius:var(--screen-radius);background:#05080a}.device__key{position:absolute;right:-4px;width:5px;border-radius:50%;background:linear-gradient(90deg,#6f7579,#c2c7ca 45%,#858b8f);box-shadow:1px 0 3px #00000073}.device__key--vol{top:130px;height:62px}.device__key--pwr{top:210px;height:36px}#app{position:fixed;top:0;right:0;bottom:0;left:0;margin:auto;width:var(--screen-w);height:var(--screen-h);border-radius:var(--screen-radius);background:var(--bg);overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;box-shadow:inset 0 0 0 2px #080b09d9;z-index:1}#app::-webkit-scrollbar{width:0;height:0}.statusbar{display:flex;position:fixed;top:calc((100vh - var(--screen-h)) / 2);left:0;right:0;margin:0 auto;width:var(--screen-w);height:var(--statusbar-h);align-items:center;justify-content:space-between;padding:0 18px;font-size:13px;font-weight:700;letter-spacing:.01em;color:var(--ink);background:var(--bg);pointer-events:none;z-index:3}.statusbar__icons{display:flex;align-items:center;gap:5px}.statusbar__icons svg{display:block}.punch{display:block;position:fixed;top:calc((100vh - var(--screen-h)) / 2 + 12px);left:50%;width:9px;height:9px;margin-left:-4.5px;border-radius:50%;background:radial-gradient(circle at 34% 32%,#1d2b38,#070b10 58%,#000);box-shadow:inset 0 0 0 1px #6e91af66;pointer-events:none;z-index:4}.homebar{display:block;position:fixed;bottom:calc((100vh - var(--screen-h)) / 2 + 8px);left:50%;width:108px;height:4px;margin-left:-54px;border-radius:50%;background:#1c2a1e4d;pointer-events:none;z-index:21}.app{padding:var(--statusbar-h) 12px 94px}.app:has(.login-wrap){padding-bottom:var(--statusbar-h)}.topbar{padding-top:4px}.login-wrap{min-height:calc(var(--screen-h) - var(--statusbar-h) * 2)}.tabbar{left:0;right:0;margin:0 auto;bottom:calc((100vh - var(--screen-h)) / 2);width:var(--screen-w);max-width:none;transform:none;border-radius:0 0 var(--screen-radius) var(--screen-radius);padding-bottom:calc(22px + env(safe-area-inset-bottom))}.mask{top:calc((100vh - var(--screen-h)) / 2);bottom:auto;left:0;right:0;margin:0 auto;width:var(--screen-w);height:var(--screen-h);border-radius:var(--screen-radius);transform:none}}