:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#20383c;background:#f8f5ed;font-size:19px;line-height:1.6;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button,a,input,textarea{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:wait;opacity:.6}a{color:#17665f}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:4px solid #dc962a;outline-offset:4px}.site-header{max-width:1160px;margin:auto;padding:26px 28px;display:flex;gap:24px;align-items:center;justify-content:space-between;border-bottom:1px solid #dcded3}.brand{font-weight:800;color:#173b3d;text-decoration:none;display:flex;align-items:center;gap:12px;font-size:1.25rem}.brand-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:15px;background:#173b3d;color:#f6dfae;font-size:1.7rem}nav{display:flex;gap:10px;flex-wrap:wrap;align-items:center}main{max-width:1050px;margin:48px auto 70px;padding:0 28px;min-height:60vh}h1{font-size:clamp(2rem,5vw,3rem);line-height:1.2;letter-spacing:-.035em;margin:14px 0 18px;color:#183a3e}h2{font-size:1.4rem;line-height:1.35;margin:0 0 18px}h3{font-size:1.15rem;margin:0 0 12px}p{margin:10px 0 20px}.eyebrow{text-transform:uppercase;letter-spacing:.13em;font-weight:750;font-size:.78rem;color:#17665f}.muted{color:#52676b}.intro{max-width:740px;font-size:1.12rem}.card{background:#fffefa;border:1px solid #dfdfd4;border-radius:24px;padding:32px;box-shadow:0 8px 30px #253c3310}.login{max-width:580px;margin:36px auto}.login .eyebrow{margin-bottom:20px}.login h1{font-size:2.2rem}.choices{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:36px 0}.choice{text-align:left;display:flex;flex-direction:column;align-items:flex-start;padding:34px;border:1px solid #cbd9cd;background:#eaf0e6;border-radius:24px;min-height:280px;color:#173b3d;transition:transform .16s,box-shadow .16s}.choice:hover{transform:translateY(-3px);box-shadow:0 12px 24px #173b3d15}.choice.secondary{background:#173b3d;color:#fff9e9;border-color:#173b3d}.choice-icon{font-size:2.3rem;line-height:1;margin-bottom:30px}.choice-title{font-size:1.55rem;font-weight:750;line-height:1.3}.choice-description{display:block;font-size:1rem;margin-top:12px}.choice-arrow{margin-top:auto;padding-top:18px;font-size:1.4rem}.button{border:1px solid #b7c5be;background:transparent;color:#173b3d;border-radius:12px;padding:12px 20px;min-height:52px;font-weight:650;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px}.button:hover{background:#e7ece2}.button.primary{background:#17665f;color:white;border-color:#17665f}.button.primary:hover{background:#114e49}.button.danger{color:#9c3229;border-color:#d6a69d;background:#fff8f5}.button.small{font-size:.88rem;padding:9px 14px;min-height:46px}.button.wide{width:100%}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.back{margin-bottom:25px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.field{display:flex;flex-direction:column;gap:7px;margin-bottom:21px}.field label{font-weight:700}.field input,.field textarea,.search{width:100%;min-height:56px;border:2px solid #aabcb5;border-radius:11px;background:white;padding:12px 14px;color:#20383c}.field textarea{resize:vertical;min-height:115px}.field small{font-size:.85rem;color:#52676b}.password-wrap{display:flex;gap:8px}.password-wrap input{min-width:0;flex:1}.password-wrap .button{flex-shrink:0}.error{padding:14px 18px;background:#fff0eb;color:#8b2b24;border-left:4px solid #b34839;border-radius:8px;margin:18px 0}.hidden{display:none!important}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin:26px 0}.toolbar .search{flex:1;min-width:200px;max-width:560px}.entry-list{display:grid;gap:14px}.entry-button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;text-align:left;background:#fffefa;border:1px solid #d8dfd4;border-radius:17px;padding:21px 24px;color:inherit}.entry-button:hover{border-color:#17665f;background:#f0f5ec}.entry-title{font-weight:750;font-size:1.2rem;display:block;overflow-wrap:anywhere}.entry-user{display:block;color:#52676b;overflow-wrap:anywhere}.entry-date{font-size:.82rem;color:#52676b;display:block;margin-top:4px}.entry-arrow{font-size:1.8rem;color:#17665f}.empty{text-align:center;padding:50px 25px;border:1px dashed #aabcb5;border-radius:20px}.detail-grid{display:grid;gap:24px;margin:0}.detail-grid dt{color:#52676b;font-size:.9rem;margin-bottom:4px}.detail-grid dd{margin:0;font-size:1.12rem;font-weight:650;white-space:pre-wrap;overflow-wrap:anywhere}.secret-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.secret{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;word-break:break-all;background:#edf2e8;border-radius:9px;padding:10px 14px;max-width:100%}.notes{font-weight:400!important}.history-list{display:grid;gap:20px}.history-card{border-left:5px solid #80a698}.history-card .detail-grid{gap:15px}.badge{display:inline-block;padding:4px 12px;border-radius:30px;background:#eaf0e6;color:#17665f;font-weight:700;font-size:.85rem;margin-bottom:12px}.help{background:#eeeadd;padding:20px 24px;border-radius:16px;color:#52605d;font-size:.95rem;margin-top:28px}#notice{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#173b3d;color:#fff;padding:14px 24px;border-radius:13px;box-shadow:0 8px 28px #0002;max-width:calc(100% - 32px);z-index:20}#notice:empty{display:none}footer{text-align:center;padding:0 24px 30px;color:#64716b;font-size:.82rem}.loading{padding:70px 20px;text-align:center}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.count{font-size:.9rem;color:#52676b;margin-bottom:16px}@media(max-width:650px){:root{font-size:18px}.site-header{padding:18px 18px;gap:12px;align-items:flex-start}.brand{font-size:1rem;gap:8px}.brand-icon{width:38px;height:38px;border-radius:12px}nav{justify-content:flex-end;gap:6px}nav .button{font-size:.78rem;padding:8px 10px;min-height:44px}main{margin-top:28px;padding:0 18px}.card{padding:24px 20px;border-radius:18px}.choices{grid-template-columns:1fr;gap:16px;margin-top:26px}.choice{min-height:210px;padding:26px}.choice-icon{margin-bottom:18px}.choice-title{font-size:1.4rem}.form-grid{grid-template-columns:1fr;gap:0}.password-wrap{flex-wrap:wrap}.password-wrap input{flex-basis:70%}.entry-button{padding:18px}.page-heading{align-items:flex-start}.actions .button{flex-grow:1}.login{margin:15px auto}.toolbar .button{flex-grow:1}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Self-hosted fonts keep labels and credential symbols consistent on devices. */
:root{font-family:"Noto Sans",Arial,sans-serif}
h1{letter-spacing:normal}
.password-wrap input,.field input[name="username"],.secret,.credential-text,.entry-user{
  font-family:"Password Symbols","JetBrains Mono",Consolas,monospace;
  font-weight:500;
  font-variant-ligatures:none;
  font-feature-settings:"zero" 1,"liga" 0,"calt" 0;
  letter-spacing:.025em;
}
.password-wrap input,.secret{font-size:24px;line-height:1.6}
.entry-user{font-size:1rem}
.detail-grid dd.credential-text{font-weight:500}
.character-zero,.character-letter{font-family:"Password Symbols","JetBrains Mono",Consolas,monospace;font-feature-settings:"zero" 1,"liga" 0,"calt" 0;border-radius:3px}
.character-zero{background:#fff0bb;color:#533d00;box-shadow:inset 0 -2px #a87600}
.character-letter{background:#e0ecff;color:#163e76;box-shadow:inset 0 -2px #4776ad}
.credential-hint{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:8px;font-family:"Noto Sans",Arial,sans-serif;font-size:17px;font-weight:400;line-height:1.7;letter-spacing:normal;color:#334c50;white-space:normal;flex-basis:100%}
.credential-hint[hidden]{display:none}
.list-character-hint{margin:0 0 16px}
.character-key{display:inline-flex;align-items:baseline;gap:6px}
.character-key>.character-zero,.character-key>.character-letter{font-size:21px;font-weight:500;padding:0 4px}

/* Minimal screens keep the language selector separate from the task. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.site-header{position:absolute;top:0;right:0;left:0;max-width:1160px;padding:24px 28px;justify-content:flex-end;border:0;z-index:10}
main{margin-top:112px}
main.home-screen,main.login-screen{min-height:100vh;min-height:100svh;margin:0 auto;padding:100px 28px;display:flex;align-items:center;justify-content:center}
.choices{width:100%;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;margin:0}
.choice{min-width:0;min-height:280px;align-items:center;justify-content:center;text-align:center;padding:36px 28px;gap:28px}
.choice-icon{margin:0;font-size:2.8rem}
.choice-title{overflow-wrap:anywhere}
.login{width:100%;margin:0;max-width:580px}
.language-control{position:relative}
.language-flag{width:30px;height:20px;flex:none;border-radius:2px;box-shadow:0 0 0 1px #0002}
.language-trigger{background:#fffefa;font-weight:650;min-height:52px;white-space:nowrap}
.language-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:205px;padding:6px;background:#fffefa;border:1px solid #b7c5be;border-radius:14px;box-shadow:0 8px 24px #173b3d18}
.language-menu[hidden]{display:none}
.language-option{display:flex;width:100%;justify-content:flex-start;border:0;white-space:nowrap;min-height:52px}
.language-option[aria-checked="true"]{background:#e7ece2}
@media(max-width:650px){
  .site-header{padding:18px;align-items:center}
  .site-header nav .button{font-size:1rem;min-height:48px;padding:10px 14px}
  main{margin-top:100px}
  main.home-screen,main.login-screen{padding:90px 18px}
  .choices{grid-template-columns:minmax(0,1fr);gap:18px;max-width:450px;margin:0}
  .choice{min-height:190px;padding:28px 22px;gap:20px}
  .choice-icon{margin:0;font-size:2.5rem}
  .login{margin:0}
}