:root{
  --bg:#F9F1EE;--panel:#FFFAF8;--ink:#3A2B27;--accent:#C2573F;--fixed:#B8851F;
  --ink-2:#6E5A54;--ink-3:#8C766F;--line:#E6D6D0;--line-strong:#CDB5AC;--soft:#F5E6E1;
  --on-accent:#FFFFFF;--accent-text:#A8412A;--danger:#A8402C;
  --g1-bg:#C2573F;--g1-fg:#FFFFFF;--g2-bg:#D9836C;--g2-fg:#2A1B17;--g3-bg:#EDBFB2;--g3-fg:#3A2B27;
  --ui:"Yu Gothic UI","Meiryo UI","Hiragino Sans","Noto Sans JP","Noto Sans CJK JP",system-ui,sans-serif;
  color-scheme:light;
}
:root[data-theme="dark"]{
  --bg:#1B1412;--panel:#251B18;--ink:#F1E5E1;--accent:#EE8F78;--fixed:#E3B04A;
  --ink-2:#C4AFA8;--ink-3:#97827B;--line:#3A2C28;--line-strong:#57433D;--soft:#33231F;
  --on-accent:#1B1412;--accent-text:#EE8F78;--danger:#F08F7E;
  --g1-bg:#EE8F78;--g1-fg:#1B1412;--g2-bg:#C46F5B;--g2-fg:#1B1412;--g3-bg:#6F3D33;--g3-fg:#F1E5E1;
  color-scheme:dark;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#1B1412;--panel:#251B18;--ink:#F1E5E1;--accent:#EE8F78;--fixed:#E3B04A;
  --ink-2:#C4AFA8;--ink-3:#97827B;--line:#3A2C28;--line-strong:#57433D;--soft:#33231F;
  --on-accent:#1B1412;--accent-text:#EE8F78;--danger:#F08F7E;
  --g1-bg:#EE8F78;--g1-fg:#1B1412;--g2-bg:#C46F5B;--g2-fg:#1B1412;--g3-bg:#6F3D33;--g3-fg:#F1E5E1;
  color-scheme:dark;
}}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.6 var(--ui)}
body{min-height:100vh;display:flex;flex-direction:column}
h1,h2,h3{margin:0}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:1px solid var(--line-strong);background:var(--panel);border-radius:8px;padding:6px 12px;line-height:1.4}
button:hover{border-color:var(--accent)}
button:disabled{opacity:.5;cursor:default}
button.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:600;padding:8px 20px}
button.primary:hover{filter:brightness(1.06)}
button.danger{color:var(--danger)}
button.linklike{border:0;background:none;color:var(--accent-text);text-decoration:underline;padding:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
input[type=number],select,textarea{background:var(--bg);border:1px solid var(--line-strong);border-radius:8px;padding:5px 8px}
input[type=number]{width:5.2em}
input[type=checkbox],input[type=radio]{accent-color:var(--accent)}
textarea{width:100%;resize:vertical;line-height:1.5}

.hdr{display:flex;align-items:center;gap:14px;padding:10px 16px;border-bottom:1px solid var(--line);background:var(--panel)}
.brand{display:flex;align-items:center;gap:10px;font-weight:600}
.logo{width:30px;height:30px;color:var(--ink);flex-shrink:0}
.logo-eye{fill:var(--accent)}
.brand-name{font-size:20px;letter-spacing:.04em}
.brand-sub{font-size:12px;font-weight:400;color:var(--ink-3)}
.privacy{margin:0 0 0 auto;font-size:12px;color:var(--accent-text);border:1px solid var(--accent);border-radius:999px;padding:1px 10px}
.icon-btn{width:34px;height:30px;padding:0;background:transparent}

.wrap{flex:1;display:grid;grid-template-columns:minmax(260px,320px) minmax(0,1fr);gap:16px;padding:16px;width:100%;max-width:1200px;margin:0 auto;align-items:start}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.roster h2{font-size:16px}
.hint{margin:4px 0 8px;color:var(--ink-2);font-size:13px}
.hint.small{font-size:12px;color:var(--ink-3);margin:6px 0}
.row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:8px 0}
.row.between{justify-content:space-between}
.grp{display:inline-flex;gap:6px;flex-wrap:wrap}
.count{font-weight:600}
.note{margin:4px 0;font-size:12px;color:var(--fixed)}
.note:not([hidden]){display:block}

.tabs{display:flex;gap:4px;margin-bottom:-1px;position:relative;z-index:1}
.tabs button{border-radius:10px 10px 0 0;border-color:var(--line);background:transparent;padding:8px 22px;color:var(--ink-2)}
.tabs button[aria-selected="true"]{background:var(--panel);border-bottom-color:var(--panel);color:var(--ink);font-weight:600;box-shadow:inset 0 3px 0 var(--accent)}
.panel{border-top-left-radius:0}
.panel:not([hidden]){display:block}

.controls{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;margin-bottom:10px}
.seg{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 16px;align-items:center}
.seg legend{float:left;padding:0 10px 0 0;color:var(--ink-2);font-size:13px}
.num:not([hidden]){display:inline-flex;align-items:center;gap:8px}
.num label{display:inline-flex;align-items:center;gap:6px}
.chk{display:inline-flex;align-items:center;gap:6px}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:12px 0}

.cond{border:1px solid var(--line);border-radius:10px;padding:6px 12px;margin:6px 0}
.cond summary{cursor:pointer;color:var(--ink-2);font-size:13px;padding:2px 0}
.ed{padding:10px 0 4px;border-top:1px dashed var(--line);margin-top:8px}
.ed-h{font-weight:600;font-size:13px}
.ed-d{margin:2px 0 6px;color:var(--ink-3);font-size:12px}
.ed-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px}
.ed-row select{max-width:11em}
.chips{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--soft);border:1px solid var(--line);border-radius:999px;padding:2px 4px 2px 12px;font-size:13px}
.chip button{border:0;background:none;padding:0 6px;color:var(--ink-3);border-radius:999px;line-height:1.3}
.chip button:hover{color:var(--danger)}

.msg{margin:8px 0;padding:8px 12px;border-radius:8px;background:var(--soft);border-left:4px solid var(--accent);font-size:14px}
.msg:not([hidden]){display:block}
.msg.warn{border-left-color:var(--fixed)}

.gcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px;margin:8px 0}
.gcard{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--panel);min-height:80px}
.gcard.over{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}
.gcard.target{cursor:copy}
.gh{display:flex;justify-content:space-between;align-items:baseline;padding:7px 12px;font-weight:700}
.gh small{font-weight:600;font-size:12px}
.g0 .gh{background:var(--g1-bg);color:var(--g1-fg)}
.g1 .gh{background:var(--g2-bg);color:var(--g2-fg)}
.g2 .gh{background:var(--g3-bg);color:var(--g3-fg)}
.gl{list-style:none;margin:0;padding:6px 8px 8px;display:flex;flex-direction:column;gap:3px}
.person{display:flex;align-items:center;gap:6px;width:100%;text-align:left;border:1px solid transparent;background:transparent;padding:3px 6px;border-radius:6px}
.person:hover{background:var(--soft);border-color:var(--line)}
.person.sel{background:var(--soft);border-color:var(--accent);font-weight:600}
.person[draggable="true"]{cursor:grab}
.lock{width:14px;height:14px;color:var(--fixed);flex-shrink:0}
.lock-body{fill:var(--fixed)}
.lock-line{fill:none;stroke:var(--fixed);stroke-width:1.6}
.export{margin-top:12px}

.seatwrap{margin:8px 0;padding:8px;border:1px solid var(--line);border-radius:12px;background:var(--bg);overflow:auto}
.seatwrap svg{display:block;margin:0 auto;max-width:100%;height:auto}
.sv-table{fill:none;stroke:var(--line-strong);stroke-width:2}
.sv-seat{fill:var(--panel);stroke:var(--line-strong);stroke-width:1.5}
.sv-seat-fixed{fill:var(--panel);stroke:var(--fixed);stroke-width:2.5}
.sv-seat-empty{fill:none;stroke:var(--line-strong);stroke-width:1.5;stroke-dasharray:4 4}
.sv-num,.sv-note{fill:var(--ink-3)}
.sv-nm{fill:var(--ink)}
.sv-lock{fill:var(--fixed)}
.sv-lock-line{fill:none;stroke:var(--fixed);stroke-width:1.6}

.slots{display:flex;flex-wrap:wrap;gap:10px;margin:8px 0;min-height:4px}
.slot{min-width:9em;padding:14px 22px;border:2px solid var(--line-strong);border-radius:12px;background:var(--bg);font-size:22px;font-weight:700;text-align:center}
.slot.done{border-color:var(--accent);background:var(--soft);color:var(--ink)}
.history{margin-top:18px;border-top:1px solid var(--line);padding-top:10px}
.history h3{font-size:14px}
.hist{margin:6px 0;padding-left:1.6em}
.hist li{margin:2px 0}
.hist time{color:var(--ink-3);font-size:12px;margin-right:8px}
.hist:empty+.hint{display:block}
.hist:not(:empty)+.hint{display:none}

.tz-foot{display:flex;justify-content:center;padding:22px 16px calc(28px + env(safe-area-inset-bottom))}
.tz-link{display:inline-flex;align-items:center;gap:10px;padding:8px 18px 8px 10px;border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--ink-2);text-decoration:none;font-size:12px;line-height:1.4;--tz-gap:var(--panel);transition:border-color .15s,color .15s}
.tz-link:hover{border-color:var(--line-strong);color:var(--ink)}
.tz-mark{width:24px;height:24px;color:#8E5532;flex-shrink:0}
.tz-name{font-size:14px;font-weight:500;letter-spacing:.12em;color:var(--ink)}
.tz-sub{color:var(--ink-3)}
:root[data-theme="dark"] .tz-mark{color:#C9A063}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tz-mark{color:#C9A063}}

.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));transform:translateX(-50%);max-width:min(720px,92vw);background:var(--ink);color:var(--bg);padding:9px 16px;border-radius:10px;font-size:13px;box-shadow:0 4px 18px #0004;z-index:20}
.toast[hidden]{display:none}
.toast[data-kind="error"]{background:#8d3d34;color:#fff}
.offscreen{position:fixed;left:-9999px;top:0}

@media (max-width:860px){
  .wrap{grid-template-columns:minmax(0,1fr);padding:12px}
  .brand-sub,.privacy{display:none}
  .icon-btn{margin-left:auto}
  .tabs button{flex:1;padding:8px 6px}
  .tz-sub{display:none}
  .roster textarea{height:8.5em}
  .seatwrap svg{max-width:none;margin:0}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
@media print{.hdr,.roster,.tabs,.controls,.actions,.cond,.export,.tz-foot{display:none!important}}