/* たびまとめ
   白い面と薄いグレーの地、墨色の文字に、アクセントは藍色ひとつ。
   路線の3色（日程・持ち物・精算）は路線図と駅名標だけに使う。 */
:root{
  --bg:#F2F3F5; --panel:#FFFFFF; --sunken:#F2F3F5; --ink:#1F2328; --sub:#5C636E;
  --rule:#E1E4E8; --rule-strong:#C5CBD3;
  --primary:#1F4E8C; --primary-ink:#FFFFFF; --primary-soft:#E9EFF7;
  --l-date:#1F4E8C; --l-place:#6B4F9E; --l-pack:#CC6E2B; --l-pay:#2E7D4F;
  --ok:#2E7D4F; --warn:#9A6410; --bad:#C0392B;
  --stamp:#C0392B; --stamp-blend:multiply;
  --sat:#1F4E8C; --sun:#C0392B;
  --shadow:0 1px 2px rgba(16,24,40,.05);
  --f-jp:"Noto Sans JP","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic UI","Yu Gothic","Meiryo",sans-serif;
  --f-num:"Barlow","Helvetica Neue",Arial,sans-serif;
  --f-stamp:"Dela Gothic One","Hiragino Kaku Gothic StdN","Yu Gothic",sans-serif;
  --line:var(--l-date);
  color-scheme:light;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#141619; --panel:#1C1F23; --sunken:#25292E; --ink:#E6E8EB; --sub:#9AA1AB;
  --rule:#2D3137; --rule-strong:#444B54;
  --primary:#86ABE0; --primary-ink:#10141A; --primary-soft:#22303F;
  --l-date:#86ABE0; --l-place:#B7A0E0; --l-pack:#E39C62; --l-pay:#72C08F;
  --ok:#72C08F; --warn:#E2B366; --bad:#EF8B80;
  --stamp:#EF8B80; --stamp-blend:normal;
  --sat:#8FB4EA; --sun:#F0938A;
  --shadow:none;
  color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#141619; --panel:#1C1F23; --sunken:#25292E; --ink:#E6E8EB; --sub:#9AA1AB;
  --rule:#2D3137; --rule-strong:#444B54;
  --primary:#86ABE0; --primary-ink:#10141A; --primary-soft:#22303F;
  --l-date:#86ABE0; --l-place:#B7A0E0; --l-pack:#E39C62; --l-pay:#72C08F;
  --ok:#72C08F; --warn:#E2B366; --bad:#EF8B80;
  --stamp:#EF8B80; --stamp-blend:normal;
  --sat:#8FB4EA; --sun:#F0938A;
  --shadow:none;
  color-scheme:dark}
[data-line="date"]{--line:var(--l-date)}
[data-line="place"]{--line:var(--l-place)}
[data-line="pack"]{--line:var(--l-pack)}
[data-line="pay"]{--line:var(--l-pay)}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{scrollbar-gutter:stable;touch-action:manipulation;-webkit-text-size-adjust:100%}
button,a,label,input,select,summary,textarea{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-jp);font-size:16px;line-height:1.75;letter-spacing:.02em;font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--bg)}
.wrap{max-width:780px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:14px 56px}
h1,h2,h3{text-wrap:balance;margin:0;line-height:1.4;font-feature-settings:"palt";letter-spacing:.04em}
p{margin:0}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--primary);outline-offset:2px;border-radius:4px}
img{max-width:100%}
[data-key]{scroll-margin-top:96px}

/* ---------- 上部 ---------- */
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:4px 16px}
.brand{display:flex;align-items:center;gap:10px;background:none;border:0;padding:0;cursor:pointer;font-weight:700;font-size:17px;letter-spacing:.08em;color:var(--ink);text-decoration:none;min-height:36px}
.brand .lines{display:flex;gap:3px}
.brand .lines i{width:5px;height:18px;border-radius:2px;background:var(--l-date)}
.brand .lines i:nth-child(2){background:var(--l-place)}
.brand .lines i:nth-child(3){background:var(--l-pack)}
.brand .lines i:nth-child(4){background:var(--l-pay)}
.theme{display:flex;background:var(--panel);border:1px solid var(--rule);border-radius:99px;padding:3px;gap:2px}
.theme button{border:0;background:none;border-radius:99px;padding:5px 11px;min-height:30px;font-size:13px;font-weight:700;color:var(--sub);cursor:pointer;display:flex;align-items:center;gap:5px;white-space:nowrap}
.theme button svg{width:14px;height:14px;flex:none}
.theme button[aria-pressed="true"]{background:var(--ink);color:var(--panel)}
@media (max-width:420px){.theme button span{display:none}.theme button{padding:6px 9px}}
.notice,.boot-error{background:var(--panel);border:1px solid var(--rule);border-left:4px solid var(--warn);border-radius:6px;padding:10px 14px;font-size:14px;margin-bottom:16px}
.boot-error{border-left-color:var(--bad)}

/* ---------- 共通部品 ---------- */
.panel{display:flex;flex-direction:column;gap:14px}
.box{background:var(--panel);border:1px solid var(--rule);border-radius:10px;padding:20px;display:flex;flex-direction:column;gap:14px;box-shadow:var(--shadow)}
.box > h2,.h2,.box-head h2,.box > summary{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:700}
.box > h2::before,.h2::before,.box-head h2::before{content:"";flex:none;width:4px;height:18px;border-radius:2px;background:var(--line)}
.box-head{display:flex;justify-content:space-between;align-items:center;gap:8px 12px;flex-wrap:wrap}
.hint{color:var(--sub);font-size:14px}
label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:700;color:var(--sub);min-width:0}
label small{font-weight:400;font-size:13px}
input:not([type=checkbox]):not([type=radio]),select,textarea{width:100%;min-height:46px;background:var(--sunken);border:1.5px solid transparent;border-radius:8px;padding:10px 12px;color:var(--ink);font-size:16px;min-width:0}
textarea{resize:vertical;line-height:1.6}
input:not([type=checkbox]):not([type=radio]):focus,select:focus,textarea:focus{border-color:var(--primary);outline:none;background:var(--panel)}
input::placeholder,textarea::placeholder{color:var(--sub);opacity:.75}
fieldset{border:0;padding:0;margin:0;min-width:0}
legend{font-size:14px;font-weight:700;color:var(--sub);margin-bottom:8px;padding:0}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.row-form{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.row-form label{flex:1 1 160px}
.form-acts{display:flex;gap:8px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--panel);color:var(--ink);border:1.5px solid var(--rule-strong);border-radius:8px;padding:9px 16px;min-height:44px;font-weight:700;font-size:15px;cursor:pointer;white-space:nowrap;text-decoration:none;letter-spacing:.03em}
.btn:hover{border-color:var(--ink)}
.btn.go{background:var(--primary);border-color:var(--primary);color:var(--primary-ink)}
.btn.go:hover{filter:brightness(1.08)}
.btn:disabled{opacity:.45;cursor:default;filter:none}
.btn.sm{min-height:36px;padding:5px 12px;font-size:14px}
.btn.armed,.icon.armed{background:var(--bad)!important;border-color:var(--bad)!important;color:#fff!important}
.btn.ghost-bad{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 45%,transparent)}
.btn.toggle[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--panel)}
.linkish{background:none;border:0;color:var(--sub);text-decoration:underline;text-underline-offset:3px;font-size:14px;cursor:pointer;padding:8px 6px;min-height:36px}
.linkish:hover{color:var(--ink)}
.icon{width:36px;min-width:36px;height:36px;padding:0;border:0;border-radius:8px;background:none;color:var(--sub);cursor:pointer;font-size:16px;display:inline-grid;place-items:center;flex:none}
.icon:hover{color:var(--bad);background:var(--sunken)}
.icon.armed{font-size:12px;font-weight:700}
@media (pointer:coarse){.icon{width:40px;min-width:40px;height:40px}}
.tag{display:inline-block;font-style:normal;font-size:12px;font-weight:700;padding:0 7px;border-radius:4px;background:var(--primary-soft);color:var(--primary);white-space:nowrap;letter-spacing:.04em;line-height:1.7}
.empty{color:var(--sub);font-size:14px;padding:16px;border:1.5px dashed var(--rule-strong);border-radius:8px;text-align:center}
input[type=checkbox]{appearance:none;-webkit-appearance:none;flex:none;width:22px;height:22px;margin:0;border:2px solid var(--rule-strong);border-radius:5px;background:var(--panel);cursor:pointer;display:inline-block;vertical-align:middle}
input[type=checkbox]:checked{background:var(--primary) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4.5 10.5l3.6 3.6 7.4-8' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat;border-color:var(--primary)}
:root[data-theme="dark"] input[type=checkbox]:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4.5 10.5l3.6 3.6 7.4-8' fill='none' stroke='%2310141A' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) input[type=checkbox]:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4.5 10.5l3.6 3.6 7.4-8' fill='none' stroke='%2310141A' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}}
.seg-radio{display:flex;flex-wrap:wrap;gap:6px}
.seg-radio label{flex-direction:row;color:var(--ink);font-weight:400}
.seg-radio input{position:absolute;opacity:0;pointer-events:none}
.seg-radio span{padding:8px 16px;border-radius:99px;cursor:pointer;font-size:15px;background:var(--sunken);border:1.5px solid transparent}
.seg-radio input:checked+span{background:var(--primary-soft);border-color:var(--primary);color:var(--primary);font-weight:700}
.seg-radio input:focus-visible+span{outline:3px solid var(--primary);outline-offset:2px}
.copy-slot:empty{display:none}
.copy-out{width:100%;min-height:120px;font:14px/1.6 var(--f-jp);background:var(--sunken);color:var(--ink);border:1.5px solid var(--primary);border-radius:8px;padding:10px 12px;resize:vertical}
.scroll-x{display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin;-webkit-overflow-scrolling:touch;padding-bottom:4px}
.scroll-x > *{flex:none}

/* ---------- 駅名標 ---------- */
.sign{position:relative;background:var(--panel);color:var(--ink);border:1px solid var(--rule);border-radius:10px;padding:18px 0 12px;overflow:hidden;box-shadow:var(--shadow)}
.sign-main{display:flex;align-items:center;justify-content:center;gap:18px;padding:0 20px;min-height:112px}
.badge{flex:none;display:grid;place-items:center;align-content:center;width:54px;height:54px;border:4px solid var(--line);border-radius:9px;line-height:1}
.badge b{font:600 13px/1 var(--f-num);letter-spacing:.06em}
.badge i{font:700 24px/1 var(--f-num);font-style:normal}
.sign-name{display:flex;flex-direction:column;align-items:center;min-width:0}
.sign-name .kana{font-size:13px;letter-spacing:.42em;padding-left:.42em;color:var(--sub)}
.sign-name strong{font-weight:900;font-size:clamp(40px,11vw,66px);line-height:1.08;letter-spacing:.14em;padding-left:.14em;white-space:nowrap}
.sign-name .roma{font:600 18px/1.2 var(--f-num);letter-spacing:.08em;color:var(--sub)}
.band{position:relative;height:14px;background:var(--line);margin:14px 0 10px}
.band::after{content:"";position:absolute;left:50%;top:50%;width:26px;height:26px;transform:translate(-50%,-50%);border-radius:50%;background:var(--panel);border:5px solid var(--line)}
.band.tri{background:linear-gradient(90deg,var(--l-date) 0 25%,var(--l-place) 25% 50%,var(--l-pack) 50% 75%,var(--l-pay) 75%)}
.band.tri::after{border-color:var(--l-pack)}
.nbs{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:0 14px}
.nb{display:flex;align-items:center;gap:8px;background:none;border:0;padding:4px 6px;min-height:44px;color:var(--ink);cursor:pointer;text-align:left;border-radius:6px;min-width:0}
.nb:hover{background:var(--sunken)}
.nb.next{flex-direction:row-reverse;text-align:right}
.nb b{white-space:nowrap}
.nb .arr{flex:none;width:0;height:0;border:9px solid transparent;border-right:12px solid var(--nb,var(--line));border-left:0}
.nb.next .arr{border-right:0;border-left:12px solid var(--nb,var(--line))}
.nb b{display:block;font-size:17px;letter-spacing:.08em}
.nb.end{cursor:default;color:var(--sub)}
.nb.end:hover{background:none}
.nb.end b{font-size:14px;letter-spacing:.2em}
.sign-caption{padding:0 20px;font-size:14px;color:var(--sub);text-align:center}
.stamp{position:absolute;top:10px;right:12px;width:92px;height:92px;border-radius:50%;color:var(--stamp);border:3px solid currentColor;box-shadow:inset 0 0 0 3px var(--panel),inset 0 0 0 5px currentColor;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(-12deg);mix-blend-mode:var(--stamp-blend);opacity:.9;line-height:1.1;pointer-events:none}
.stamp .s-top{font-size:11px;font-weight:700;letter-spacing:.2em;padding-left:.2em}
.stamp .s-mid{font-family:var(--f-stamp);font-size:21px;letter-spacing:.04em;margin:2px 0}
.stamp .s-bot{font:600 12px/1 var(--f-num);letter-spacing:.04em;border-top:1.5px solid currentColor;padding-top:3px}
.stamp.press{animation:press .5s cubic-bezier(.2,.9,.3,1.3) both}
@keyframes press{0%{opacity:0;transform:rotate(-12deg) scale(1.8)}60%{opacity:.95;transform:rotate(-12deg) scale(.94)}100%{opacity:.9;transform:rotate(-12deg) scale(1)}}

/* ---------- 路線図（ナビ） ---------- */
.strip{display:grid;grid-template-columns:repeat(var(--n,3),1fr);position:sticky;top:env(safe-area-inset-top,0px);z-index:6;background:var(--bg);margin:8px 0 14px;padding-block:10px 6px;border-bottom:1px solid transparent}
.strip.stuck{border-bottom-color:var(--rule)}
.stop{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;background:none;border:0;padding:0 4px 4px;cursor:pointer;color:var(--ink);min-width:0}
/* 隣の駅までの線（○の中心から次の○の中心まで） */
.stop:not(:last-child)::before{content:"";position:absolute;left:50%;width:100%;top:11px;height:6px;background:linear-gradient(90deg,var(--c) 50%,var(--c2,var(--c)) 50%)}
.stop .dot{position:relative;z-index:1;width:28px;height:28px;border-radius:50%;background:var(--panel);border:5px solid var(--c);display:grid;place-items:center;font-size:12px;font-weight:900;line-height:1;color:var(--c)}
.stop.on .dot{background:var(--c);color:var(--panel);box-shadow:0 0 0 3px var(--bg),0 0 0 5px var(--c)}
.stop.done .dot::after{content:"✓"}
/* 字間を後ろに足さないよう打ち消して、文字の中心を○の中心に合わせる */
.stop .lbl{font-weight:700;font-size:15px;letter-spacing:.08em;margin-right:-.08em;line-height:1.5;text-align:center;white-space:nowrap}
.stop.on .lbl{color:var(--ink)}
.stop:not(.on) .lbl{color:var(--sub)}
.feat-add-row{display:flex;gap:8px;flex-wrap:wrap;margin:-4px 0 14px}
.feat-add{border-style:dashed;color:var(--sub);background:transparent!important}
.feat-add:hover{color:var(--ink)}

/* ---------- ホーム ---------- */
#home{display:flex;flex-direction:column;gap:26px}
.lead{font-size:15px;color:var(--sub);margin-top:14px;max-width:36em}
.sec-h{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
.sec-h h2{font-size:18px;letter-spacing:.06em}
.tickets{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.tickets .empty{grid-column:1/-1}
.list-note{margin-top:10px}
.ticket-wrap{position:relative;min-width:0;display:grid}
.ticket{--notch:10px;position:relative;display:grid;grid-template-columns:1fr auto;text-align:left;border:1px solid var(--rule);padding:0;cursor:pointer;color:var(--ink);background:var(--panel);border-radius:10px;min-width:0;box-shadow:var(--shadow);
  -webkit-mask:radial-gradient(circle var(--notch) at 0 50%,#0000 97%,#000) left/51% 100% no-repeat,radial-gradient(circle var(--notch) at 100% 50%,#0000 97%,#000) right/51% 100% no-repeat;
  mask:radial-gradient(circle var(--notch) at 0 50%,#0000 97%,#000) left/51% 100% no-repeat,radial-gradient(circle var(--notch) at 100% 50%,#0000 97%,#000) right/51% 100% no-repeat}
.ticket:hover{border-color:var(--rule-strong)}
.ticket:focus-visible{outline:none;box-shadow:inset 0 0 0 3px var(--primary)}
.t-main{display:flex;flex-direction:column;gap:3px;padding:16px 14px 16px 22px;min-width:0}
.t-name{font-size:18px;font-weight:700;letter-spacing:.04em;overflow-wrap:anywhere}
.t-date{font:600 16px/1.4 var(--f-num);letter-spacing:.02em}
.t-date.none{font-family:var(--f-jp);font-size:14px;font-weight:400;color:var(--sub)}
.t-mem{font-size:13px;color:var(--sub);overflow-wrap:anywhere}
.t-stub{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:14px 22px 14px 16px;border-left:2px dashed var(--rule);min-width:84px}
.t-n{font:700 30px/1 var(--f-num)}
.t-u{font-size:12px;color:var(--sub)}
.t-ok{margin-top:6px;font-size:12px;font-weight:700;color:var(--ok)}
.t-remove{position:absolute;top:6px;right:8px;width:32px;height:32px;border:0;border-radius:50%;background:transparent;color:var(--sub);cursor:pointer;font-size:15px;display:grid;place-items:center}
.t-remove:hover,.t-remove:focus-visible{background:var(--sunken);color:var(--ink)}
.t-remove.armed{font-size:11px;font-weight:700;color:var(--bad)}
.new-form{background:var(--panel);border:1px solid var(--rule);border-radius:10px;padding:20px;display:flex;flex-direction:column;gap:14px;box-shadow:var(--shadow)}

/* ---------- 旅の見出し ---------- */
.trip-head{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.back{align-self:flex-start;background:none;border:0;color:var(--sub);font-weight:700;font-size:14px;cursor:pointer;padding:6px 0;min-height:36px;display:flex;align-items:center;gap:6px}
.back::before{content:"";width:0;height:0;border:5px solid transparent;border-right:7px solid currentColor;border-left:0}
.back:hover{color:var(--ink)}
.trip-head h1{font-size:clamp(22px,5vw,28px);overflow-wrap:anywhere}
/* メンバー名：タップで「自分」を切り替え。多い時は横にスクロール */
.chips{display:flex;gap:6px;align-items:center}
.chip{font:inherit;font-size:15px;line-height:1.4;padding:6px 14px;min-height:38px;color:var(--ink);background:var(--panel);border:1.5px solid var(--rule);border-radius:99px;cursor:pointer;white-space:nowrap}
.chip:hover{border-color:var(--rule-strong)}
.chip[aria-checked="true"]{background:var(--ink);border-color:var(--ink);color:var(--panel)}
.chips.scroll-x{mask-image:linear-gradient(to right,#000 calc(100% - 24px),transparent);-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 24px),transparent);padding-right:24px}
.share-row{display:flex;align-items:center;gap:6px 10px;flex-wrap:wrap}
.share-label{font-size:14px;font-weight:700;color:var(--sub)}
.share-acts{display:flex;gap:6px;flex-wrap:wrap}
.copy-slot{flex-basis:100%}

/* ---------- 日程 ---------- */
.state-stack{display:grid}
.state-stack > *{grid-area:1/1}
.state-stack > [aria-hidden="true"]{visibility:hidden}
.state-row{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:8px;min-height:60px;border-radius:8px;padding:10px 14px;font-size:15px;background:var(--sunken);color:var(--sub)}
.state-row.is-dec{background:var(--primary-soft);color:var(--ink)}
.state-row .sr-main{flex:1 1 220px;min-width:0}
.state-row b{font-family:var(--f-num);font-size:17px;font-weight:600}
.state-row .acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.table-scroll{overflow-x:auto;margin:0 -6px;padding:0 6px;-webkit-overflow-scrolling:touch}
.table-scroll.more{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 32px),rgba(0,0,0,.15));mask-image:linear-gradient(to right,#000 calc(100% - 32px),rgba(0,0,0,.15))}
.scroll-note{margin-top:-6px;font-size:13px}
table.tt{border-collapse:collapse;width:100%;font-size:14px}
.tt th{font-size:13px;color:var(--sub);font-weight:700;padding:6px 5px 8px;text-align:center;white-space:nowrap;border-bottom:2px solid var(--ink)}
.tt th.me{color:var(--ink);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.tt th.mem{max-width:5.2em}
.tt th.mem span{display:block;max-width:5.2em;overflow:hidden;text-overflow:ellipsis}
@media (min-width:700px){.tt th.mem,.tt th.mem span{max-width:9em}}
.tt td{padding:8px 5px;border-bottom:1px solid var(--rule);text-align:center;vertical-align:middle;background:var(--panel)}
.tt .c-date{position:sticky;left:0;z-index:2;text-align:left;white-space:nowrap;width:186px;min-width:186px;max-width:186px;background:var(--panel);box-shadow:1px 0 0 var(--rule)}

.tt tr.best td{background:color-mix(in srgb,var(--primary) 7%,var(--panel))}
.tt tr.dec td{background:color-mix(in srgb,var(--stamp) 7%,var(--panel))}
.d-main{display:flex;align-items:center;gap:6px}
.d-day{font:600 24px/1 var(--f-num);letter-spacing:.01em}
.wd{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:4px;border:1.5px solid currentColor;font-size:12px;font-weight:700}
.wd.sat{color:var(--sat)} .wd.sun{color:var(--sun)}
.d-sub{font:500 13px/1.4 var(--f-num);color:var(--sub);margin-top:3px}
.c-meta{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:6px;min-height:40px}
.c-acts{display:flex;align-items:center;gap:2px}
.c-acts .btn{width:54px;padding:0;min-height:36px}
.c-acts .mini-stamp{margin:0 7px}
.tally{white-space:nowrap;font:600 14px/1.2 var(--f-num)}
.tally .o{color:var(--ok)} .tally .d{color:var(--warn)} .tally .x{color:var(--sub)}
.mini-stamp{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;border:2px solid var(--stamp);color:var(--stamp);font-size:12px;font-weight:700;transform:rotate(-12deg);flex:none}
.vote{width:40px;height:40px;border-radius:50%;border:0;background:var(--sunken);cursor:pointer;font-size:20px;font-weight:700;line-height:1;color:var(--rule-strong)}
.vote.v-o{background:var(--panel);color:var(--ok);box-shadow:inset 0 0 0 2.5px var(--ok)}
.vote.v-d{background:var(--panel);color:var(--warn);box-shadow:inset 0 0 0 2.5px var(--warn)}
.vote.v-x{color:var(--sub);background:var(--sunken)}
/* 候補日の追加：カレンダーで複数選択 */
.picker > summary{cursor:pointer;list-style:none;min-height:28px}
.picker > summary::-webkit-details-marker{display:none}
.picker > summary::after{content:"＋";margin-left:auto;color:var(--sub);font-weight:400}
.picker[open] > summary::after{content:"－"}
.picker > summary::before{content:"";flex:none;width:4px;height:18px;border-radius:2px;background:var(--line)}
.picker-body{display:flex;flex-direction:column;gap:12px;margin-top:4px}
.cal-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.cal-head b{font:600 18px var(--f-jp);letter-spacing:.04em}
.cal-nav{width:44px;height:44px;border-radius:8px;border:1.5px solid var(--rule);background:var(--panel);cursor:pointer;font-size:20px;line-height:1;color:var(--ink)}
.cal-nav:disabled{opacity:.35;cursor:default}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal .wd-h{text-align:center;font-size:12px;font-weight:700;color:var(--sub);padding:2px 0}
.cal .wd-h.sun{color:var(--sun)} .cal .wd-h.sat{color:var(--sat)}
.day{height:44px;border:0;border-radius:8px;background:none;font:500 16px var(--f-num);color:var(--ink);cursor:pointer;position:relative}
.day.sun{color:var(--sun)} .day.sat{color:var(--sat)}
.day:hover{background:var(--sunken)}
.day.today{box-shadow:inset 0 0 0 1.5px var(--rule-strong)}
.day[aria-pressed="true"]{background:var(--primary);color:var(--primary-ink)}
.day:disabled{color:var(--rule-strong);cursor:default;background:none}
.day.has{color:var(--ink)}
.day.has::after{content:"";position:absolute;bottom:5px;left:50%;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:var(--ok)}
.cal-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--sub)}
.cal-legend i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--ok);margin-right:5px;vertical-align:middle}
.cal-foot{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.cal-foot label{flex:0 1 150px}
#addDatesBtn{min-width:12em}

/* ---------- 持ち物 ---------- */
.prog{display:grid;grid-template-columns:minmax(4.5em,auto) 1fr auto;gap:10px 14px;align-items:center;font-size:14px}
.prog-wrap{max-height:15.5rem;overflow-y:auto;padding-right:4px}
.prog .bar{height:8px;background:var(--sunken);border-radius:99px;overflow:hidden}
.prog .bar i{display:block;height:100%;background:var(--primary);border-radius:99px;transition:width .3s}
.prog .bar i.full{background:var(--ok)}
.prog .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700}
.prog .num{font:600 15px var(--f-num)}
.who-sel{flex-direction:row;align-items:center;gap:8px}
.who-sel select{width:auto;min-width:8em;max-width:12em;min-height:40px;padding:6px 10px}
.list-tools{display:flex;justify-content:flex-end}
.items{list-style:none;margin:0;padding:0}
.item{display:flex;align-items:center;gap:8px;padding:7px 0;min-height:50px;border-bottom:1px solid var(--rule)}
.item:last-child{border-bottom:0}
.item > label:first-child{flex-direction:row;align-items:center;gap:12px;flex:1;color:var(--ink);font-size:16px;font-weight:400;cursor:pointer;min-width:0}
.item .nm{overflow-wrap:anywhere}
.item.ok .nm{color:var(--sub);text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--sub) 55%,transparent)}
.item.g{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px}
.item .owner{flex-direction:row;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--sub)}
.item .owner select{width:7em;max-width:7em;min-height:38px;padding:6px 8px;font-size:15px}
@media (max-width:560px){
  .item.g{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name del" "owner del";row-gap:2px;padding-bottom:8px}
  .item.g > label:first-child{grid-area:name}
  .item.g .owner{grid-area:owner;padding-left:34px}
  .item.g .icon{grid-area:del;align-self:center}
}
.item.leaving{animation:leave .5s ease forwards;overflow:hidden}
@keyframes leave{0%{opacity:1;max-height:64px}55%{opacity:0;max-height:64px}100%{opacity:0;max-height:0;min-height:0;padding-top:0;padding-bottom:0;border-bottom-width:0}}
.all-done{display:flex;align-items:center;gap:14px;padding:14px;border-radius:8px;background:var(--sunken);font-weight:700}
.reset-row{display:flex;justify-content:center;padding-top:6px}

/* ---------- 精算 ---------- */
.total{display:flex;align-items:baseline;gap:8px 14px;flex-wrap:wrap}
.total .big{font:600 44px/1 var(--f-num);letter-spacing:.01em}
.txs{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
/* 左の丸をタップで「済」。金額は常に右端に固定して、押しても位置が変わらない */
.tx{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 14px 10px 10px;border-radius:8px;background:var(--sunken)}
.pay-toggle{width:44px;height:44px;border-radius:50%;border:2px dashed var(--rule-strong);background:var(--panel);cursor:pointer;display:grid;place-items:center;padding:0;color:var(--rule-strong);font-family:var(--f-stamp);font-size:16px}
.pay-toggle:hover{border-color:var(--sub)}
.tx.done .pay-toggle{border:2px solid var(--stamp);color:var(--stamp);background:var(--panel);transform:rotate(-12deg)}
.tx .route2{display:flex;align-items:center;gap:8px;min-width:0;font-weight:700;font-size:15px}
.tx .route2 .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;max-width:9em}
.tx .rail{flex:1 1 20px;min-width:20px;max-width:80px;height:3px;background:var(--rule-strong);border-radius:2px;position:relative}
.tx .rail::after{content:"";position:absolute;right:-2px;top:50%;transform:translateY(-50%);border:5px solid transparent;border-left:8px solid var(--rule-strong);border-right:0}
.tx .amt{font:600 22px/1 var(--f-num);text-align:right;min-width:5.2em}
.tx.done .route2,.tx.done .amt{color:var(--sub)}
.tx.done .amt{text-decoration:line-through;text-decoration-thickness:1.5px}
@media (max-width:560px){.tx .amt{font-size:19px;min-width:4.6em}.tx .route2{font-size:14px;gap:6px}}
.bal-list{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.bal-list li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;padding:10px 2px;border-bottom:1px solid var(--rule)}
.bal-list .bn{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bal-list .bd{font:600 17px/1.4 var(--f-num);text-align:right;white-space:nowrap}
.bal-list .bd small{font-family:var(--f-jp);font-size:12px;font-weight:700;margin-right:6px}
.bal-list .bs{grid-column:1/-1;font-size:13px;color:var(--sub)}
.plus{color:var(--ok)} .minus{color:var(--bad)} .zero{color:var(--sub)}
.for-row{display:flex;align-items:center;gap:8px;min-width:0}
.for-row .scroll-x{flex:1;min-width:0}
.checks{display:flex;gap:6px}
.checks label{flex-direction:row;align-items:center;gap:7px;color:var(--ink);font-size:15px;font-weight:400;padding:6px 14px 6px 8px;border-radius:99px;cursor:pointer;background:var(--sunken);white-space:nowrap}
.checks input[type=checkbox]{width:18px;height:18px;border-radius:50%;background-size:12px}
#eHint{min-height:1.7em}
.exp{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid var(--rule)}
.exp:last-child{border-bottom:0}
.exp-main{all:unset;cursor:pointer;display:flex;flex-direction:column;min-width:0;border-radius:6px;padding:2px 4px;margin:-2px -4px}
.exp-main .t{font-weight:700;overflow-wrap:anywhere}
.exp-main .s{font-size:13px;color:var(--sub);overflow-wrap:anywhere}
.exp-main:hover .t{text-decoration:underline;text-underline-offset:3px}
.exp-main:focus-visible{outline:3px solid var(--primary);outline-offset:2px}
.exp .a{font:600 19px var(--f-num)}
.exp.editing{background:var(--primary-soft);border-radius:6px;padding-left:8px;padding-right:4px}
form.editing{border-color:var(--primary);box-shadow:0 0 0 1px var(--primary)}

/* ---------- 設定 ---------- */
.settings{margin-top:22px}
.settings summary{cursor:pointer;font-weight:700;color:var(--sub);font-size:15px;padding:8px 0}
.settings .inner{background:var(--panel);border:1px solid var(--rule);border-radius:10px;padding:20px;display:flex;flex-direction:column;gap:14px;margin-top:6px}
.mem-list{display:flex;flex-direction:column;gap:8px;max-height:20rem;overflow-y:auto}
.mem-row{display:flex;gap:8px;align-items:center}
.danger{border-top:1px solid var(--rule);padding-top:14px}

.foot{margin-top:40px;text-align:center;font-size:13px}
.foot a{color:var(--sub);display:inline-block;padding:10px 4px}
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%) translateY(20px);background:var(--ink);color:var(--panel);padding:10px 18px;border-radius:8px;font-size:14px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:calc(100% - 32px);z-index:20}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

@media (max-width:560px){
  .grid2{grid-template-columns:1fr}
  .sign{padding:12px 0 6px}
  .badge{width:46px;height:46px;border-width:3px}
  .badge i{font-size:20px}
  .sign-name strong{font-size:44px}
  .sign-name .kana{font-size:12px}
  .sign-name .roma{font-size:16px}
  .band{height:12px;margin:10px 0 4px}
  .band::after{width:22px;height:22px;border-width:4px}
  .sign-caption{display:none}
  .stamp{width:70px;height:70px;top:8px;right:10px}
  .stamp .s-mid{font-size:16px}
  .stamp .s-top{font-size:9px}
  .stamp .s-bot{font-size:10px}
  .nb b{font-size:15px}
  .tickets{grid-template-columns:1fr}
  .total .big{font-size:38px}
  .box{padding:18px 16px}
}
@media (prefers-reduced-motion:reduce){.stamp.press{animation:none}.toast,.prog .bar i{transition:none}.item.leaving{animation:none;opacity:.4}}

.state-row .sr-top{display:flex;align-items:baseline;gap:4px 8px;flex-wrap:wrap;line-height:1.6}
.state-row .sr-top b{font-size:16px;white-space:nowrap}
.state-row .nights{font-size:14px;white-space:nowrap}
.state-row:not(.is-dec) .sr-top{display:block}
.state-row:not(.is-dec) b{color:var(--ink)}
/* 支払いの行：払う人の名前だけを省略し、受け取る人の名前は全部表示 */
.tx .route2 .nm:first-child{flex:0 1 auto}
.tx .route2 .nm:last-child{flex:none;max-width:6.5em}
@media (max-width:560px){.tx .rail{min-width:14px;max-width:40px}}

/* ---------- 今回の追加 ---------- */
label.inline{flex-direction:row;align-items:center;gap:8px;white-space:nowrap}
label.inline select{width:auto;min-width:7em}
.seg-check{display:flex;flex-wrap:wrap;gap:6px}
.seg-check label{flex-direction:row;font-weight:400;color:var(--ink)}
.seg-check input{position:absolute;opacity:0;pointer-events:none}
.seg-check span{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;min-height:42px;border-radius:99px;cursor:pointer;font-size:15px;background:var(--sunken);border:1.5px solid transparent}
.seg-check span::before{content:"";width:14px;height:14px;border-radius:4px;border:2px solid var(--rule-strong);background:var(--panel)}
.seg-check input:checked+span{background:var(--primary-soft);border-color:var(--primary);color:var(--primary);font-weight:700}
.seg-check input:checked+span::before{background:var(--primary);border-color:var(--primary)}
.seg-check input:focus-visible+span{outline:3px solid var(--primary);outline-offset:2px}
.add-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.add-row label.inline{flex:1 1 auto}
.add-row select{flex:1}
.add-row .btn{min-width:6em}
.count{font:600 15px var(--f-num);color:var(--sub)}
.list-tools{display:flex;justify-content:space-between;align-items:center;gap:8px}
.list-tools select{min-width:9em}
.c-acts .icon.undo{font-size:12px;font-weight:700;width:40px}
/* カレンダー：追加ボタンは常に画面下に見えるように */
.cal-foot{position:sticky;bottom:0;z-index:3;background:var(--panel);padding:10px 0 calc(6px + env(safe-area-inset-bottom,0px));margin-bottom:-6px;border-top:1px solid var(--rule);display:flex;align-items:center;gap:8px;flex-wrap:nowrap}
.cal-foot label{flex:0 0 auto}
.cal-foot select{min-width:6.5em}
.cal-foot .btn{margin-left:auto;min-width:7em}
.day{user-select:none;-webkit-user-select:none}
.cal-foot .btn{width:8.5em;min-width:8.5em}
.cal-foot .linkish{min-width:3em}

/* 駅名標：駅名だけを中央の○の真上に置く。番号札は駅名の左に外付けして、中央ぞろえに影響させない */
.sign-main{position:relative;justify-content:center;padding:0 20px}
.sign-name{position:relative}
.sign-name .badge{position:absolute;right:calc(100% + 16px);top:50%;transform:translateY(-50%)}
.sign-name strong{letter-spacing:.14em;padding-left:0;margin-right:-.14em}
.sign-name .kana{padding-left:0;margin-right:-.42em}
@media (max-width:560px){.sign-main{min-height:80px}.sign-name .badge{right:calc(100% + 10px)}}

/* 候補日のオプション（宿泊・時間） */
.cal-opts{display:flex;flex-direction:column;gap:8px}
.cal-opts .opt{display:flex;align-items:center;gap:10px;min-height:44px;flex-wrap:wrap}
.cal-opts select,.cal-opts input[type=time]{width:auto;min-width:8em;min-height:44px}
.sw{flex-direction:row;align-items:center;gap:10px;font-size:15px;font-weight:700;color:var(--ink);cursor:pointer;min-height:44px}
.cal-foot{justify-content:flex-end}
.cal-foot .linkish{margin-right:auto;min-width:0}
.cal-foot .btn{margin-left:0}
.d-sub .tm{font-weight:600;color:var(--ink)}
/* 持ち物：持つ人ボタンと、その場での変更 */
.item.p{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:4px 8px}
.item.p > label,.item.p > .nm-wrap{min-width:0;display:flex;align-items:center;gap:12px;font-size:16px;font-weight:400;color:var(--ink)}
.who-btn{background:var(--sunken);border:0;border-radius:99px;padding:4px 10px;min-height:32px;font-size:13px;color:var(--sub);cursor:pointer;max-width:9em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.who-btn:hover{color:var(--ink)}
.who-edit{grid-column:1/-1;display:flex;flex-direction:column;gap:8px;padding:6px 0 4px 34px}
/* 立て替えの記録（折りたたみ） */
.exp-box > summary{cursor:pointer;list-style:none;min-height:28px}
.exp-box > summary::-webkit-details-marker{display:none}
.exp-box > summary::before{content:"";flex:none;width:4px;height:18px;border-radius:2px;background:var(--line)}
.exp-box > summary::after{content:"＋";margin-left:auto;color:var(--sub);font-weight:400}
.exp-box[open] > summary::after{content:"－"}
.exp-box .count{font-size:15px;color:var(--sub);font-weight:500}
.feat-remove{display:flex;justify-content:center}
@media (max-width:560px){
  .tx{gap:10px;padding-right:12px}
  .tx .amt{min-width:0;font-size:18px}
  .tx .rail{flex:0 0 16px;min-width:16px}
  .tx .route2 .nm:first-child{flex:0 1 auto;max-width:none}
  .tx .route2 .nm:last-child{flex:none;max-width:5.5em}
}

/* ---------- 駅名標：番号札は駅名の幅に関係なく、いつも同じ位置 ---------- */
.sign-main > .badge.fixed{position:absolute;left:max(12px,calc(50% - 200px));top:50%;transform:translateY(-50%)}
@media (max-width:560px){.sign-main > .badge.fixed{left:max(8px,calc(50% - 138px))}}

/* ---------- 日程：表の「自分」の列 ---------- */
.tt th.me span{display:inline-block;background:var(--primary);color:var(--primary-ink);border-radius:99px;padding:1px 10px}
.tt th.me{text-decoration:none}
.tt td.me{background:color-mix(in srgb,var(--primary) 7%,var(--panel))}
.tt tr.best td.me{background:color-mix(in srgb,var(--primary) 13%,var(--panel))}
.tt tr.dec td.me{background:color-mix(in srgb,var(--primary) 7%,color-mix(in srgb,var(--stamp) 7%,var(--panel)))}
.tt td.me .vote.v-n{background:var(--panel);color:var(--primary);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--primary) 55%,transparent)}
.tt td.me .vote.v-x{background:var(--panel);box-shadow:inset 0 0 0 2px var(--rule-strong)}

/* ---------- 日程：スマホのカード ---------- */
.cands{display:flex;flex-direction:column;gap:10px}
.mv-hint{margin:-4px 0 2px}
.cand{border:1.5px solid var(--rule);border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:10px;background:var(--panel)}
.cand.best{border-color:color-mix(in srgb,var(--primary) 55%,var(--rule))}
.cand.dec{border-color:color-mix(in srgb,var(--stamp) 60%,var(--rule));background:color-mix(in srgb,var(--stamp) 5%,var(--panel))}
.cand-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.cand-when{min-width:0}
.cand .c-acts{flex:none;min-height:40px}
.my-vote{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.mv{display:flex;align-items:center;justify-content:center;gap:6px;min-height:48px;border-radius:8px;border:1.5px solid var(--rule-strong);background:var(--panel);color:var(--sub);font-weight:700;font-size:14px;cursor:pointer;padding:0 4px}
.mv b{font-size:20px;line-height:1}
.mv[aria-pressed="true"]{color:var(--panel)}
.mv-o[aria-pressed="true"]{background:var(--ok);border-color:var(--ok)}
.mv-d[aria-pressed="true"]{background:var(--warn);border-color:var(--warn)}
.mv-x[aria-pressed="true"]{background:var(--sub);border-color:var(--sub)}
.cand-foot{display:flex;flex-wrap:wrap;align-items:center;gap:6px 5px}
.cand-foot .tally{flex:none;min-width:6.4em;margin-right:4px}
.others{display:contents}
.ov{display:inline-flex;align-items:center;gap:5px;min-height:32px;padding:2px 10px 2px 11px;border-radius:99px;border:0;background:var(--sunken);color:var(--ink);font-size:13px;cursor:pointer;max-width:100%}
.ov .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:7em}
.ov b{font-size:15px;line-height:1;width:1em;text-align:center}
.ov.v-o b{color:var(--ok)} .ov.v-d b{color:var(--warn)} .ov.v-x b{color:var(--sub)} .ov.v-n b{color:var(--rule-strong)}

/* ---------- 候補日の追加：泊数・日数・時間 ---------- */
.num-pair{display:inline-flex;align-items:center;gap:6px;font-weight:700}
.num-pair input{width:3.6em!important;text-align:center;font:600 18px var(--f-num)!important;min-height:44px}
.time-pair{flex-basis:100%;display:flex;flex-wrap:wrap;gap:8px 16px;padding-left:32px}
.tf{display:flex;align-items:center;gap:6px}
.tf label{font-size:14px;width:2.4em;flex:none}
.tf input{width:8.5em!important;min-width:0!important}
.tf .icon{width:36px;min-width:36px}
@media (max-width:420px){.time-pair{padding-left:0}}

/* ---------- 場所 ---------- */
.places{list-style:none;margin:0;padding:0}
.place{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;padding:12px 10px;margin:0 -10px;border-bottom:1px solid var(--rule);border-radius:8px}
.place:last-child{border-bottom:0}
.place.go{background:color-mix(in srgb,var(--stamp) 5%,var(--panel))}
.pl-main{display:flex;flex-direction:column;min-width:0}
.pl-name{font-weight:700;font-size:17px;overflow-wrap:anywhere}
.place.top .like:not([aria-pressed="true"]) b{color:var(--l-place)}
.place.top .like:not([aria-pressed="true"]){border-color:var(--l-place)}
.pl-note{font-size:13px;color:var(--sub);overflow-wrap:anywhere}
a.pl-note{color:var(--primary)}
.pl-who{font-size:13px;line-height:1.6;color:var(--sub);min-height:1.6em}
.like{align-self:start;display:inline-flex;align-items:center;gap:8px;min-height:40px;width:7.4em;justify-content:center;border-radius:99px;border:1.5px solid var(--rule-strong);background:var(--panel);color:var(--ink);font-weight:700;font-size:14px;cursor:pointer}
.like b{font:600 17px/1 var(--f-num);min-width:1.2em;text-align:left}
.like[aria-pressed="true"]{background:var(--l-place);border-color:var(--l-place);color:var(--panel)}
.pl-acts{grid-column:1/-1;display:flex;align-items:center;gap:6px;justify-content:flex-end;min-height:40px}
.pl-acts .btn{width:54px;padding:0}
.pl-acts .mini-stamp{margin:0 7px}
.pl-acts .icon.undo{font-size:12px;font-weight:700}
/* 未回答の丸：色つきの行でも見えるよう、地の色で抜いて細い線で囲む */
.vote.v-n{background:var(--panel);box-shadow:inset 0 0 0 1.5px var(--rule-strong)}
/* トップの駅名標：幅の狭い画面では番号札を出さない（「たびまとめ」が長く、はみ出すため） */
@media (max-width:440px){#home .sign-name .badge{display:none}}

/* ---------- トップの駅名標：4つの駅を1本の路線で ---------- */
.home-sign{padding-bottom:14px}
.home-sign .sign-main{min-height:96px}
.route{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);position:relative}
.route::before{content:"";position:absolute;left:0;right:0;top:10px;height:8px;background:linear-gradient(90deg,var(--l-date) 0 25%,var(--l-place) 25% 50%,var(--l-pack) 50% 75%,var(--l-pay) 75%)}
.route li{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0}
.route .dot{position:relative;z-index:1;width:28px;height:28px;border-radius:50%;background:var(--panel);border:5px solid var(--c)}
.route b{font-size:15px;font-weight:700;letter-spacing:.08em;margin-right:-.08em;white-space:nowrap}

/* 使う機能：2列そろえ。チェックの色は各路線の色 */
.feat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.feat-grid label{min-width:0}
.feat-grid span{width:100%;justify-content:flex-start;border-radius:8px;padding:8px 12px;border-left:5px solid var(--c)!important}
.feat-grid input:checked+span{background:color-mix(in srgb,var(--c) 10%,var(--panel));border-color:color-mix(in srgb,var(--c) 70%,transparent);color:var(--ink)}
.feat-grid input:checked+span::before{background:var(--c);border-color:var(--c)}
.feat-grid input:not(:checked)+span{color:var(--sub);border-left-color:var(--rule-strong)!important}

/* ---------- 「決める」ボタン：○△×とは別の場所・別の色 ---------- */
.decide-btn{color:var(--stamp);border-color:color-mix(in srgb,var(--stamp) 50%,var(--rule));gap:6px}
.decide-btn:hover{border-color:var(--stamp)}
.undo-link{font-size:13px;padding:6px 4px;min-height:36px}
.cand-decide{display:flex;align-items:center;justify-content:flex-end;gap:8px;border-top:1px dashed var(--rule-strong);padding-top:10px;min-height:51px}
.cand-decide .mini-stamp{margin-right:2px}
.dec-slot{display:flex;align-items:center;justify-content:flex-end;gap:6px}
.tt th.c-dec,.tt td.c-dec{width:10em;min-width:10em;border-left:1px dashed var(--rule-strong)}
.tt td.c-dec .dec-slot{justify-content:center;min-height:40px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pl-acts .dec-slot{width:9.6em}
.pl-acts .decide-btn{width:auto;padding:5px 10px}
.feat-grid span{white-space:nowrap;gap:8px}
@media (max-width:420px){.feat-grid span{font-size:14px;padding:8px 8px 8px 10px;letter-spacing:0}}

/* ---------- 場所：ページの画像 ---------- */
/* スマホ：画像を上に横長で。PC：左に小さく。枠の大きさは先に決めておき、読み込んでも表示がずれない */
.place.has-img{grid-template-areas:"img img" "main like" "acts acts"}
.place.has-img > .pl-img{grid-area:img}
.place.has-img > .pl-main{grid-area:main}
.place.has-img > .like{grid-area:like}
.place.has-img > .pl-acts{grid-area:acts}
.pl-img{display:block;aspect-ratio:2/1;border-radius:8px;overflow:hidden;background:var(--sunken)}
.pl-img img{display:block;width:100%;height:100%;object-fit:cover}
.pl-wait{background:linear-gradient(100deg,var(--sunken) 30%,color-mix(in srgb,var(--rule) 70%,var(--sunken)) 50%,var(--sunken) 70%) 0 0/300% 100%;animation:shimmer 1.2s linear infinite}
@keyframes shimmer{to{background-position:-150% 0}}
@media (prefers-reduced-motion:reduce){.pl-wait{animation:none}}
@media (min-width:601px){
  .place.has-img{grid-template-columns:152px minmax(0,1fr) auto;grid-template-areas:"img main like" "img acts acts"}
  .place.has-img > .pl-img{align-self:start;aspect-ratio:3/2}
}
.pl-link{font-size:13px;color:var(--primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;align-self:flex-start}
.pl-link::after{content:" ↗"}
#plSubmit{width:8em}

/* ---------- 日程：日帰りは何も書かない ---------- */
.d-sub:empty{display:none}

/* ---------- 場所の編集 ---------- */
.pl-edit{grid-column:1/-1;display:flex;flex-direction:column;gap:10px;padding:12px;border-radius:8px;background:var(--sunken)}
.pl-edit input:not([type=checkbox]){background:var(--panel)}
.place.editing{background:color-mix(in srgb,var(--primary) 5%,var(--panel))}
.pl-acts .btn[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--panel)}

/* ---------- 切符：段取りがすべて終わった旅には、改札の鋏の穴と「完了」の印 ---------- */
.ticket.used .t-stub{position:relative}
.ticket.used .t-stub::before{content:"";position:absolute;bottom:10px;left:50%;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:var(--bg);box-shadow:inset 0 1px 2px rgba(0,0,0,.18)}
.t-stub{width:96px;min-width:96px;padding-left:12px;padding-right:12px}
.ticket.used .t-main{padding-right:64px}
/* 印は切り取り線をまたいで押す */
.t-stamp{position:absolute;right:70px;top:50%;width:78px;height:78px;margin-top:-39px;border-radius:50%;color:var(--stamp);border:2.5px solid currentColor;box-shadow:inset 0 0 0 2px var(--panel),inset 0 0 0 4px currentColor;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(-14deg);mix-blend-mode:var(--stamp-blend);opacity:.85;line-height:1.1;pointer-events:none}
.t-stamp .s-top{font-size:8px;font-weight:700;letter-spacing:.08em}
.t-stamp .s-mid{font-family:var(--f-stamp);font-size:19px;margin:1px 0}
.t-stamp .s-bot{font:600 9px/1 var(--f-num);border-top:1.5px solid currentColor;padding-top:2px}
.ticket-wrap{position:relative}

/* ---------- 日程（E案）：あなたの回答 ---------- */
.h-sub{font-size:13px;font-weight:500;color:var(--sub);margin-left:2px}
.my-list{display:flex;flex-direction:column}
.my-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px;padding:8px 0;border-bottom:1px solid var(--rule)}
.my-row:last-child{border-bottom:0}
.my-when{min-width:0}
.my-when .d-day{font-size:21px}
.tag.todo{background:color-mix(in srgb,var(--warn) 14%,var(--panel));color:var(--warn)}
.tag.dec{background:color-mix(in srgb,var(--stamp) 12%,var(--panel));color:var(--stamp)}
.seg3{flex:none;display:grid;grid-template-columns:repeat(3,48px);border:1.5px solid var(--rule-strong);border-radius:10px;overflow:hidden}
.sg{height:44px;border:0;border-left:1.5px solid var(--rule-strong);background:var(--panel);color:var(--sub);font-size:21px;font-weight:700;line-height:1;cursor:pointer;padding:0}
.sg:first-child{border-left:0}
.sg[aria-pressed="true"]{color:var(--panel)}
.sg-o[aria-pressed="true"]{background:var(--ok)}
.sg-d[aria-pressed="true"]{background:var(--warn)}
.sg-x[aria-pressed="true"]{background:var(--sub)}

/* ---------- 日程（E案）：みんなの結果 ---------- */
.rbar{display:flex;height:8px;border-radius:99px;overflow:hidden;background:var(--sunken)}
.rbar i{display:block;height:100%}
.rbar i.o{background:var(--ok)}
.rbar i.d{background:color-mix(in srgb,var(--warn) 65%,var(--panel))}
.rbar i.x{background:color-mix(in srgb,var(--sub) 55%,var(--panel))}
.rk-list{display:flex;flex-direction:column}
.rk{border-bottom:1px solid var(--rule);margin:0 -8px;padding:0 8px;border-radius:8px}
.rk:last-child{border-bottom:0}
.rk.open{background:color-mix(in srgb,var(--primary) 5%,var(--panel))}
.rk.dec{background:color-mix(in srgb,var(--stamp) 6%,var(--panel))}
.rk-main{all:unset;box-sizing:border-box;width:100%;display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:center;min-height:60px;padding:10px 0;cursor:pointer}
.rk-main:focus-visible{outline:3px solid var(--primary);outline-offset:2px;border-radius:6px}
.rk-no{font:700 20px/1 var(--f-num);color:var(--rule-strong);text-align:center}
.rk-no.top{color:var(--primary)}
.rk-stamp{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;border:2px solid var(--stamp);color:var(--stamp);font:400 13px/1 var(--f-stamp);transform:rotate(-12deg)}
.rk-body{display:flex;flex-direction:column;gap:6px;min-width:0}
.rk-when{font:600 15px/1.3 var(--f-num),var(--f-jp);overflow-wrap:anywhere}
.rk-detail{display:flex;flex-direction:column;gap:10px;padding:0 0 12px 38px}
.who-marks{display:flex;flex-wrap:wrap;gap:5px}
.wm{display:inline-flex;align-items:center;gap:5px;min-height:30px;padding:2px 10px 2px 11px;border-radius:99px;background:var(--panel);border:1px solid var(--rule);font-size:13px}
.wm b{font-size:15px;width:1em;text-align:center}
.wm.v-o b{color:var(--ok)} .wm.v-d b{color:var(--warn)} .wm.v-x b{color:var(--sub)} .wm.v-n b{color:var(--rule-strong)}
.rk-acts{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:44px}
.rk-acts .linkish{padding-left:0}
/* PC の表：結果の列 */
.tt th.c-res,.tt td.c-res{width:132px;min-width:132px;text-align:left}
.tt td.c-res .tally{display:block;margin-bottom:6px}
.tt td.c-dec .dec-slot{justify-content:flex-end;gap:2px}
.tt th.c-dec,.tt td.c-dec{width:11.5em;min-width:11.5em}
.tt .c-date{width:168px;min-width:168px;max-width:168px}
.c-del{margin-left:auto}
.c-del .icon{width:32px;min-width:32px;height:32px;font-size:14px}
.tt th.c-res,.tt td.c-res{width:112px;min-width:112px}
.tt th.c-dec,.tt td.c-dec{width:auto;min-width:0;white-space:nowrap;padding-left:10px}
.tt td.c-dec .decide-btn{padding:5px 10px}
.tt .c-date{width:156px;min-width:156px;max-width:156px}
.tt th.c-res,.tt td.c-res{width:104px;min-width:104px}

/* ---------- 場所（C案）：何日目に行くか ---------- */
.go-days{display:flex;flex-direction:column;gap:10px}
.go-day{display:grid;grid-template-columns:76px minmax(0,1fr);gap:10px}
.go-day.nodate{grid-template-columns:minmax(0,1fr)}
.go-lbl{display:flex;flex-direction:column;padding-top:4px}
.go-lbl b{font-size:13px;color:var(--l-place)}
.go-lbl span{font:600 15px/1.3 var(--f-num),var(--f-jp)}
.go-items{display:flex;flex-direction:column;gap:6px;border-left:3px solid color-mix(in srgb,var(--l-place) 30%,var(--panel));padding-left:10px;min-height:40px;justify-content:center}
.go-day.nodate .go-items{border-left:0;padding-left:0}
.go-item{display:flex;align-items:center;gap:10px;padding:6px 10px;border-radius:8px;background:color-mix(in srgb,var(--l-place) 8%,var(--panel));min-height:40px}
.go-item img{width:32px;height:32px;border-radius:6px;object-fit:cover;flex:none}
.go-dot{width:10px;height:10px;border-radius:50%;background:var(--l-place);flex:none;margin:0 4px}
.go-item b{font-weight:700;font-size:15px;min-width:0;overflow-wrap:anywhere}
.go-like{margin-left:auto;font-size:12px;color:var(--sub);white-space:nowrap}
.go-empty{font-size:13px;color:var(--sub)}
.pl-days{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px}
.place.has-img > .pl-days{grid-column:1/-1}
.day-chip{min-height:34px;padding:0 12px;border-radius:8px;border:1.5px solid var(--rule-strong);background:var(--panel);color:var(--sub);font-size:13px;font-weight:700;cursor:pointer}
.day-chip[aria-pressed="true"]{background:var(--ok);border-color:var(--ok);color:var(--panel)}

/* ---------- 持ち物（A案） ---------- */
.pack-side{display:flex;flex-direction:column;gap:14px}
.kind-chips{display:flex;gap:6px}
.kind-chips button{flex:none;min-height:36px;padding:0 13px;border-radius:99px;border:1.5px solid var(--rule-strong);background:var(--panel);color:var(--sub);font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap}
.kind-chips button[aria-checked="true"]{border-color:var(--primary);background:var(--primary-soft);color:var(--primary)}
.add-line{display:flex;gap:8px}
.add-line input{flex:1;min-width:0}
.add-line .btn{flex:none;min-width:72px}
.item.p{grid-template-columns:minmax(0,1fr) auto auto}
.one-tag{font-size:11px;font-weight:700;padding:1px 8px;border-radius:99px;background:color-mix(in srgb,var(--l-pack) 14%,var(--panel));color:color-mix(in srgb,var(--l-pack) 75%,var(--ink));white-space:nowrap}
.who-mini{font-size:12px;color:var(--sub);max-width:8em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.edit-btn{color:var(--sub)}
.edit-btn[aria-expanded="true"]{background:var(--sunken);color:var(--ink)}
.item.editing{background:color-mix(in srgb,var(--primary) 5%,var(--panel));border-radius:8px}
.who-edit{grid-column:1/-1;display:flex;flex-direction:column;gap:8px;padding:4px 0 6px 34px}
.who-legend{font-size:12px;font-weight:700;color:var(--sub)}
.who-edit .form-acts{align-items:center}
.linkish.bad{color:var(--bad);margin-left:auto}
.one-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px}
.one-row .nm{font-size:16px}
.owner{display:inline-flex;align-items:center;gap:6px;font-size:13px}
.ini{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--sunken);font-size:11px;font-weight:700}
.take-btn{border-style:dashed;border-color:color-mix(in srgb,var(--l-pack) 70%,var(--rule));color:color-mix(in srgb,var(--l-pack) 80%,var(--ink))}
/* ほかの人の持ち物（人ごとに折りたたみ） */
.one-sw{font-size:14px;font-weight:500;color:var(--ink);min-height:40px}
.others-list{display:flex;flex-direction:column}
.oth{border-bottom:1px solid var(--rule)}
.oth:last-child{border-bottom:0}
.oth > summary{display:flex;align-items:center;gap:10px;min-height:50px;cursor:pointer;list-style:none;font-weight:700}
.oth > summary::-webkit-details-marker{display:none}
.oth > summary::before{content:"";width:0;height:0;border:5px solid transparent;border-left:7px solid var(--sub);border-right:0;transition:transform .15s}
.oth[open] > summary::before{transform:rotate(90deg)}
.oth > summary .count{margin-left:auto}
.oth-items{list-style:none;margin:0 0 10px;padding:0 0 0 17px;display:flex;flex-direction:column;gap:4px}
.oth-items li{display:flex;align-items:center;gap:10px;min-height:32px;font-size:15px}
.oth-items li.ok{color:var(--sub)}
.oth-items .mk{flex:none;display:inline-grid;place-items:center;width:20px;height:20px;border-radius:5px;border:2px solid var(--rule-strong);font-size:12px;font-weight:700;color:var(--panel)}
.oth-items li.ok .mk{background:var(--ok);border-color:var(--ok)}

/* ---------- 精算（B案） ---------- */
.pay-tabs{display:grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:10px;background:color-mix(in srgb,var(--sub) 14%,var(--bg))}
.pay-tabs button{min-height:42px;border:0;border-radius:8px;background:transparent;color:var(--sub);font-weight:700;font-size:15px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.pay-tabs button[aria-selected="true"]{background:var(--panel);color:var(--ink);box-shadow:0 1px 2px rgba(16,24,40,.1)}
.tab-n{font:600 14px var(--f-num);color:var(--sub)}
.tab-badge{font:600 12px var(--f-num),var(--f-jp);padding:0 7px;border-radius:99px;background:color-mix(in srgb,var(--bad) 14%,var(--panel));color:var(--bad)}
.tab-badge:empty{display:none}
.tab-badge.done{background:color-mix(in srgb,var(--ok) 14%,var(--panel));color:var(--ok)}
.grid2.keep{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
.payer-row select{flex:1;max-width:14em}
.form-close{margin-left:auto}
.rec-list{display:flex;flex-direction:column;gap:8px}
.rec-sum{display:flex;align-items:baseline;gap:10px;padding:0 2px}
.rec-sum span{font-size:13px;color:var(--sub)}
.rec-sum b{font:600 24px var(--f-num)}
.rec-sum small{font-size:12px;color:var(--sub)}
.rec{all:unset;box-sizing:border-box;display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center;background:var(--panel);border:1px solid var(--rule);border-radius:10px;padding:12px;cursor:pointer;width:100%}
.rec:focus-visible{outline:3px solid var(--primary);outline-offset:2px}
.rec.editing{border-color:var(--primary);box-shadow:0 0 0 1px var(--primary)}
.rec .ini{width:40px;height:40px;font-size:15px}
.rec.mine .ini{background:var(--primary);color:var(--primary-ink)}
.rec-body{display:flex;flex-direction:column;min-width:0}
.rec-body .t{font-weight:700;overflow-wrap:anywhere}
.rec-body .s{font-size:12px;color:var(--sub);overflow-wrap:anywhere}
.rec .a{font:600 18px var(--f-num)}
.tx.mine{outline:2px solid color-mix(in srgb,var(--ok) 50%,transparent);outline-offset:-2px}
/* PC：一覧表 */
table.ledger{border-collapse:collapse;width:100%;font-size:14px}
.ledger th,.ledger td{padding:9px 6px;border-bottom:1px solid var(--rule);white-space:nowrap}
.ledger thead th{font-size:13px;color:var(--sub);font-weight:700;border-bottom:2px solid var(--ink);text-align:right}
.ledger .l-title{text-align:left;white-space:normal;min-width:9em}
.ledger .l-amt{text-align:right;font:600 15px var(--f-num)}
.ledger .l-mem{text-align:right;font:500 14px var(--f-num);color:var(--sub);width:84px}
.ledger th.l-mem span{display:inline-block;max-width:6em;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom}
.ledger th.l-mem.me span{background:var(--primary);color:var(--primary-ink);border-radius:99px;padding:0 9px}
.ledger td.me{background:color-mix(in srgb,var(--primary) 7%,var(--panel))}
.ledger .l-del{width:40px;text-align:center;padding:0}
.ledger .l-del .icon{width:32px;min-width:32px;height:32px;font-size:14px}
.l-edit{all:unset;cursor:pointer;font-weight:700;font-family:var(--f-jp)}
.l-edit:hover{text-decoration:underline;text-underline-offset:3px}
.l-edit:focus-visible{outline:3px solid var(--primary);outline-offset:2px;border-radius:4px}
.ledger tr.editing td{background:var(--primary-soft)}
.pay-tag{font:700 10px var(--f-jp);padding:0 5px;border-radius:4px;background:color-mix(in srgb,var(--ok) 14%,var(--panel));color:var(--ok);margin-right:5px;vertical-align:1px}
.nil{color:var(--rule-strong)}
.ledger tfoot th{font-size:13px;color:var(--sub);font-weight:700}
.ledger tfoot td{font:600 15px var(--f-num);color:var(--ink)}
.ledger tr.line td,.ledger tr.line th{border-bottom:2px solid var(--ink)}
.ledger tr.net td{font-weight:700;border-bottom:0}
.ledger tr.net th{border-bottom:0}
.ledger td.plus{color:var(--ok)} .ledger td.minus{color:var(--bad)}
.tx-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.txc{display:flex;flex-direction:column;gap:4px;border:1.5px solid var(--rule);border-radius:10px;padding:12px;background:var(--panel)}
.txc.mine{border-color:var(--ok)}
.txc-who{font-size:13px;font-weight:700}
.txc-amt{font:600 22px/1.1 var(--f-num)}
.txc.done{background:var(--sunken)}
.txc.done .txc-who,.txc.done .txc-amt{color:var(--sub)}
.txc.done .txc-amt{text-decoration:line-through}
.txc-btn{align-self:flex-start;margin-top:4px;color:var(--ok);border-color:var(--ok);min-width:8.5em}
.txc.done .txc-btn{color:var(--sub);border-color:var(--rule-strong)}
.place.has-img{grid-template-areas:"img img" "main like" "days days" "acts acts"}
.place.has-img > .pl-days{grid-area:days}
@media (min-width:601px){.place.has-img{grid-template-areas:"img main like" "img days days" "img acts acts"}}
.go-item b{flex:1}
@media (max-width:420px){.go-day{grid-template-columns:62px minmax(0,1fr)}.go-like{display:none}.go-lbl span{font-size:14px}}

/* ---------- PC：画面を広く使う ---------- */
@media (min-width:900px){.wrap{max-width:1120px}}
/* 日程の表：列幅を固定して、人数が増えても崩れないように */
.tt{table-layout:auto}
.tt th.mem,.tt td.me,.tt td:not(.c-date):not(.c-res):not(.c-dec){width:64px;min-width:64px}
.tt th.mem span{max-width:5em;margin:0 auto}
.tt th.c-res,.tt td.c-res{width:124px;min-width:124px;padding-left:12px}
.tt th.c-dec,.tt td.c-dec{width:180px;min-width:180px;padding-left:12px}
.tt td.c-dec .dec-slot{justify-content:flex-start}
.tt .c-date{width:170px;min-width:170px;max-width:170px}
@media (min-width:900px){.my-list{max-width:640px}}

/* ---------- 場所：行の形をそろえる（画像の有無にかかわらず同じ枠） ---------- */
.places .place{display:grid;grid-template-columns:64px minmax(0,1fr) auto;grid-template-areas:"thumb main like" "days days days" "acts acts acts";gap:8px 12px;align-items:start}
.places .place > .pl-thumb{grid-area:thumb}
.places .place > .pl-main{grid-area:main}
.places .place > .like{grid-area:like}
.places .place > .pl-days{grid-area:days}
.places .place > .pl-acts{grid-area:acts}
.places .place > .pl-edit{grid-column:1/-1}
.pl-thumb{display:block;width:64px;height:64px;border-radius:8px;overflow:hidden;background:color-mix(in srgb,var(--l-place) 10%,var(--panel))}
.pl-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.pl-ph{display:grid;place-items:center;width:100%;height:100%;color:color-mix(in srgb,var(--l-place) 60%,var(--panel))}
.pl-thumb .pl-wait{display:block;width:100%;height:100%}
@media (min-width:601px){
  .places .place{grid-template-columns:112px minmax(0,1fr) auto;grid-template-areas:"thumb main like" "thumb days acts";align-items:center}
  .places .place > .pl-thumb{width:112px;height:84px;align-self:start}
  .places .place > .pl-main{align-self:start}
  .places .place > .pl-acts{justify-content:flex-end}
}
/* 行く場所：番号と上下の移動 */
.go-item{gap:8px}
.go-no{flex:none;display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--l-place);color:var(--panel);font:600 12px var(--f-num)}
.go-move{margin-left:auto;display:flex;gap:2px;flex:none}
.go-move .icon{width:34px;min-width:34px;height:34px;font-size:12px;color:var(--sub)}
.go-move .icon:disabled{visibility:hidden}
.go-like{display:none}
/* 並び順・追加のしかた */
.seg-sm{display:flex;padding:3px;border-radius:8px;background:var(--sunken)}
.seg-sm button{min-height:32px;padding:0 10px;border:0;border-radius:6px;background:transparent;color:var(--sub);font-size:13px;font-weight:700;cursor:pointer}
.seg-sm button[aria-pressed="true"]{background:var(--panel);color:var(--ink);box-shadow:0 1px 2px rgba(16,24,40,.1)}
.mode-tabs{display:grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:10px;background:var(--sunken)}
.mode-tabs button{min-height:40px;border:0;border-radius:8px;background:transparent;color:var(--sub);font-weight:700;font-size:14px;cursor:pointer}
.mode-tabs button[aria-selected="true"]{background:var(--panel);color:var(--ink);box-shadow:0 1px 2px rgba(16,24,40,.1)}
.req,.opt{display:inline-block;margin-left:8px;padding:0 6px;border-radius:4px;font-size:11px;font-weight:700;line-height:1.6;vertical-align:1px}
.req{background:color-mix(in srgb,var(--bad) 12%,var(--panel));color:var(--bad)}
.opt{background:var(--sunken);color:var(--sub)}

/* ---------- 精算：小切手風 ---------- */
:root{--paper:#FBFAF6;--paper-line:#D9D3C4;--paper-ink:#2B2A26;--guilloche:rgba(31,78,140,.045)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--paper:#22262B;--paper-line:#3B4048;--paper-ink:#E6E8EB;--guilloche:rgba(134,171,224,.05)}}
:root[data-theme="dark"]{--paper:#22262B;--paper-line:#3B4048;--paper-ink:#E6E8EB;--guilloche:rgba(134,171,224,.05)}
.cq-sec{display:flex;flex-direction:column;gap:10px;padding-top:4px}
.cq-sec-h{margin:0;font-size:16px;font-weight:700;display:flex;align-items:baseline;gap:6px}
.cq-sec.mine{padding:14px;border-radius:12px;background:color-mix(in srgb,var(--ok) 6%,var(--panel));border:1px solid color-mix(in srgb,var(--ok) 25%,var(--rule))}
.cq-group{display:flex;flex-direction:column;gap:8px}
.cq-h{margin:0;font-size:13px;font-weight:700;color:var(--sub)}
.cheques{display:grid;grid-template-columns:1fr;gap:10px}
@media (min-width:900px){.cheques{grid-template-columns:repeat(2,minmax(0,1fr))}}
.cheque{display:grid;grid-template-columns:minmax(0,1fr) 84px;border:1px solid var(--paper-line);border-radius:6px;background:var(--paper);background-image:repeating-linear-gradient(135deg,var(--guilloche) 0 1px,transparent 1px 7px),repeating-linear-gradient(45deg,var(--guilloche) 0 1px,transparent 1px 7px);color:var(--paper-ink);overflow:hidden;box-shadow:0 1px 2px rgba(16,24,40,.05)}
.cq-main{display:flex;flex-direction:column;gap:6px;padding:12px 14px;min-width:0}
.cq-top{display:flex;justify-content:space-between;align-items:baseline;gap:8px;border-bottom:1px solid var(--paper-line);padding-bottom:5px}
.cq-bank{font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--sub)}
.cq-no{font:600 11px var(--f-num);letter-spacing:.08em;color:var(--sub)}
.cq-lbl{font-size:11px;font-weight:700;color:var(--sub);margin-right:8px;letter-spacing:.06em}
.cq-to{display:flex;align-items:baseline;min-width:0}
.cq-to b{font-size:17px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cq-sama{font-size:13px;margin-left:4px}
.cq-amt{display:flex;align-items:baseline;gap:10px;padding:2px 0 3px;border-bottom:3px double var(--paper-line)}
.cq-kin{font-size:11px;font-weight:700;color:var(--sub);letter-spacing:.06em}
.cq-yen{font:600 26px/1.15 var(--f-num);letter-spacing:.02em}
.cq-star{font-size:14px;margin-left:2px;color:var(--sub)}
.cq-foot{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:14px}
.cq-date{font:500 12px var(--f-num);color:var(--sub)}
.cq-stub{display:grid;place-items:center;border-left:2px dashed var(--paper-line);position:relative}
.cq-stub::before,.cq-stub::after{content:"";position:absolute;left:-7px;width:12px;height:12px;border-radius:50%;background:var(--panel);border:1px solid var(--paper-line)}
.cq-stub::before{top:-7px}.cq-stub::after{bottom:-7px}
.cq-stamp{width:62px;height:62px;border-radius:50%;border:2px dashed var(--rule-strong);background:transparent;color:var(--sub);cursor:pointer;padding:0;display:grid;place-items:center}
.cq-todo{font-size:11px;font-weight:700;line-height:1.3}
.cq-stamp[aria-pressed="true"]{border:2.5px solid var(--stamp);color:var(--stamp);transform:rotate(-14deg);box-shadow:inset 0 0 0 2px var(--paper),inset 0 0 0 3.5px var(--stamp)}
.cq-done{font:400 24px/1 var(--f-stamp)}
.cheque.paid .cq-main{opacity:.55}
.cheque.paid .cq-yen{text-decoration:line-through;text-decoration-thickness:2px}
.cq-bank,.cq-no,.cq-date{white-space:nowrap}
.cq-bank{overflow:hidden;text-overflow:ellipsis;min-width:0}
.cq-foot > span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:600px){
  .cheque{grid-template-columns:minmax(0,1fr) 68px}
  .cq-main{padding:10px 12px;gap:5px}
  .cq-bank{letter-spacing:.06em}
  .cq-yen{font-size:23px}
  .cq-stamp{width:54px;height:54px}
  .cq-sec.mine{padding:12px 10px}
}
@media (max-width:600px){
  .go-item img{display:none}
  .go-item{padding:4px 4px 4px 8px}
  .go-move .icon{width:30px;min-width:30px;height:32px}
  .like{width:auto;padding:0 12px;gap:6px}
}