:root{--bg:#f4f6f3;--fg:#1c2520;--muted:#54635a;--card:#fff;--line:#cfd8d1;--accent:#1d6b4a;--accent-fg:#fff;--danger:#a11d1d;--warn:#fff0cc}
@media (prefers-color-scheme:dark){:root{--bg:#111815;--fg:#eaf1ec;--muted:#aebdb3;--card:#1a241e;--line:#33443b;--accent:#58c394;--accent-fg:#06281a;--danger:#ff9a9a;--warn:#4a3a10}}
*{box-sizing:border-box}html{font-size:106.25%}
body.a{margin:0;background:var(--bg);color:var(--fg);font-family:"Hiragino Sans","Noto Sans JP","Yu Gothic UI",system-ui,sans-serif;line-height:1.6}
.narrow main{max-width:26rem;margin:0 auto;padding:1.5rem 1rem}
header.top{background:var(--accent);color:var(--accent-fg);display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;padding:.5rem 1rem}
header.top h1{font-size:1.1rem;margin:0;flex:1}
header.top button,header.top .btn{background:transparent;color:inherit;border-color:currentColor}
header.top a[aria-current="page"]{background:var(--accent-fg);color:var(--accent);border-color:var(--accent-fg);font-weight:700}
header.top .logout{margin-left:auto}
#app{max-width:60rem;margin:0 auto;padding:1rem;min-height:60vh}
h1,h2,h3{line-height:1.3}h2{font-size:1.2rem;margin:1.5rem 0 .6rem}h3{font-size:1.05rem;margin:.2rem 0}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:.9rem 1rem;margin:.7rem 0}
.row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.row.sp{justify-content:space-between}
.stack>*{margin:.55rem 0}.grow{flex:1}
label{display:block;font-weight:700;font-size:.9rem}
label.inline{display:flex;gap:.5rem;align-items:flex-start;font-weight:400}
label.inline input{width:auto;margin-top:.3rem}
label.inline input[type=checkbox]{width:1.4rem;height:1.4rem;flex:none}
input,select,textarea{display:block;width:100%;margin-top:.25rem;padding:.6rem .7rem;font:inherit;color:var(--fg);background:var(--card);border:1px solid var(--line);border-radius:8px;min-height:44px}
textarea{min-height:5.5rem;resize:vertical}
button,.btn{font:inherit;min-height:44px;padding:.45rem 1rem;border-radius:8px;border:1px solid var(--line);background:var(--card);color:var(--fg);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center}
button.primary,.btn.primary{background:var(--accent);color:var(--accent-fg);border-color:var(--accent);font-weight:700}
button.danger{color:var(--danger);border-color:var(--danger)}
button:disabled{opacity:.5;cursor:not-allowed}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:3px solid #f59e0b;outline-offset:2px}
.err{color:var(--danger);font-weight:700;white-space:pre-line}.ok{color:var(--accent);font-weight:700}
.muted{color:var(--muted);font-size:.9rem}
.badge{display:inline-block;font-size:.85rem;font-weight:700;border-radius:999px;padding:.05rem .65rem;background:var(--line)}
.badge.pub{background:var(--accent);color:var(--accent-fg)}.badge.warn{background:var(--warn);color:var(--fg)}
.tabs{display:flex;gap:.4rem;flex-wrap:wrap;margin:.5rem 0}.tabs button[aria-current="page"]{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}
.grid2{display:grid;gap:.6rem;grid-template-columns:1fr}@media(min-width:42rem){.grid2{grid-template-columns:1fr 1fr}}
.thumb{width:72px;height:72px;object-fit:cover;border-radius:8px;background:var(--line)}
.mgrid{display:grid;gap:.6rem;grid-template-columns:repeat(auto-fill,minmax(10rem,1fr))}
.mgrid .card{margin:0}
dialog{border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--fg);max-width:34rem;width:calc(100% - 2rem)}
dialog::backdrop{background:rgba(0,0,0,.5)}
table{border-collapse:collapse;width:100%;font-size:.9rem}th,td{border-bottom:1px solid var(--line);padding:.4rem;text-align:left;vertical-align:top}
.scroll{overflow-x:auto}
pre.url{white-space:pre-wrap;word-break:break-all;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:.6rem}
.req{display:inline-block;font-size:.85rem;font-weight:700;background:var(--danger);color:var(--card);border-radius:4px;padding:0 .4rem;margin-left:.4rem;vertical-align:middle}
.note{background:var(--warn);color:var(--fg);border:2px solid var(--danger);border-radius:10px;padding:.7rem 1rem;font-weight:700}
.guide{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:.2rem 1rem}
.dlg-err{margin-top:.8rem}
.dlg-actions{margin-top:1rem;padding-top:.8rem;border-top:1px solid var(--line)}
.dlg-danger{margin-top:1rem;padding-top:.8rem;border-top:1px dashed var(--danger)}
.expired{position:fixed;left:0;right:0;top:0;z-index:1000;background:var(--warn);color:var(--fg);border-bottom:3px solid var(--danger);padding:.7rem 1rem;font-weight:700}
.expired p{margin:.3rem 0}.expired .muted{font-weight:400}
.expired.in-dlg{position:static;border:2px solid var(--danger);border-radius:10px;margin-top:1rem}
pre.codes{font-size:1.1rem;letter-spacing:.05em;white-space:pre-wrap;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:.6rem}
img.qr{display:block;width:240px;height:240px;background:#fff;border:1px solid var(--line);border-radius:8px}
.sitefoot{max-width:60rem;margin:0 auto;padding:1rem 1rem 2rem;border-top:1px solid var(--line);font-size:.9rem;color:var(--muted)}
.sitefoot nav{display:flex;flex-wrap:wrap;gap:.25rem 1rem}
.sitefoot a{color:inherit;display:inline-block;min-height:44px;line-height:44px}
.sitefoot p{margin:.25rem 0 0}
.narrow .sitefoot{max-width:26rem}