:root{--lavender:#e7e2f3;--purple-start:#7b6aa6;--purple-end:#675591;--gold:#bfa066;--gold-light:#f4ecd8;--cream:#f4f0e4;--ink:#33303d;--hint:#8a8594}*{box-sizing:border-box}body{background:var(--lavender);min-height:100vh;color:var(--ink);margin:0;padding:32px 16px;font-family:Noto Sans TC,PingFang TC,Microsoft JhengHei,system-ui,sans-serif}#app{justify-content:center;display:flex}.card{background:#fff;border-radius:20px;width:100%;max-width:760px;overflow:hidden;box-shadow:0 20px 45px #6755912e}.header{background:linear-gradient(135deg, var(--purple-start), var(--purple-end));border-radius:20px 20px 0 0;padding:28px 36px 32px}.header__breadcrumb{color:#e2cfa0;letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px;font-size:12px}.header__title{color:#fff;letter-spacing:.04em;margin:0 0 18px;font-family:Georgia,Noto Serif TC,serif;font-size:30px;font-weight:600}.flowname{border-bottom:1px solid #ffffff59;margin-bottom:20px;padding-bottom:8px}.flowname__input{color:#fff;background:0 0;border:none;outline:none;width:100%;padding:4px 2px;font-size:20px;font-weight:500}.flowname__input::placeholder{color:#ffffff8c}.flowname__input:disabled{color:#ffffffd9}.header__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 20px;display:grid}.header-field{flex-direction:column;gap:4px;display:flex}.header-field__label{color:#ffffffb3;letter-spacing:.03em;font-size:12px}.header-field__input{color:#fdfaf3;background:#ffffff24;border:1px solid #ffffff40;border-radius:8px;outline:none;padding:8px 10px;font-size:14px}.header-field__input::placeholder{color:#fdfaf38c}.header-field__input:focus{border-color:var(--gold);background:#ffffff38}.tags{background:#fff;flex-wrap:wrap;gap:10px;padding:20px 36px;display:flex}.tag{background:var(--gold-light);cursor:pointer;border:1px solid #e3d3ac;border-radius:999px;align-items:center;gap:8px;padding:8px 16px;font-size:13px;transition:background .15s,border-color .15s;display:flex}.tag--checked{border-color:var(--gold);background:#ecd9ad}.tag__checkbox{width:15px;height:15px;accent-color:var(--gold)}.tag__label{color:#5c5240}.body{background:#fff;flex-direction:column;gap:22px;padding:8px 36px 28px;display:flex}.section{flex-direction:column;gap:6px;display:flex}.section__heading{align-items:center;gap:10px;display:flex}.section__badge{background:var(--gold);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:26px;height:26px;font-size:14px;display:inline-flex}.section__title{color:var(--ink);font-size:15px;font-weight:700}.section__hint{color:var(--hint);margin-left:36px;font-size:12.5px}.section__textarea{background:var(--cream);min-height:90px;color:var(--ink);resize:vertical;border:1px solid #e6ded0;border-radius:10px;outline:none;margin-left:36px;padding:14px 16px;font-family:inherit;font-size:14px}.section__textarea:focus{border-color:var(--gold)}.section__emphasis{color:var(--gold);margin-left:4px;font-weight:700}.risk__options{flex-wrap:wrap;gap:10px;margin-left:36px;display:flex}.risk__option{background:var(--cream);cursor:pointer;border:1px solid #e6ded0;border-radius:999px;align-items:center;gap:8px;padding:8px 18px;font-size:14px;transition:background .15s,border-color .15s;display:flex}.risk__option--checked{background:var(--gold-light);border-color:var(--gold)}.risk__radio{accent-color:var(--gold)}.risk__backup{margin-top:10px;margin-left:36px}.risk__backup.hidden{display:none}.actions{background:#fff;justify-content:flex-end;gap:10px;padding:16px 36px 28px;display:flex}.btn{cursor:pointer;border:none;border-radius:999px;padding:10px 26px;font-size:14px;font-weight:600}.btn--save{background:linear-gradient(135deg, var(--purple-start), var(--purple-end));color:#fff}.btn--save:hover{opacity:.92}.btn--export{color:var(--purple-end);background:#fff;border:1px solid #c9bfe0}.btn--export:hover{background:#f4f2fa}.btn--delete{color:#a3453f;background:#fff;border:1px solid #e2b8b4}.btn--delete:hover{background:#fdf3f2}.delete-confirm{align-items:center;gap:8px;display:flex}.delete-confirm__text{color:#a3453f;font-size:13px;font-weight:600}.btn--delete-confirm{color:#fff;background:#a3453f}.btn--delete-confirm:hover{opacity:.92}.btn--delete-cancel{color:#666;background:#fff;border:1px solid #ddd}.btn--delete-cancel:hover{background:#f4f4f4}.copy-hint{color:var(--gold);opacity:0;pointer-events:none;align-self:center;font-size:13px;transition:opacity .4s}.copy-hint--visible{opacity:1}.login{border-radius:20px;width:100%;max-width:400px;overflow:hidden;box-shadow:0 20px 45px #6755912e}.login__header{text-align:center}.login__title{margin-bottom:8px}.login__subtitle{color:#ffffffd9;margin:0;font-size:13px}.login__body{background:#fff;flex-direction:column;align-items:center;gap:16px;padding:32px 36px 36px;display:flex}.login__google,.login__magic{width:100%;max-width:300px;padding:12px 24px;font-size:15px}.login__label{color:var(--hint);align-self:flex-start;margin:0;font-size:13px}.login__input{background:var(--cream);width:100%;max-width:300px;color:var(--ink);border:1px solid #e6ded0;border-radius:8px;outline:none;padding:12px 14px;font-size:15px}.login__input:focus{border-color:var(--gold)}.login__message{color:#2e7d5b;text-align:center;min-height:18px;margin:0;font-size:13px}.login__dev{border-top:1px dashed #e6ded0;flex-direction:column;gap:8px;width:100%;max-width:300px;padding-top:16px;display:flex}.login__dev-label{color:var(--hint);text-align:center;margin:0;font-size:12px}.login__dev-input{background:var(--cream);color:var(--ink);border:1px solid #e6ded0;border-radius:8px;outline:none;padding:10px 12px;font-size:14px}.login__dev-input:focus{border-color:var(--gold)}.login__dev-submit{width:100%}.login__error{color:#a3453f;text-align:center;min-height:18px;margin:0;font-size:13px}.layout{flex-direction:column;gap:16px;width:100%;max-width:1100px;display:flex}.layout__topbar{justify-content:space-between;align-items:center;padding:4px 4px 0;display:flex}.layout__brand{color:var(--purple-end);font-family:Georgia,Noto Serif TC,serif;font-size:18px;font-weight:600}.layout__logout{color:var(--purple-end);cursor:pointer;background:#fff;border:1px solid #c9bfe0;border-radius:999px;padding:6px 16px;font-size:13px}.layout__logout:hover{background:#f4f2fa}.layout__body{align-items:flex-start;gap:20px;display:flex}.layout__side{background:#fff;border-radius:16px;flex-direction:column;flex-shrink:0;gap:12px;width:280px;padding:18px;display:flex;box-shadow:0 12px 30px #67559124}.layout__main{flex:1;min-width:0}.layout__placeholder{text-align:center;color:var(--hint);background:#fff;border-radius:16px;margin:0;padding:48px 24px;box-shadow:0 12px 30px #67559124}.layout__toast{color:#fff;opacity:0;pointer-events:none;z-index:50;background:#2e7d5b;border-radius:999px;padding:8px 18px;font-size:14px;font-weight:600;transition:opacity .2s,transform .2s;position:fixed;top:16px;left:50%;transform:translate(-50%)translateY(-8px);box-shadow:0 6px 20px #00000026}.layout__toast--show{opacity:1;transform:translate(-50%)translateY(0)}.list__new{background:linear-gradient(135deg, var(--purple-start), var(--purple-end));color:#fff;cursor:pointer;border:none;border-radius:10px;width:100%;padding:10px 14px;font-size:13px;font-weight:600}.list__new:hover{opacity:.92}.list__filter{background:var(--cream);width:100%;color:var(--ink);border:1px solid #e6ded0;border-radius:8px;padding:6px 8px;font-size:13px}.list__items{flex-direction:column;gap:8px;max-height:60vh;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.list__item{cursor:pointer;border:1px solid #e6ded0;border-radius:10px;padding:10px 34px 10px 12px;transition:background .15s,border-color .15s;position:relative}.list__item:hover{background:var(--cream)}.list__item--selected{background:var(--gold-light);border-color:var(--gold)}.list__item-del{width:20px;height:20px;color:var(--hint);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:0;font-size:13px;line-height:1;position:absolute;top:8px;right:8px}.list__item-del:hover{color:#a3453f;background:#f3d9d6}.list__item--confirming{align-items:center;gap:8px;padding:10px 12px;display:flex}.list__item-confirm-msg{color:#a3453f;flex:1;font-size:13px}.list__item-confirm-yes,.list__item-confirm-no{cursor:pointer;background:#fff;border:1px solid #e6ded0;border-radius:6px;padding:4px 10px;font-size:12px}.list__item-confirm-yes{color:#fff;background:#a3453f;border-color:#a3453f}.list__item-title{color:var(--ink);text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:600;overflow:hidden}.list__item-meta{color:var(--hint);text-overflow:ellipsis;white-space:nowrap;margin-top:2px;font-size:12px;overflow:hidden}.list__count{color:var(--hint);text-align:center;border-top:1px dashed #e6ded0;padding-top:4px;font-size:12px}@media (width<=720px){.layout__body{flex-direction:column}.layout__side{width:100%}}@media (width<=560px){.header__grid{grid-template-columns:1fr}.header,.tags,.body,.actions{padding-left:20px;padding-right:20px}.section__hint,.section__textarea,.risk__options,.risk__backup{margin-left:0}}