:root {
    color-scheme: light;
    --bg: #eeeeec; --surface: #fff; --surface-2: #f7f7f5; --hover: #eceff3;
    --text: #202124; --muted: #6b7078; --line: #cfd2d6; --accent: #2868a9;
    --accent-strong: #174f88; --accent-soft: #e5eff8; --name: #197044; --danger: #b3261e;
    --topbar-height: 48px;
    font-family: "BIZ UDPGothic", "Yu Gothic UI", Meiryo, system-ui, sans-serif;
}
:root[data-theme="dark"] { color-scheme: dark; --bg:#17191c; --surface:#222529; --surface-2:#1c1f22; --hover:#30343a; --text:#e7e8ea; --muted:#adb2b9; --line:#454a51; --accent-soft:#273b50; --name:#70c994; }
:root[data-palette="gray"] { --accent:#555b63; --accent-strong:#34383d; --accent-soft:#e6e8ea; }
:root[data-palette="blue"] { --accent:#2868a9; --accent-strong:#174f88; --accent-soft:#e5eff8; }
:root[data-palette="green"] { --accent:#237a4b; --accent-strong:#155d37; --accent-soft:#e4f2e9; }
:root[data-palette="amber"] { --accent:#9a6500; --accent-strong:#774d00; --accent-soft:#f8eed6; }
:root[data-palette="rose"] { --accent:#a63d5d; --accent-strong:#7d2943; --accent-soft:#f7e5eb; }
:root[data-palette="violet"] { --accent:#6550a4; --accent-strong:#4b3981; --accent-soft:#ede8f8; }
:root[data-theme="dark"] { --accent-soft:color-mix(in srgb,var(--accent) 25%,#222529); }

* { box-sizing:border-box; }
html,body,#app { width:100%; height:100%; margin:0; }
body { overflow:hidden; background:var(--bg); color:var(--text); }
button,input,select,textarea { font:inherit; color:inherit; }
button { border:0; }
a { color:var(--accent); overflow-wrap:anywhere; }
[v-cloak] { display:none; }
:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.sr-only { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0); }

.app-shell { width:100%;height:100%;height:100dvh;min-height:0;display:grid;grid-template-columns:320px minmax(0,1fr);grid-template-rows:var(--topbar-height) minmax(0,1fr);grid-template-areas:"top top" "side main"; }
.topbar { grid-area:top;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 10px;border-bottom:1px solid var(--line);background:var(--surface); }
.brand { min-width:0;display:flex;align-items:center;gap:8px;padding:0;background:none;cursor:pointer; }
.brand-mark { width:28px;height:28px;display:grid;place-items:center;background:var(--accent);color:#fff;font-weight:800;font-family:Arial,sans-serif; }
.brand-text { max-width:min(50vw,540px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.92rem;font-weight:700; }
.topbar-actions { display:flex;align-items:center;gap:2px;position:relative; }
.icon-button,.back-button,.favorite-button,.sheet-header>button { width:34px;height:34px;display:grid;place-items:center;background:transparent;color:var(--muted);cursor:pointer;font-size:1.08rem; }
.icon-button:hover,.back-button:hover,.favorite-button:hover,.sheet-header>button:hover { background:var(--hover);color:var(--text); }
.new-thread-top { height:30px;margin-left:5px;padding:0 11px;border:1px solid var(--accent);background:var(--accent);color:#fff;cursor:pointer;font-size:.76rem;font-weight:700; }
.viewer-count { min-width:27px;margin-right:3px;display:inline-flex;align-items:center;justify-content:center;gap:3px;white-space:nowrap;color:var(--muted);font-size:.7rem;font-variant-numeric:tabular-nums; }.viewer-count span{color:#2b9a5a;font-size:.55rem;}
.emoji-control,.radio-control{position:relative}.icon-button.radio-live{color:#c92626;animation:radio-pulse 1.4s ease-in-out infinite}.icon-button.radio-available{color:var(--accent);font-weight:800}.icon-button.radio-available::after{content:"";position:absolute;top:4px;right:4px;width:6px;height:6px;border-radius:50%;background:#d42b2b}.radio-button{position:relative}.emoji-panel,.radio-popover{position:absolute;z-index:45;right:0;top:39px;width:320px;max-height:calc(100dvh - 58px);padding:9px;border:1px solid var(--line);background:var(--surface);box-shadow:0 7px 18px rgb(0 0 0 / 18%);overflow:auto}.emoji-panel>header,.radio-popover>header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.emoji-panel>header strong,.radio-popover>header strong{font-size:.76rem}.emoji-panel>header button,.radio-popover>header button{width:28px;height:28px;background:transparent;cursor:pointer;font-size:1.05rem}.emoji-panel button,.radio-popover button{background:transparent;cursor:pointer}.emoji-panel button:hover,.radio-popover button:hover{background:var(--hover)}.emoji-panel button:disabled,.radio-popover button:disabled{opacity:.35;cursor:not-allowed}.reaction-grid{display:grid;grid-template-columns:repeat(8,1fr)}.reaction-grid button{height:38px;font-size:1.35rem}.reaction-size{display:flex;align-items:center;gap:3px;margin:5px 0}.reaction-size span{margin-right:auto;color:var(--muted);font-size:.65rem}.reaction-size button{padding:4px 7px;border:1px solid var(--line);font-size:.64rem}.reaction-size button.active{border-color:var(--accent);background:var(--accent);color:#fff}.phrase-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:3px}.phrase-grid button{min-height:31px;border:1px solid var(--line);font-size:.68rem}.emoji-panel .p2p-connect{width:100%;height:auto;margin-top:5px;padding:7px;border:1px solid var(--accent);color:var(--accent);font-size:.68rem;font-weight:700}.emoji-panel>small{display:block;padding:5px;color:var(--muted);font-size:.62rem;line-height:1.4}.radio-name-field{display:grid;grid-template-columns:48px 1fr;align-items:center;gap:6px;color:var(--muted);font-size:.66rem}.radio-name-field input{min-width:0;height:32px;padding:0 7px;border:1px solid var(--line);background:var(--surface)}.radio-summary{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:34px;margin-top:5px;padding:6px 7px;background:var(--surface-2)}.radio-state{margin:0;color:var(--muted);font-size:.68rem}.radio-state.live,.radio-state.available{color:#c92626;font-weight:700}.radio-summary>strong{white-space:nowrap;font-size:.65rem}.radio-popover audio{width:100%;height:34px;margin-top:6px}.radio-actions{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}.radio-actions button{flex:1 1 85px;min-height:32px;border:1px solid var(--line);background:var(--surface);font-size:.66rem}.radio-popover>small{display:block;margin-top:6px;color:var(--muted);font-size:.59rem;line-height:1.4}@keyframes radio-pulse{50%{opacity:.45}}

.emoji-panel .p2p-disconnect{width:100%;height:auto;margin-top:5px;padding:7px;border:1px solid var(--danger);color:var(--danger);font-size:.68rem;font-weight:700}.radio-actions .disconnect-action{border-color:var(--danger);color:var(--danger)}
.emoji-panel{overflow-x:hidden}.reaction-grid button{min-width:0}

.thread-sidebar { grid-area:side;min-width:0;min-height:0;display:flex;flex-direction:column;border-right:1px solid var(--line);background:var(--surface);overflow:hidden; }
.radio-meter{height:7px;margin:6px 0 2px;border:1px solid var(--line);background:var(--surface-2);overflow:hidden}.radio-meter i{display:block;height:100%;background:linear-gradient(90deg,#38a169 0 65%,#d69e2e 65% 84%,#d43b32 84%);transition:width .08s linear}
.list-controls { display:flex;align-items:center;gap:8px;padding:7px;border-bottom:1px solid var(--line); }
.filter-row { flex:1;display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line); }
.filter-row button { height:28px;border-right:1px solid var(--line);background:var(--surface-2);color:var(--muted);cursor:pointer;font-size:.67rem; }.filter-row button:last-child{border-right:0}.filter-row button.active{background:var(--accent);color:#fff;}
.sort-row { color:var(--muted);font-size:0; }.sort-row select{height:30px;max-width:92px;border:1px solid var(--line);background:var(--surface);font-size:.67rem;}
.thread-list { flex:1;min-height:0;margin:0;padding:0;overflow-y:auto;overscroll-behavior-y:contain;list-style:none; }
.thread-list li { display:flex;border-bottom:1px solid var(--line); }.thread-list li:hover{background:var(--hover)}.thread-list li.selected{background:var(--accent-soft);box-shadow:inset 3px 0 var(--accent)}
.thread-link { flex:1;min-width:0;padding:9px 5px 9px 11px;text-align:left;background:transparent;cursor:pointer; }
.thread-title { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.8rem;line-height:1.35; }
.thread-meta { display:flex;gap:9px;margin-top:4px;color:var(--muted);font-size:.62rem; }.thread-meta .unread{padding:0 4px;background:var(--accent);color:#fff;font-weight:700;}
.favorite-button { flex:0 0 auto;color:#aa7500;font-size:1.15rem; }.thread-list .favorite-button{width:36px;height:auto;}
.mobile-new-thread { display:none; }

.main-view { grid-area:main;min-width:0;min-height:0;overflow:hidden;background:var(--bg); }
.dashboard { height:100%;padding:18px 22px;overflow-y:auto; }
.dashboard-header { display:flex;align-items:flex-end;justify-content:space-between;gap:15px;padding-bottom:10px;border-bottom:2px solid var(--text); }
.dashboard-header h1{margin:0;font-size:1.22rem}.dashboard-header p{margin:3px 0 0;color:var(--muted);font-size:.72rem}.dashboard-header button{padding:5px 10px;border:1px solid var(--line);background:var(--surface);cursor:pointer;font-size:.7rem;}
.summary-strip{display:grid;grid-template-columns:repeat(4,1fr);margin:10px 0 0;border:1px solid var(--line);background:var(--surface)}.summary-strip>div{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:8px 12px;border-right:1px solid var(--line)}.summary-strip>div:last-child{border-right:0}.summary-strip dt{color:var(--muted);font-size:.65rem}.summary-strip dd{margin:0;font-size:.95rem;font-weight:700}
.dashboard-grid { display:grid;grid-template-columns:minmax(260px,.72fr) minmax(380px,1.28fr);gap:18px;margin-top:16px; }
.activity-panel,.recent-panel { border:1px solid var(--line);background:var(--surface); }
.activity-panel { padding:14px 16px;align-self:start; }.activity-panel h2,.recent-panel h2{margin:0;font-size:.9rem}.panel-note{margin:4px 0 0;color:var(--muted);font-size:.65rem;}
.bar-chart { height:190px;display:flex;align-items:stretch;gap:7px;margin-top:13px;padding-top:20px;border-bottom:1px solid var(--line); }
.bar-column { flex:1;min-width:0;display:grid;grid-template-rows:14px 1fr 20px;text-align:center;color:var(--muted);font-size:.6rem; }.bar-track{position:relative;align-self:stretch;background:var(--surface-2)}.bar-track i{position:absolute;right:18%;bottom:0;left:18%;min-height:0;background:var(--accent)}.bar-value{font-size:.62rem}.bar-column small{padding-top:5px;font-size:.58rem;}
.recent-panel h2{padding:12px 14px;border-bottom:1px solid var(--line)}.recent-list{margin:0;padding:0;list-style:none}.recent-list li{border-bottom:1px solid var(--line)}.recent-list li:last-child{border-bottom:0}.recent-list button{width:100%;display:grid;grid-template-columns:1fr auto;gap:3px 10px;padding:9px 12px;text-align:left;background:transparent;cursor:pointer}.recent-list button:hover{background:var(--hover)}
.recent-thread{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--accent);font-size:.7rem}.recent-thread span{color:var(--muted)}.recent-text{grid-column:1/-1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.78rem}.recent-list time{grid-row:1;color:var(--muted);font-size:.58rem}.panel-empty{padding:20px;color:var(--muted);font-size:.75rem;}
.dashboard-lists{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.dashboard-lists section{border:1px solid var(--line);background:var(--surface)}.dashboard-lists h2{margin:0;padding:10px 12px;border-bottom:1px solid var(--line);font-size:.82rem}.dashboard-lists ol{margin:0;padding:0;list-style:none}.dashboard-lists li{border-bottom:1px solid var(--line)}.dashboard-lists li:last-child{border-bottom:0}.dashboard-lists li button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 11px;text-align:left;background:transparent;cursor:pointer}.dashboard-lists li button:hover{background:var(--hover)}.dashboard-lists li span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.74rem}.dashboard-lists li small{flex:0 0 auto;color:var(--muted);font-size:.6rem}

.thread-view { height:100%;min-height:0;display:grid;grid-template-rows:42px minmax(0,1fr) auto; }
.thread-header { z-index:5;min-width:0;display:flex;align-items:center;gap:7px;padding:0 10px;border-bottom:1px solid var(--line);background:var(--surface); }
.gallery-button{height:28px;padding:0 8px;border:1px solid var(--line);background:var(--surface-2);color:var(--muted);cursor:pointer;font-size:.65rem;white-space:nowrap}
.back-button{display:none;font-size:1.6rem}.thread-heading{flex:1;min-width:0}.thread-heading h1{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.88rem}.thread-heading p{margin:1px 0 0;color:var(--muted);font-size:.6rem}.header-favorite{height:34px;}
.response-scroller { min-height:0;overflow-y:auto;overscroll-behavior-y:contain;scroll-padding:56px 0; }
.response-list { width:min(1040px,100%);margin:0 auto;padding:9px 14px 3px;list-style:none; }
.response-card { margin-left:calc(var(--reply-depth,0)*16px);padding:8px 6px 12px;border-bottom:1px solid var(--line);transition:background .2s;content-visibility:auto;contain-intrinsic-size:auto 132px; }.response-card.is-highlighted{background:var(--accent-soft)}
.new-response-marker{display:flex;align-items:center;gap:8px;margin:5px 0;color:var(--accent);font-size:.68rem;font-weight:800}.new-response-marker::before,.new-response-marker::after{content:"";height:2px;flex:1;background:var(--accent)}.new-response-marker span{padding:2px 7px;background:var(--accent-soft)}
.response-info { display:flex;align-items:baseline;flex-wrap:wrap;gap:6px;color:var(--muted);font-size:.68rem; }.response-number,.reply-link,.response-id{padding:0;background:transparent;color:var(--accent);font-weight:700;cursor:pointer}.response-name{color:var(--name);font-weight:700}.response-mail{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.response-message { margin:6px 0 0 18px;line-height:1.65;overflow-wrap:anywhere;font-size:.88rem; }.reply-link{text-decoration:underline}.thread-end{display:flex;justify-content:center;align-items:center;gap:12px;padding:14px;color:var(--muted);font-size:.7rem}.thread-end button{padding:5px 9px;border:1px solid var(--line);background:var(--surface);color:var(--accent);cursor:pointer}
.media-card{display:block;width:fit-content;max-width:100%;margin-top:7px}.media-card img{display:block;max-width:min(320px,78vw);max-height:300px;border:1px solid var(--line);background:var(--surface);cursor:zoom-in}.media-card img.blurred{filter:blur(17px)}.media-card img.blurred:hover{filter:none}.media-placeholder{width:160px;height:88px;border:1px dashed var(--muted);background:var(--surface-2);color:var(--muted);cursor:pointer}.media-placeholder span{display:block}.media-source{font-size:.62rem}

.desktop-composer { z-index:8;border-top:1px solid var(--line);background:var(--surface); }
.composer-bar{height:31px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:var(--surface-2)}.composer-bar>span{display:flex;margin-right:5px}.composer-bar>span button{height:24px;padding:0 7px;border-left:1px solid var(--line);background:transparent;color:var(--muted);cursor:pointer;font-size:.62rem}.composer-toggle { min-width:160px;height:30px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 11px;background:transparent;cursor:pointer;font-size:.72rem;font-weight:700; }.composer-toggle small{color:var(--muted);font-size:.62rem;font-weight:400}
.desktop-composer-body { display:grid;grid-template-rows:30px minmax(0,1fr);gap:7px;height:181px;padding:7px 8px 8px; }
.desktop-composer.preview-visible .desktop-composer-body{height:275px}.desktop-message-column{min-width:0;min-height:0;display:grid;grid-template-rows:minmax(70px,1fr) auto;gap:5px}
.desktop-fields{display:grid;grid-template-columns:minmax(180px,1fr) minmax(180px,1fr) auto;align-items:center;gap:10px}.desktop-fields>label{display:grid;grid-template-columns:40px minmax(0,1fr);align-items:center;color:var(--muted);font-size:.65rem}.field-with-tool{position:relative;display:flex;min-width:0}.field-with-tool>input{flex:1;min-width:0}.field-with-tool>button{flex:0 0 auto;border:1px solid var(--line);border-left:0;background:var(--surface-2);cursor:pointer;font-size:.62rem}
.desktop-composer input,.desktop-composer textarea{border:1px solid var(--line);background:var(--surface);outline:0}.desktop-composer input{height:28px;padding:3px 6px;font-size:.72rem}.desktop-composer textarea{width:100%;height:100%;padding:7px;resize:none;line-height:1.45;font-size:.82rem}.desktop-composer input:focus,.desktop-composer textarea:focus{border-color:var(--accent)}
.desktop-composer-tools{display:flex;gap:5px}.desktop-composer-tools button,.desktop-composer-tools label{height:28px;padding:4px 8px;border:1px solid var(--line);background:var(--surface-2);cursor:pointer;font-size:.62rem}.desktop-composer-tools input{display:none}.desktop-message-row{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 78px;gap:8px}.desktop-submit{display:flex;flex-direction:column;justify-content:flex-end;gap:6px;text-align:right}.desktop-submit span{color:var(--muted);font-size:.6rem}.desktop-submit button{height:40px;background:var(--accent);color:#fff;cursor:pointer;font-weight:700}.desktop-submit button:disabled{opacity:.5}.composer-collapsed .desktop-composer{height:31px}

.dictionary-menu { position:absolute;z-index:55;top:32px;right:0;width:260px;border:1px solid var(--line);background:var(--surface);box-shadow:0 8px 22px rgb(0 0 0 / 22%);text-align:left; }
.desktop-composer .dictionary-menu{top:auto;bottom:31px}
.post-preview{max-height:105px;padding:7px 9px;border:1px solid var(--line);background:var(--surface-2);overflow:auto}.post-preview>strong{display:block;margin-bottom:4px;color:var(--muted);font-size:.62rem}.post-preview p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--text);font-size:.78rem;font-weight:400;line-height:1.45}.preview-reply{color:var(--accent);font-weight:700}
.dictionary-menu header{display:flex;align-items:center;justify-content:space-between;padding:7px 8px;border-bottom:1px solid var(--line);font-size:.72rem}.dictionary-menu header button{padding:3px 6px;background:transparent;color:var(--accent);cursor:pointer}.dictionary-list{max-height:210px;padding:5px;overflow:auto}.dictionary-empty{padding:8px;color:var(--muted);font-size:.68rem}.dictionary-item{display:flex;gap:3px}.dictionary-item>button:first-child{flex:1;padding:6px;text-align:left;background:transparent;cursor:pointer;font-size:.72rem}.dictionary-item>button:first-child:hover{background:var(--hover)}.dictionary-item input{flex:1;min-width:0;height:28px;border:1px solid var(--line);font-size:.72rem}.dictionary-item>button:last-child{width:28px;background:transparent;color:var(--danger);cursor:pointer}.dictionary-add{width:100%;padding:6px;background:var(--surface-2);color:var(--accent);cursor:pointer;font-size:.68rem}

.pull-indicator { flex:0 0 auto;height:0;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:7px;background:var(--accent-soft);color:var(--accent);font-size:.7rem;font-weight:700;transition:none; }.pull-indicator span{width:20px;height:20px;display:grid;place-items:center;border:1px solid currentColor;border-radius:50%;font-size:.78rem}.pull-indicator.ready{background:var(--accent);color:#fff}.pull-indicator.refreshing span{animation:spin .8s linear infinite}.pull-indicator.pull-settling{transition:height .19s ease-out}.pull-indicator.visible{min-height:0}.pull-bottom{width:100%;}.thread-list.pulling-list{transform:translateY(var(--pull-shift,0));will-change:transform}.response-scroller.pulling-thread{transform:translateY(calc(var(--pull-shift,0) * -1));will-change:transform}.thread-list.pull-settling,.response-scroller.pull-settling{transition:transform .19s ease-out}
.center-state{min-height:170px;display:grid;place-content:center;justify-items:center;color:var(--muted);font-size:.75rem}.loader{width:24px;height:24px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}.spinning{display:block;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.mobile-nav{display:none}

.overlay { position:fixed;z-index:100;inset:0;display:flex;justify-content:flex-end;background:rgb(0 0 0 / 44%); }
.reply-preview{position:fixed;z-index:90;width:min(320px,calc(100vw - 16px));max-height:180px;padding:8px 10px;border:1px solid var(--line);background:var(--surface);box-shadow:0 7px 18px rgb(0 0 0 / 20%);overflow:hidden;pointer-events:none}.reply-preview header{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:.62rem}.reply-preview header strong{color:var(--accent)}.reply-preview header time{margin-left:auto}.reply-preview p{max-height:120px;margin:6px 0 0;white-space:pre-wrap;overflow:hidden;color:var(--text);font-size:.76rem;line-height:1.45}.reply-preview small{display:none;color:var(--muted)}
.gallery-overlay{align-items:center;justify-content:center;padding:12px}.gallery-dialog{width:min(900px,100%);max-height:calc(100dvh - 24px);display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:12px;border:1px solid var(--line);background:var(--surface);box-shadow:0 12px 32px rgb(0 0 0 / 28%)}.gallery-dialog>header{display:flex;align-items:center;justify-content:space-between;padding-bottom:8px}.gallery-dialog h2{margin:0;font-size:.9rem}.gallery-dialog header p{margin:2px 0 0;color:var(--muted);font-size:.65rem}.gallery-dialog header button{width:32px;height:32px;background:transparent;cursor:pointer;font-size:1.1rem}.gallery-image{min-height:0;display:grid;place-items:center;background:#111;overflow:auto}.gallery-image img{display:block;max-width:100%;max-height:calc(100dvh - 145px);object-fit:contain}.gallery-dialog footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:8px}.gallery-dialog footer button,.gallery-dialog footer a{min-height:32px;padding:7px 11px;border:1px solid var(--line);background:var(--surface-2);cursor:pointer;font-size:.68rem;text-decoration:none}.gallery-dialog footer button:disabled{opacity:.4}
.settings-sheet { width:min(370px,calc(100% - 24px));height:100%;padding:max(15px,env(safe-area-inset-top)) 16px max(16px,env(safe-area-inset-bottom));background:var(--surface);overflow-y:auto;box-shadow:-5px 0 18px rgb(0 0 0 / 18%); }
.install-setting{display:grid;gap:5px;margin:12px 0;padding:10px;border:1px solid var(--line);background:var(--surface-2)}.install-setting button{min-height:34px;background:var(--accent);color:#fff;cursor:pointer;font-size:.72rem;font-weight:700}.install-setting strong,.install-setting small{color:var(--muted);font-size:.66rem;line-height:1.45}
.sheet-header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:12px}.sheet-header h2{margin:5px 0;font-size:1rem}.sheet-header p{max-width:520px;margin:2px 0 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-size:.68rem}
.setting-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:12px 0;border-bottom:1px solid var(--line);cursor:pointer}.setting-row span{display:grid;gap:2px}.setting-row strong{font-size:.78rem}.setting-row small{color:var(--muted);font-size:.65rem}.setting-row input{width:38px;height:21px;accent-color:var(--accent)}
.palette-setting{margin:16px 0 0;padding:10px;border:1px solid var(--line)}.palette-setting legend{padding:0 5px;font-size:.75rem}.palette-setting label{display:flex;align-items:center;gap:8px;padding:6px;cursor:pointer;font-size:.72rem}.palette-setting i{width:20px;height:12px;background:var(--accent)}.palette-gray i{background:#555b63}.palette-blue i{background:#2868a9}.palette-green i{background:#237a4b}.palette-amber i{background:#9a6500}.palette-rose i{background:#a63d5d}.palette-violet i{background:#6550a4}.board-return{display:block;margin-top:18px;padding:8px;border:1px solid var(--line);text-align:center;text-decoration:none;color:var(--muted);font-size:.72rem}
.search-overlay{justify-content:center;align-items:flex-start;padding-top:max(55px,env(safe-area-inset-top))}.search-dialog{width:min(560px,calc(100% - 20px));max-height:min(75dvh,620px);padding:12px;border:1px solid var(--line);background:var(--surface);box-shadow:0 10px 28px rgb(0 0 0 / 25%);overflow:auto}.search-dialog header{display:flex;justify-content:space-between;align-items:center}.search-dialog h2{margin:0;font-size:.9rem}.search-dialog header button{width:30px;height:30px;background:transparent;cursor:pointer}.search-dialog>input{width:100%;height:38px;margin:9px 0;padding:5px 9px;border:1px solid var(--line);background:var(--surface-2)}.search-dialog>p{color:var(--muted);font-size:.72rem}.search-dialog ol{margin:0;padding:0;list-style:none}.search-dialog li{border-bottom:1px solid var(--line)}.search-dialog li button{width:100%;display:flex;justify-content:space-between;gap:10px;padding:8px 5px;text-align:left;background:transparent;cursor:pointer;font-size:.75rem}.search-dialog li button:hover{background:var(--hover)}.search-dialog li small{flex:0 0 auto;color:var(--muted)}
.centered-overlay{align-items:center;justify-content:center;padding:10px}.id-posts-dialog{width:min(680px,calc(100% - 20px));max-height:min(78dvh,680px);border:1px solid var(--line);background:var(--surface);box-shadow:0 10px 28px rgb(0 0 0 / 25%);overflow:auto}.id-posts-dialog>header{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid var(--line);background:var(--surface)}.id-posts-dialog h2{margin:0;font-size:.9rem}.id-posts-dialog header p{margin:3px 0 0;color:var(--muted);font-size:.65rem}.id-posts-dialog header>button{width:30px;height:30px;background:transparent;cursor:pointer}.id-posts-dialog ol{margin:0;padding:0;list-style:none}.id-posts-dialog li{border-bottom:1px solid var(--line)}.id-posts-dialog li>button{width:100%;display:grid;grid-template-columns:36px 1fr auto;gap:7px;padding:9px 11px;text-align:left;background:transparent;cursor:pointer}.id-posts-dialog li>button:hover{background:var(--hover)}.id-posts-dialog li span{color:var(--accent);font-weight:700}.id-posts-dialog li p{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem}.id-posts-dialog li time{color:var(--muted);font-size:.6rem}
.composer-overlay{align-items:center;justify-content:center;padding:10px}.composer-sheet{width:min(700px,calc(100% - 20px));max-height:min(88dvh,720px);padding:16px 18px max(18px,env(safe-area-inset-bottom));border:1px solid var(--line);background:var(--surface);box-shadow:0 12px 32px rgb(0 0 0 / 28%);overflow-y:auto}.composer-sheet>label,.identity-grid label,.message-label{display:grid;gap:5px;color:var(--muted);font-size:.7rem;font-weight:700}.identity-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:9px}.composer-sheet input,.composer-sheet textarea{width:100%;padding:7px 8px;border:1px solid var(--line);background:var(--surface-2);outline:0;font-size:.8rem;font-weight:400}.composer-sheet input:focus,.composer-sheet textarea:focus{border-color:var(--accent)}.composer-sheet>label:first-of-type{margin-bottom:9px}.composer-sheet textarea{min-height:130px;resize:vertical;line-height:1.5}.composer-actions{display:flex;align-items:center;gap:7px;margin-top:9px}.plain-button,.upload-button{padding:7px 9px;border:1px solid var(--line);background:var(--surface-2);cursor:pointer;font-size:.7rem}.upload-button input{display:none}.char-count{margin-left:auto;color:var(--muted);font-size:.62rem}.primary-button{min-height:34px;padding:0 13px;background:var(--accent);color:#fff;font-weight:700;cursor:pointer}.primary-button:disabled{opacity:.5}
.drawing-overlay{align-items:center;justify-content:center;padding:10px}.drawing-panel{width:min(620px,100%);max-height:calc(100dvh - 20px);padding:13px;background:var(--surface);overflow:auto}.drawing-panel canvas{display:block;width:min(400px,100%);height:auto;margin:0 auto;border:1px solid var(--line);background:#fff;cursor:crosshair;touch-action:none}.drawing-colors{display:flex;justify-content:center;flex-wrap:wrap;gap:5px;margin:10px}.drawing-colors button{width:27px;height:27px;border:1px solid var(--line);cursor:pointer}.drawing-colors button.selected{outline:2px solid var(--accent);outline-offset:2px}.drawing-tools{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px}.drawing-tools label,.drawing-tools button{padding:6px 8px;border:1px solid var(--line);background:var(--surface-2);font-size:.68rem}.drawing-tools button{cursor:pointer}.drawing-tools .primary-button{background:var(--accent);color:#fff}
.toast{position:fixed;z-index:130;left:50%;bottom:16px;transform:translateX(-50%);padding:8px 12px;background:#24272b;color:#fff;font-size:.72rem;box-shadow:0 4px 12px rgb(0 0 0 / 25%)}.error-banner{position:fixed;z-index:140;top:55px;left:50%;width:min(620px,calc(100% - 20px));transform:translateX(-50%);display:flex;gap:8px;padding:9px 11px;border:1px solid var(--danger);background:var(--surface);color:var(--danger);font-size:.72rem}.error-banner span{flex:1}.error-banner button{background:transparent;color:inherit;cursor:pointer}
.emoji-stage{position:fixed;z-index:1000;inset:0;pointer-events:none;overflow:hidden}.emoji-stage span{position:absolute;bottom:-80px;white-space:nowrap;animation:emoji-float 2.5s ease-out forwards}.emoji-stage .reaction-normal{font-size:2.5rem}.emoji-stage .reaction-large{font-size:4.5rem}.emoji-stage .reaction-huge{font-size:7rem}.emoji-stage .reaction-phrase{padding:7px 13px;border:2px solid currentColor;background:var(--surface);color:var(--accent);font-size:2rem;font-weight:800;box-shadow:4px 4px 0 rgb(0 0 0 / 18%)}@keyframes emoji-float{0%{transform:translateY(0) scale(.7);opacity:0}15%{opacity:1}100%{transform:translateY(-75dvh) rotate(18deg) scale(1.1);opacity:0}}

.field-with-tool>.field-clear{width:28px;padding:0;border-color:var(--line);background:var(--surface);color:var(--muted);font-size:.9rem}.field-with-tool>.field-clear:hover{background:var(--hover);color:var(--danger)}
.reaction-window{position:fixed;z-index:150;width:min(560px,calc(100vw - 16px));height:min(650px,calc(100dvh - 64px));display:flex;flex-direction:column;border:1px solid var(--line);background:var(--surface);box-shadow:0 14px 38px rgb(0 0 0 / 30%);overflow:hidden}.reaction-window-header{flex:0 0 43px;display:flex;align-items:center;justify-content:space-between;padding:5px 7px 5px 12px;border-bottom:1px solid var(--line);background:var(--surface-2);cursor:move;user-select:none;touch-action:none}.reaction-window-header>div{display:flex;align-items:baseline;gap:8px}.reaction-window-header strong{font-size:.82rem}.reaction-window-header small{color:var(--muted);font-size:.62rem}.reaction-window-header>span{display:flex;gap:3px}.reaction-window-header button{width:31px;height:31px;background:transparent;cursor:pointer;font-size:1rem}.reaction-window-header button:hover{background:var(--hover)}.type-link-status{flex:0 0 auto;display:flex;align-items:center;gap:7px;padding:7px 9px;border-bottom:1px solid var(--line);background:var(--surface)}.type-link-status small{flex:1;color:var(--muted);font-size:.62rem;line-height:1.35}.type-link-status button{min-height:30px;padding:4px 9px;border:1px solid var(--accent);background:transparent;color:var(--accent);cursor:pointer;font-size:.66rem;font-weight:700}.type-link-status .link-disconnect{border-color:var(--danger);color:var(--danger)}.reaction-tabs{flex:0 0 auto;display:grid;grid-template-columns:repeat(5,1fr);border-bottom:1px solid var(--line);background:var(--surface-2)}.reaction-tabs button{min-width:0;height:38px;padding:0 4px;background:transparent;color:var(--muted);cursor:pointer;font-size:.64rem;white-space:nowrap}.reaction-tabs button.active{box-shadow:inset 0 -2px var(--accent);background:var(--surface);color:var(--accent);font-weight:700}.reaction-window-body{flex:1;min-height:0;padding:10px;overflow:auto}.reaction-pane{height:100%}.reaction-window .reaction-grid{grid-template-columns:repeat(4,1fr);gap:7px}.reaction-window .reaction-grid button{height:72px;border:1px solid var(--line);background:var(--surface-2);font-size:2.4rem;cursor:pointer}.reaction-window .reaction-size{justify-content:flex-end;margin:11px 0}.reaction-window .reaction-size span{margin-right:auto}.reaction-window .reaction-size button{min-height:32px;background:var(--surface)}.reaction-window .phrase-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.reaction-window .phrase-grid button{min-height:40px;padding:5px;border:1px solid var(--line);background:var(--surface-2);cursor:pointer;font-size:.7rem}.reaction-window button:disabled{opacity:.38;cursor:not-allowed}.pane-note{display:block;margin:9px 0;color:var(--muted);font-size:.62rem;line-height:1.45}.reaction-window.is-minimized{width:min(520px,calc(100vw - 16px));height:96px}.reaction-window.is-minimized .reaction-window-header{flex-basis:38px;cursor:default}.reaction-mini{flex:1;display:flex;align-items:center;gap:4px;padding:5px 7px}.reaction-mini button{min-width:42px;height:43px;border:1px solid var(--line);background:var(--surface);cursor:pointer;font-size:1.15rem}.reaction-mini button:nth-last-child(-n+2){padding:0 9px;font-size:.65rem}.reaction-mini .mini-open{margin-left:auto;color:var(--accent);font-weight:700}
.shared-drawing{display:grid;gap:8px}.shared-canvas-wrap{min-height:0;display:grid;place-items:center;background:#d8d8d5}.shared-drawing canvas{display:block;width:min(640px,100%);height:auto;max-height:calc(100dvh - 295px);border:1px solid var(--line);background:#fff;cursor:crosshair;touch-action:none}.shared-drawing-tools{display:flex;align-items:center;flex-wrap:wrap;gap:6px}.shared-drawing-tools .drawing-colors{flex:1;justify-content:flex-start;margin:0}.shared-drawing-tools label,.shared-drawing-tools>button{min-height:32px;padding:5px 8px;border:1px solid var(--line);background:var(--surface-2);cursor:pointer;font-size:.66rem}.shared-drawing>small{color:var(--muted);font-size:.6rem}
.pencil-pane{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center}.pencil-state{display:grid;gap:3px}.pencil-state strong{font-size:1rem}.pencil-state small{color:var(--muted);font-size:.64rem}.pencil-score{width:min(340px,100%);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px}.pencil-score>div{display:grid;gap:4px;padding:12px;border:1px solid var(--line);background:var(--surface-2)}.pencil-score span{color:var(--muted);font-size:.65rem}.pencil-score strong{font-size:2rem}.battle-pencil{width:min(380px,90%);height:110px;display:grid;place-content:center;gap:6px;border:1px dashed var(--accent);background:var(--accent-soft);color:var(--accent);cursor:grab;touch-action:none;user-select:none}.battle-pencil span{font-size:3.6rem;transform:rotate(-18deg)}.battle-pencil small{font-size:.68rem}.battle-pencil.rolling span{animation:pencil-roll .36s linear infinite}.pencil-result{margin:0;color:var(--accent);font-size:1.25rem;font-weight:800}.pencil-actions{display:flex;gap:7px}.pencil-actions button,.maid-toggle{min-height:36px;padding:6px 12px;border:1px solid var(--accent);background:var(--surface);color:var(--accent);cursor:pointer;font-size:.7rem;font-weight:700}@keyframes pencil-roll{to{transform:rotate(342deg)}}
.maid-pane{height:100%;display:grid;place-content:center;justify-items:center;gap:14px}.maid-preview{width:min(390px,100%);display:flex;align-items:center;gap:14px;padding:14px;border:1px solid var(--line);background:var(--surface-2)}.maid-preview>span{font-size:3rem}.maid-preview>div{display:grid;gap:5px;text-align:left}.maid-preview small{color:var(--muted);font-size:.65rem;line-height:1.45}.maid-companion{position:fixed;z-index:120;width:92px;height:112px;display:grid;place-items:end center;transform:translate(-50%,-75%);cursor:grab;touch-action:none;user-select:none;filter:drop-shadow(0 5px 5px rgb(0 0 0 / 24%))}.maid-companion:active{cursor:grabbing}.maid-companion img{width:100%;height:100%;object-fit:contain;pointer-events:none;-webkit-user-drag:none}.maid-companion>span{font-size:4.2rem;pointer-events:none}.maid-companion.facing-left img,.maid-companion.facing-left>span{transform:scaleX(-1)}.maid-companion.walking img,.maid-companion.walking>span{animation:maid-step .75s ease-in-out infinite alternate}@keyframes maid-step{to{translate:0 -5px;rotate:2deg}}
.maid-companion>.maid-sprite{width:100%;height:100%;display:block;background-image:url('../img/maid.png');background-repeat:no-repeat;background-size:300% 400%;background-position:50% 66.666%;font-size:0;transform:none;pointer-events:none}.maid-companion.facing-left>.maid-sprite{background-position:50% 33.333%;transform:none}.maid-companion.walking>.maid-sprite{animation:maid-walk-right .72s steps(1,end) infinite}.maid-companion.walking.facing-left>.maid-sprite{animation-name:maid-walk-left}@keyframes maid-walk-right{0%{background-position:0 66.666%}33%{background-position:50% 66.666%}66%,100%{background-position:100% 66.666%}}@keyframes maid-walk-left{0%{background-position:0 33.333%}33%{background-position:50% 33.333%}66%,100%{background-position:100% 33.333%}}
.maid-preview>.maid-preview-sprite{flex:0 0 68px;width:68px;height:82px;display:block;background:url('../img/maid.png') 50% 0/300% 400% no-repeat;font-size:0}

@media(max-width:900px) and (min-width:761px){.app-shell{grid-template-columns:275px minmax(0,1fr)}.dashboard-grid{grid-template-columns:1fr}.desktop-fields{grid-template-columns:1fr 1fr}.desktop-composer-tools{display:none}}
@media(max-width:760px){
    :root{--topbar-height:calc(44px + env(safe-area-inset-top))}
    .app-shell{grid-template-columns:minmax(0,1fr);grid-template-rows:var(--topbar-height) minmax(0,1fr);grid-template-areas:"top" "main"}.app-shell.has-mobile-nav{grid-template-rows:var(--topbar-height) minmax(0,1fr) calc(54px + env(safe-area-inset-bottom));grid-template-areas:"top" "main" "nav"}
    .topbar{padding:env(safe-area-inset-top) 5px 0 8px}.brand-mark{width:25px;height:25px}.brand-text{max-width:30vw;font-size:.8rem}.topbar-actions{gap:0}.icon-button{width:31px;height:31px}.desktop-action,.new-thread-top{display:none}.viewer-count{min-width:24px;margin-right:0;gap:2px;font-size:.64rem}
    .thread-sidebar{grid-area:main;border-right:0}.thread-sidebar.mobile-hidden,.main-view.mobile-hidden{display:none}.main-view{grid-area:main}.list-controls{padding:5px}.thread-link{padding:9px}.thread-list{overscroll-behavior-y:auto}.mobile-new-thread{display:block;flex:0 0 auto;height:40px;margin:6px 8px max(6px,env(safe-area-inset-bottom));background:var(--accent);color:#fff;font-size:.75rem;font-weight:700}
    .dashboard{padding:10px}.dashboard-header{padding-bottom:7px}.dashboard-header h1{font-size:1rem}.summary-strip{grid-template-columns:1fr 1fr}.summary-strip>div:nth-child(2){border-right:0}.summary-strip>div:nth-child(-n+2){border-bottom:1px solid var(--line)}.dashboard-grid,.dashboard-lists{grid-template-columns:1fr;gap:10px;margin-top:10px}.activity-panel{padding:10px}.bar-chart{height:140px}.recent-list button{padding:8px}.recent-list time{display:none}
    .thread-view{grid-template-rows:38px minmax(0,1fr)}.thread-header{padding:0 5px}.back-button{display:grid}.thread-heading h1{font-size:.78rem}.desktop-composer{display:none}.response-scroller{overscroll-behavior-y:auto}.response-list{padding:4px 7px}.response-card{margin-left:calc(var(--reply-depth,0)*7px);padding:8px 4px 10px;content-visibility:visible;contain-intrinsic-size:none}.response-info{gap:5px;font-size:.64rem}.response-message{margin-left:12px;font-size:.83rem}.thread-end{padding:10px}
    .mobile-nav{grid-area:nav;z-index:20;display:grid;grid-template-columns:repeat(4,1fr);padding-bottom:env(safe-area-inset-bottom);border-top:1px solid var(--line);background:var(--surface)}.mobile-nav button{display:grid;place-content:center;justify-items:center;gap:0;background:transparent;color:var(--muted);cursor:pointer}.mobile-nav span{font-size:1rem}.mobile-nav small{font-size:.58rem}.mobile-nav .write-nav{color:var(--accent);font-weight:700}
    .emoji-panel,.radio-popover{position:fixed;top:calc(var(--topbar-height) + 4px);right:6px;width:min(340px,calc(100vw - 12px));max-height:calc(100dvh - var(--topbar-height) - 10px)}.settings-sheet{width:min(370px,calc(100% - 12px))}.composer-sheet{width:calc(100% - 16px);max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px);padding:12px 10px max(12px,env(safe-area-inset-bottom))}.identity-grid{grid-template-columns:1fr;gap:6px}.composer-sheet input,.composer-sheet textarea,.radio-name-field input,.search-dialog input{font-size:16px}.composer-sheet textarea{min-height:120px}.dictionary-menu{position:fixed;top:50%;left:50%;width:min(300px,calc(100% - 24px));transform:translate(-50%,-50%)}.toast{bottom:calc(62px + env(safe-area-inset-bottom))}
    .reaction-window{inset:0!important;width:100%;height:100dvh;border:0;box-shadow:none}.reaction-window-header{padding-top:max(5px,env(safe-area-inset-top));flex-basis:calc(43px + env(safe-area-inset-top));cursor:default}.reaction-window-body{padding:8px 8px max(10px,env(safe-area-inset-bottom))}.reaction-window .phrase-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.reaction-window .reaction-grid button{height:64px}.reaction-tabs button{height:42px;font-size:.6rem}.reaction-window.is-minimized{inset:auto 0 calc(54px + env(safe-area-inset-bottom)) 0!important;width:100%;height:94px;border-top:1px solid var(--line);box-shadow:0 -6px 18px rgb(0 0 0 / 18%)}.reaction-window.is-minimized .reaction-window-header{flex-basis:37px;padding-top:3px}.reaction-mini{overflow-x:auto}.shared-drawing canvas{max-height:calc(100dvh - 330px)}.maid-companion{width:76px;height:94px}
}
@media(max-width:390px){.brand-text{max-width:20vw}.response-card{margin-left:0}.composer-actions{flex-wrap:wrap}.char-count{order:3;margin-left:0;width:100%;text-align:right}.emoji-stage .reaction-huge{font-size:5.5rem}}
@media(hover:none){.reply-preview small{display:block;margin-top:4px}.reply-preview p{max-height:96px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}

/* TYPE link: unified reactions and radio window */
.reaction-tabs{grid-template-columns:repeat(7,1fr)}
.radio-pane{width:min(430px,100%);margin:0 auto;padding:4px}
.radio-pane audio{width:100%;height:34px;margin-top:6px}
.radio-pane>small{display:block;margin-top:6px;color:var(--muted);font-size:.59rem;line-height:1.4}
.emoji-stage span{animation-duration:5s}
.reaction-window.is-minimized .reaction-window-header{cursor:move}
.reaction-mini{overflow-x:auto}
.reaction-mini .recent-phrase{padding:0 8px;font-size:.62rem;white-space:nowrap}
.reaction-mini .mini-open{padding:0 9px;font-size:.65rem}
@media(max-width:760px){
    .reaction-window.is-minimized{inset:auto!important;left:var(--reaction-dock-left,6px)!important;top:var(--reaction-dock-top,calc(100dvh - 154px))!important;right:auto!important;bottom:auto!important;width:min(350px,calc(100vw - 12px));height:94px;border:1px solid var(--line);box-shadow:0 6px 18px rgb(0 0 0 / 22%)}
    .reaction-window.is-minimized .reaction-window-header{cursor:move}
}

/* Original reference-sheet maid plus the dedicated picked-up pose.
   シート実測値(1024x1536): 前向き y35-395 / 左歩き y429-757 / 右歩き y789-1117 / 後ろ姿 y1142-1480。
   絵がセル境界(384px刻み)を越えて描かれているため、行ごとに実測ベースの切り出し窓を使う。 */
.maid-companion>.maid-sprite{background-image:url('../img/maid-original-sheet-20260804.png');background-size:366.65% 451.76%;background-position:49.6% 65.47%;background-repeat:no-repeat;transform:none}
.maid-companion.facing-left>.maid-sprite{background-position:50.07% 35.37%;transform:none}
.maid-companion.pose-front>.maid-sprite{background-size:335.11% 412.9%;background-position:51.11% 2.49%;animation:maid-idle-front 2.6s steps(1,end) infinite}
.maid-companion.pose-back>.maid-sprite{background-size:356.17% 438.86%;background-position:50.82% 95.78%;animation:maid-idle-back 2.6s steps(1,end) infinite}
.maid-companion.walking>.maid-sprite{animation:maid-sheet-right .72s steps(1,end) infinite}
.maid-companion.walking.facing-left>.maid-sprite{animation-name:maid-sheet-left}
.maid-companion.held{transform:translate(-53.5%,-2%)}
.maid-companion.held>.maid-sprite{background-image:url('../img/maid-grabbed-20260804.png');background-size:167.76% 137.8%;background-position:44.17% 18.6%;animation:none;transform:none}
.maid-companion.held.facing-left>.maid-sprite{background-position:44.17% 18.6%;transform:none}
.maid-preview>.maid-preview-sprite{background-image:url('../img/maid-original-sheet-20260804.png');background-size:335.11% 412.9%;background-position:51.11% 2.49%}
.maid-speech{position:absolute;z-index:2;left:50%;bottom:94%;width:max-content;max-width:min(240px,72vw);padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);font-size:.7rem!important;line-height:1.35;box-shadow:0 4px 12px rgb(0 0 0 / 18%);transform:translateX(-50%);animation:none!important;pointer-events:none}
.maid-companion.facing-left>.maid-speech{transform:translateX(-50%)}
.maid-speech::after{content:"";position:absolute;top:100%;left:50%;width:8px;height:8px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--surface);transform:translate(-50%,-50%) rotate(45deg)}
.maid-options{width:min(390px,100%);display:grid;grid-template-columns:1fr 1fr;gap:7px}.maid-options label{display:flex;align-items:center;gap:6px;padding:8px;border:1px solid var(--line);background:var(--surface-2);font-size:.67rem}.maid-actions{width:min(390px,100%);display:flex;gap:7px}.maid-actions button{flex:1;min-height:34px;padding:5px 8px;border:1px solid var(--line);background:var(--surface);color:var(--text);cursor:pointer;font-size:.66rem}.maid-actions button:disabled{opacity:.4;cursor:not-allowed}
@keyframes maid-sheet-right{0%{background-position:12.74% 65.47%;translate:0 0}33%{background-position:49.6% 65.47%;translate:0 -4px}66%,100%{background-position:85.99% 65.47%;translate:0 0}}
@keyframes maid-sheet-left{0%{background-position:13.14% 35.37%;translate:0 0}33%{background-position:50.07% 35.37%;translate:0 -4px}66%,100%{background-position:85.92% 35.37%;translate:0 0}}
@keyframes maid-idle-front{0%,100%{background-position:12.14% 2.49%}30%{background-position:51.11% 2.49%}65%{background-position:87.99% 2.49%}}
@keyframes maid-idle-back{0%,100%{background-position:13.75% 95.78%}30%{background-position:50.82% 95.78%}65%{background-position:87.2% 95.78%}}
@media(max-width:760px){.maid-options{grid-template-columns:1fr}.maid-speech{max-width:68vw}}

/* ===== 2026-08-04 改修: 表示モード / ホームカード / クルーズ / スワイプ ===== */

/* トップバーの「TYPEリンク」テキストボタン */
.type-link-top{position:relative;height:30px;padding:0 10px;border:1px solid var(--accent);background:transparent;color:var(--accent);cursor:pointer;font-size:.68rem;font-weight:700;white-space:nowrap}
.type-link-top:hover{background:var(--accent-soft)}
.type-link-top.radio-live{color:#c92626;border-color:#c92626;animation:radio-pulse 1.4s ease-in-out infinite}
.type-link-top.radio-available::after{content:"";position:absolute;top:3px;right:3px;width:6px;height:6px;border-radius:50%;background:#d42b2b}

/* リアクションの人別カラー */
.emoji-stage .reaction-emoji{filter:drop-shadow(0 0 9px hsl(var(--reaction-hue,210) 85% 55%)) drop-shadow(0 0 2px hsl(var(--reaction-hue,210) 85% 45%))}
.emoji-stage .reaction-phrase{color:hsl(var(--reaction-hue,210) 65% 36%)}
:root[data-theme="dark"] .emoji-stage .reaction-phrase{color:hsl(var(--reaction-hue,210) 75% 70%)}

/* ホームのカードグリッド */
.dashboard-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:16px}
.dashboard-cards>*{min-width:0}
.dashboard-cards .card-full{grid-column:1/-1}
.dashboard-cards .summary-strip{margin:0}
.quick-composer,.list-panel{border:1px solid var(--line);background:var(--surface)}
.quick-composer{padding:12px 14px;display:grid;gap:8px}
.quick-composer h2{margin:0;font-size:.9rem}
.quick-thread{display:grid;gap:4px;min-width:0;color:var(--muted);font-size:.65rem}
.quick-thread select{width:100%;min-width:0;height:34px;border:1px solid var(--line);background:var(--surface);font-size:.75rem;text-overflow:ellipsis}
.dashboard{overflow-x:hidden}
.quick-composer textarea{width:100%;min-height:64px;padding:8px;border:1px solid var(--line);background:var(--surface-2);resize:vertical;line-height:1.5;font-size:.82rem;outline:0}
.quick-composer textarea:focus{border-color:var(--accent)}
.quick-composer-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px}
.quick-composer-actions span{color:var(--muted);font-size:.6rem}
.quick-composer-actions button{min-height:34px;padding:0 16px;background:var(--accent);color:#fff;font-weight:700;cursor:pointer}
.quick-composer-actions button:disabled{opacity:.5}
.list-panel h2{margin:0;padding:10px 12px;border-bottom:1px solid var(--line);font-size:.82rem}
.list-panel ol{margin:0;padding:0;list-style:none}
.list-panel li{border-bottom:1px solid var(--line)}
.list-panel li:last-child{border-bottom:0}
.list-panel li button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 11px;text-align:left;background:transparent;cursor:pointer}
.list-panel li button:hover{background:var(--hover)}
.list-panel li span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.74rem}
.list-panel li small{flex:0 0 auto;color:var(--muted);font-size:.6rem}
.card-toggle-header{display:flex;align-items:center;justify-content:space-between;gap:10px}
.card-toggle-header h2{margin:0;font-size:.9rem}
.card-toggle-header button{padding:4px 9px;border:1px solid var(--line);background:var(--surface-2);color:var(--muted);cursor:pointer;font-size:.64rem}
.card-toggle-header button:hover{background:var(--hover);color:var(--text)}

/* デスクトップの先頭/末尾ボタンを左寄せ */
.composer-bar{justify-content:flex-start}
.composer-bar .composer-scroll{margin-left:6px}

/* ID横のレス数 */
.id-count{color:var(--muted);font-size:.62rem}

/* ツリー表示の接続線 */
.tree-mode .response-card{position:relative}
.tree-mode .response-card.tree-child::before{content:"";position:absolute;top:0;bottom:calc(100% - 22px);left:-11px;width:9px;border-left:2px solid var(--line);border-bottom:2px solid var(--line)}

/* チャット風表示 */
.chat-mode .response-list{display:flex;flex-direction:column;gap:10px;padding:12px 14px}
.chat-mode .response-card,.chat-mode .new-response-marker{margin-left:0}
.chat-mode .response-card{max-width:76%;align-self:flex-start;display:flex;align-items:flex-end;gap:5px;padding:0;border-bottom:0;content-visibility:visible;contain-intrinsic-size:none}
.chat-mode .response-card.own-response{align-self:flex-end}
.chat-mode .response-info{display:none}
.chat-mode .chat-time{flex:0 0 auto;padding-bottom:2px;color:var(--muted);font-size:.58rem;line-height:1.2}
.chat-mode .own-response .chat-time{order:-1}
.chat-mode .response-message{width:fit-content;max-width:100%;margin:0;padding:8px 12px;border:1px solid var(--line);border-radius:14px 14px 14px 4px;background:var(--surface);font-size:.85rem}
.chat-mode .own-response .response-message{border-color:var(--accent);border-radius:14px 14px 4px 14px;background:var(--accent-soft)}
.chat-mode .thread-end{border-top:1px solid var(--line)}

/* スワイプアクションの予告ピル */
.swipe-hint{position:fixed;z-index:170;top:50%;left:50%;padding:10px 18px;border-radius:999px;background:rgb(0 0 0 / 72%);color:#fff;font-size:.85rem;font-weight:700;white-space:nowrap;transform:translate(-50%,-50%);pointer-events:none}

/* TYPEクルーズ */
.cruise-overlay{position:fixed;z-index:160;inset:0;display:grid;place-content:center;justify-items:center;gap:6px;background:rgb(0 0 0 / 55%);color:#fff;text-align:center;pointer-events:none}
.cruise-overlay small{font-size:.85rem;font-weight:700;letter-spacing:.2em}
.cruise-overlay strong{font-size:6rem;line-height:1;font-variant-numeric:tabular-nums;animation:cruise-tick 1s ease-in-out infinite}
.cruise-overlay span{max-width:80vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.8rem;opacity:.9}
@keyframes cruise-tick{0%{transform:scale(1);opacity:.65}12%{transform:scale(1.18);opacity:1}100%{transform:scale(1)}}
.cruise-banner{position:fixed;z-index:95;top:calc(var(--topbar-height) + 8px);left:50%;display:flex;align-items:center;gap:8px;padding:5px 7px 5px 12px;border:1px solid var(--accent);background:var(--surface);color:var(--accent);font-size:.68rem;font-weight:700;box-shadow:0 4px 12px rgb(0 0 0 / 18%);transform:translateX(-50%)}
.cruise-banner button{padding:3px 8px;border:1px solid var(--danger);background:transparent;color:var(--danger);cursor:pointer;font-size:.62rem}
.cruise-pane{height:100%;display:grid;place-content:center;justify-items:center;gap:12px;text-align:center}
.cruise-state{display:grid;gap:4px}
.cruise-state strong{font-size:1rem}
.cruise-state small{color:var(--muted);font-size:.64rem}
.cruise-actions button{min-height:38px;padding:8px 18px;border:1px solid var(--accent);background:var(--surface);color:var(--accent);cursor:pointer;font-size:.72rem;font-weight:700}
.cruise-actions button:disabled{opacity:.4;cursor:not-allowed}
.cruise-actions .disconnect-action{border-color:var(--danger);color:var(--danger)}

/* 設定: 表示モード・ホームカード */
.view-mode-setting label{display:flex;align-items:center;gap:8px;padding:6px;cursor:pointer;font-size:.72rem}
.home-cards-setting{margin:16px 0 0;padding:10px;border:1px solid var(--line)}
.home-cards-setting legend{padding:0 5px;font-size:.75rem}
.home-card-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:2px 0}
.home-card-row label{display:flex;align-items:center;gap:8px;padding:5px;cursor:pointer;font-size:.72rem}
.home-card-row span{display:flex;gap:4px}
.home-card-row button{width:30px;height:28px;border:1px solid var(--line);background:var(--surface-2);cursor:pointer}
.home-card-row button:disabled{opacity:.35;cursor:not-allowed}
.home-cards-setting>small{display:block;padding:4px 6px 0;color:var(--muted);font-size:.6rem}

/* スマホ用FAB・モバイル調整 */
.mobile-fab{display:none}
@media(max-width:760px){
    .type-link-top{height:28px;padding:0 7px;font-size:.6rem}
    /* フォーカス時の自動ズームを防ぐ(16px未満のフォームはiOS/Androidで拡大される) */
    .quick-composer textarea,.quick-thread select{font-size:16px}
    .dashboard-cards{grid-template-columns:1fr;gap:10px;margin-top:10px}
    .recent-list time{display:block}
    .mobile-fab{position:fixed;z-index:60;right:14px;bottom:calc(18px + env(safe-area-inset-bottom));width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:#fff;font-size:1.3rem;box-shadow:0 6px 16px rgb(0 0 0 / 28%);cursor:pointer}
    .mobile-fab.fab-list{bottom:calc(64px + env(safe-area-inset-bottom))}
    .chat-mode .response-card{max-width:88%}
    .cruise-overlay strong{font-size:4.6rem}
    .cruise-banner{top:calc(var(--topbar-height) + 6px);max-width:calc(100vw - 16px)}
}


/* ===== 2026-08-05 改修: 送信ボタン行 / ミニ設定 / チャット書き込み欄 / 日付区切り / ドラッグ並び替え ===== */
.quick-input-row{display:flex;align-items:flex-end;gap:7px}
.quick-input-row textarea{flex:1;min-width:0;min-height:38px;max-height:160px;padding:9px 12px;border:1px solid var(--line);border-radius:18px;background:var(--surface-2);resize:none;overflow-y:auto;line-height:1.4;font-size:.85rem;outline:0}
.quick-input-row textarea:focus{border-color:var(--accent)}
.send-button{flex:0 0 auto;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:#fff;cursor:pointer}
.send-button:hover{background:var(--accent-strong)}
.send-button:disabled{opacity:.4;cursor:not-allowed}
.extra-toggle{flex:0 0 auto;width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:var(--surface-2);color:var(--muted);font-size:1.15rem;line-height:1;cursor:pointer}
.extra-toggle:hover{background:var(--hover);color:var(--text)}
.extra-toggle.active{border-color:var(--accent);color:var(--accent)}
.mini-identity{display:grid;gap:7px;padding:9px;border:1px solid var(--line);background:var(--surface-2)}
.mini-identity>label{display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:6px;color:var(--muted);font-size:.66rem}
.mini-identity input{width:100%;min-width:0;height:32px;padding:4px 8px;border:1px solid var(--line);background:var(--surface);outline:0;font-size:.78rem}
.mini-identity input:focus{border-color:var(--accent)}
.mini-identity .upload-button{display:block;text-align:center;background:var(--surface)}
.chat-composer{position:relative;z-index:8;display:flex;align-items:flex-end;gap:7px;padding:8px 10px max(8px,env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--surface)}
.chat-composer textarea{flex:1;min-width:0;min-height:38px;max-height:160px;padding:9px 12px;border:1px solid var(--line);border-radius:18px;background:var(--surface-2);resize:none;overflow-y:auto;line-height:1.4;font-size:.85rem;outline:0}
.chat-composer textarea:focus{border-color:var(--accent)}
.chat-extras{position:absolute;right:8px;bottom:calc(100% + 6px);z-index:40;width:min(330px,calc(100vw - 16px));box-shadow:0 8px 22px rgb(0 0 0 / 20%)}
.chat-date-marker{display:flex;align-items:center;gap:10px;margin:4px 0;color:var(--muted);font-size:.62rem}
.chat-date-marker::before,.chat-date-marker::after{content:"";height:1px;flex:1;background:var(--line)}
.chat-date-marker span{padding:2px 10px;border:1px solid var(--line);border-radius:999px;background:var(--surface-2)}
.card-drag-handle{width:34px;height:30px;display:grid;place-items:center;border:1px solid var(--line);background:var(--surface-2);color:var(--muted);font-size:1rem;cursor:grab;touch-action:none;user-select:none}
.card-drag-handle:active{cursor:grabbing}
.home-card-row.dragging{background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent)}
@media(max-width:760px){
    .quick-input-row textarea,.chat-composer textarea,.mini-identity input{font-size:16px}
    .thread-view.chat-mode{grid-template-rows:38px minmax(0,1fr) auto}
}