.topic-follow{position:fixed;left:max(16px,env(safe-area-inset-left));bottom:calc(88px + env(safe-area-inset-bottom));z-index:26;color:var(--text);font-size:14px}
.topic-follow-reader{left:252px;bottom:calc(24px + env(safe-area-inset-bottom))}
.topic-follow>summary{display:flex;align-items:center;gap:8px;min-height:48px;max-width:calc(100vw - 92px);padding:10px 16px;border:1px solid var(--line);border-radius:28px;background:var(--surface);color:var(--green);box-shadow:0 3px 16px #0002;cursor:pointer;list-style:none;touch-action:manipulation;user-select:none;-webkit-user-select:none;line-height:1.3}
.topic-follow>summary::-webkit-details-marker{display:none}.topic-follow>summary svg{width:20px;height:20px;flex:none}
.topic-follow[open]>.topic-panel{position:absolute;bottom:60px;left:0;width:min(420px,calc(100vw - 32px));max-height:70vh;overflow-y:auto}
.topic-panel{padding:20px;border:1px solid var(--line);border-radius:20px;background:var(--surface);color:var(--text);font-size:14px;line-height:1.5;overflow-wrap:anywhere}
.topic-panel [hidden],.topic-follow [hidden]{display:none!important}.topic-panel header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.topic-panel h2{font-size:20px;line-height:1.3;margin:0 0 8px}.topic-panel header p{margin:0;color:var(--muted);font-size:13px}.topic-panel h3{font-size:13px;margin:20px 0 10px}.topic-context{display:flex;align-items:flex-start;gap:12px;justify-content:space-between;color:var(--muted);font-size:12px;margin:16px 0}.topic-context span{white-space:nowrap;font-variant-numeric:tabular-nums}
.topic-close{display:grid;place-items:center;width:44px;height:44px;flex:none;padding:0;border:0;border-radius:50%;background:var(--soft);color:var(--text);font-size:26px;touch-action:manipulation}
.topic-chips{display:flex;flex-wrap:wrap;gap:8px}.topic-chips form{margin:0;max-width:100%}.topic-chip{display:flex;align-items:center;gap:8px;min-height:44px;max-width:100%;padding:10px 14px;border:1px solid var(--line);border-radius:24px;background:var(--soft);color:var(--text);font:inherit;text-align:left;line-height:1.4;touch-action:manipulation;user-select:none;-webkit-user-select:none;white-space:normal}.topic-chip.is-following{color:var(--green);border-color:var(--green);background:var(--surface)}
.topic-custom{margin-top:24px}.topic-custom label{display:block;font-size:13px;font-weight:600;margin-bottom:8px}.topic-custom>div{display:flex;gap:8px;align-items:stretch}.topic-custom input[type=text]{min-width:0;width:100%;flex:1;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--text);font-size:16px;line-height:1.4}.topic-custom button{min-height:46px;flex:none;padding:10px 16px;border-radius:12px;touch-action:manipulation}.topic-panel button:disabled{opacity:.55;cursor:wait}.topic-status{min-height:0;margin:14px 0 0;font-size:13px}.topic-status:empty{display:none}.topic-status.is-error{color:var(--red,#ba3549)}.topic-explore{display:flex;align-items:center;gap:8px;min-height:44px;color:var(--green);font-size:13px;margin-top:8px}.topic-explore svg{width:17px;height:17px}
.topic-dialog{position:fixed;margin:auto;padding:0;width:min(460px,calc(100% - 32px));max-width:none;max-height:min(84vh,760px);max-height:min(84dvh,760px);border:0;border-radius:22px;background:var(--surface);color:var(--text);overflow-y:auto;overscroll-behavior:contain}.topic-dialog::backdrop{background:#06101770}.topic-dialog .topic-panel{border-radius:inherit}.topic-follow>summary:active,.topic-chip:active,.topic-close:active{background:var(--line)}.topic-panel :focus-visible,.topic-follow>summary:focus-visible{outline:2px solid var(--green);outline-offset:3px}
@media(hover:hover) and (pointer:fine){.topic-follow>summary:hover,.topic-chip:hover,.topic-close:hover{background:var(--soft)}}
@media(max-width:760px){.topic-follow{left:max(12px,env(safe-area-inset-left));bottom:calc(88px + env(safe-area-inset-bottom))}.topic-follow-reader{bottom:calc(100px + env(safe-area-inset-bottom))}.topic-dialog{inset:auto 0 0;margin:0;width:100%;max-height:85vh;max-height:85dvh;border-radius:24px 24px 0 0}.topic-dialog .topic-panel{padding:20px 16px calc(20px + env(safe-area-inset-bottom))}.topic-follow>summary{font-size:13px;padding:10px 14px}}
@media(max-width:440px) and (orientation:portrait){.topic-follow-reader{bottom:calc(160px + env(safe-area-inset-bottom))}}

.topic-chips>div,.topic-chips form{min-width:0;max-width:100%}.topic-chip span:last-child{min-width:0;overflow-wrap:anywhere}.topic-explore{flex-wrap:wrap}.topic-dialog-open,.topic-dialog-open body{overflow:hidden}
