/* KOMMUNISTIK (kommunistik-20261106.mjs): the page's last part. On a wide window in the bottom row at the right, on the
   line of the mottos, opening upwards: + and a line fading to the left, KOMMUNISTIK and the dash (the mirror of
   CHAPTER 3), and above it SET BY LISTENERS with its lines in a thin box like SOUND MAP's route words (Tilt opens BANDS,
   Brighter is the page's brighter switch). Rainman walks in this row: when he is coming the box turns red with a line
   and the part makes way, and it is back when he has left. Under the player on a narrow window the last part, opening
   downwards as CHAPTER 3. */
.kommunistik{position:fixed;right:clamp(1rem,3vw,2.5rem);bottom:max(1.5rem,env(safe-area-inset-bottom));z-index:1;display:flex;flex-direction:column;align-items:flex-end;width:max-content;min-width:12rem;max-width:18rem;margin:0;font-family:Montserrat,sans-serif;font-weight:300;pointer-events:none;opacity:0;visibility:hidden;transition:opacity 900ms ease,visibility 0s linear 900ms}
.kommunistik[hidden]{display:none}
.kommunistik.is-on{opacity:1;visibility:visible;transition:opacity 900ms ease}
.kommunistik.is-on.is-crowded,.kommunistik.is-on.is-away{opacity:0;visibility:hidden;transition:opacity 400ms ease,visibility 0s linear 400ms}
button.kommunistik-toggle{display:flex;flex-direction:row-reverse;align-items:center;gap:.8rem;width:100%;height:1rem;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:var(--klf-text-secondary);font-family:inherit;font-size:.55rem;font-weight:300;letter-spacing:.22em;text-align:right;cursor:pointer;pointer-events:auto;transition:color 300ms ease}
button.kommunistik-toggle::before{content:"";flex:none;width:.75rem;height:1px;background:#525d6c}
button.kommunistik-toggle:hover{background:transparent;color:var(--klf-text-bright)}
button.kommunistik-toggle:focus-visible{outline:1px solid #778395;outline-offset:3px}
.kommunistik-rule{flex:1;min-width:1.5rem;height:1px;background:linear-gradient(to left,#525d6c,transparent)}
.kommunistik-symbol{flex:none;width:.65rem;font-size:.9rem;font-weight:300;letter-spacing:0;text-align:center}
/* Opening upwards: the panel grows from the heading (rows 0fr to 1fr). */
.kommunistik-panel{display:grid;grid-template-rows:0fr;width:100%;opacity:0;visibility:hidden;transition:grid-template-rows 400ms ease,opacity 400ms ease,visibility 0s linear 400ms}
.kommunistik.is-open .kommunistik-panel{grid-template-rows:1fr;opacity:1;visibility:visible;transition:grid-template-rows 400ms ease,opacity 400ms ease}
.kommunistik-inner{min-height:0;overflow:hidden;display:flex;flex-direction:column;align-items:flex-end;padding-bottom:.45rem}
.kommunistik-group{margin:0 1.55rem 0 0;color:var(--klf-text-secondary);font-size:.5rem;letter-spacing:.15em;line-height:1.9;text-transform:uppercase;text-align:right}
.kommunistik-box{width:max-content;margin:.4rem 1.55rem 0 0;padding:.45rem .6rem;border:1px solid #3a4250;transition:border-color 400ms ease}
.kommunistik-list{display:grid;grid-template-columns:auto auto;justify-content:start;column-gap:.9em;margin:0;padding:0;font-size:.55rem;letter-spacing:.06em;line-height:1.9}
.kommunistik-row{display:contents}
.kommunistik-row[hidden]{display:none}
.kommunistik-list dt{margin:0;color:var(--klf-text-faint);white-space:nowrap}
.kommunistik-list dd{margin:0;color:var(--klf-text-body);white-space:nowrap;font-variant-numeric:tabular-nums}
button.kommunistik-tilt,button.kommunistik-bright{display:inline;width:auto;height:auto;margin:0;padding:0;border:0;border-radius:0;background:transparent;font:inherit;letter-spacing:inherit;line-height:inherit;color:inherit;cursor:pointer;pointer-events:auto;text-decoration:underline;text-decoration-color:#3a4250;text-underline-offset:.2em;transition:color 200ms ease,text-decoration-color 200ms ease}
button.kommunistik-tilt:hover,button.kommunistik-bright:hover{background:transparent;color:var(--klf-text-bright);text-decoration-color:#6c7787}
button.kommunistik-tilt:focus-visible,button.kommunistik-bright:focus-visible{outline:1px solid #778395;outline-offset:3px}
/* Rainman: the box red and his line on it (He's on the move. Talk soon.), and on his way out The King has left the
   building. */
.kommunistik-say{display:none;margin:0 0 .2rem;font-size:.55rem;font-style:italic;letter-spacing:.03em;line-height:1.9;white-space:nowrap;color:var(--klf-text-bright)}
.kommunistik.is-saying .kommunistik-say{display:block}
.kommunistik.is-warned .kommunistik-box{border-color:#b65562}
.kommunistik.is-warned .kommunistik-say{color:#cf7f89}
@media(max-width:899px),(max-height:500px){.kommunistik{display:none}
.more .kommunistik:not([hidden]){display:flex}
.more .kommunistik{position:relative;right:auto;bottom:auto;z-index:auto;flex-direction:column-reverse;align-items:stretch;width:auto}
.more button.kommunistik-toggle{flex-direction:row;text-align:left}
.more .kommunistik-rule{background:linear-gradient(to right,#525d6c,transparent)}
.more .kommunistik-inner{align-items:flex-start;padding:.45rem 0 0}
.more .kommunistik-group{margin:0 0 0 1.55rem;text-align:left}
.more .kommunistik-box{margin:.4rem 0 0 1.55rem}
.more .kommunistik:not(.is-open) .kommunistik-panel{display:none}}
@media(prefers-reduced-motion:reduce){.kommunistik,.kommunistik.is-on,.kommunistik-panel,.kommunistik-box,button.kommunistik-toggle{transition:none!important}}
