aside article { border-radius:0; }

aside /* le chaaaaaannnn */
{	flex-basis:var(--chan);
	max-width:35em;
	height:97vh; /* POURQUOI ? Hack android ? */
	max-height:97vh;
	/*max-height:fill-available;*/
	flex-grow:0;
	/*min-width:25em;*/
	display:flex; flex-direction:column;
	z-index:20;
	font-size:inherit;
	padding-top:0vh;	
	/* background-color:var(--back-down); doublé */
}


aside>div /* chans */
{	flex-grow:1; flex-shrink:1;
	flex-basis:0;
	display:flex;
	flex-direction:column;
	overflow:hidden;
	position:relative;	
	padding-top:1em; /* voi label */
}

aside>div>div /* 1 chan */
{	flex-grow:1;
	flex-shrink:1;
	flex-basis:100%;
	overflow:hidden;
	overflow-y:scroll;
	scrollbar-width: none; /* pas de scrollbar mais on peut */
	transition:flex-grow,flex-basis .2s ease;
	border-top:1px solid var(--here);
	margin-top:1em;
}

aside>div>div.off { flex-basis:2rem; }
aside>div>div.on { flex-basis:100%;; }
aside>div>div.off>label { color:var(--inline); }


aside>div>div>label /* masquage dégradé */
{	flex-grow:0; margin:0; padding:.1em 0 0 0;
	box-sizing:border-box;
	height:2rem;
	text-align:center;	
	position:sticky; top:0;
	z-index:400;
	display:block;
	width:100%;
	background:linear-gradient(var(--back),transparent);
}




aside>div>div>code /* une ligne */
{	display:block;
	margin:0; padding:.15em 0 .15em 0;
	/*border-bottom:1px solid grey;*/
	font-family:inherit;
	font-size:90%;
	font-weight:300;
	word-break: break-all;
}

aside>div>div>code>em
{	vertical-align:middle; font-style:normal;
	font-size:85% ; /* là ça fait 85% x 85% on va se calmer */
	/*color:cyan;*/
	margin-right:0.5em;	
}

aside>div>div>code>em>i { color:#FF0; } /* info bot */
aside>div>div>code>em>u { opacity:1; color:var(--here); /* vip */ }
aside>div>div>code>em>s { opacity:.55; color:white; /* rien */ } 

aside>div>div>code.bot /* Notre Angie */
{	background-color:var(--line);
}

/* post */

aside>form
{	flex-grow:0;
	margin-top:.5em;
	display:flex;
	flex-basis:2em; flex-grow:0; 	
}

aside>form>input { box-sizing:border-box; width:100%; }

aside>form>a { flex-basis:3em; width:100%; text-align:center; }

/* pop up latéral */

aside>header
{ 	max-height:0em; transition:max-height .2s ease; overflow:hidden;
	scrollbar-color: var(--here) transparent;
}

aside>header.visible { max-height:100%; overflow-y:scroll; /* surtout, pour tuto */ }

aside>header>label { flex-grow:0; margin:.2em; text-align:center; }

aside>header>article { margin:0; }

aside>header>article>div { flex-basis:100%; }

aside>aside textarea  { height:60vh; /* ça c'est le bloc-note ! */ }