/* ASC Login — slide-down panel
   Palette: cream #FCFBF7 · charcoal #232624 · text #2B2B2B
            line #E4E1D8 · green #3E5E4E · tint #E3EAE2 · alert #C06B4E */

.ascl-panel *{box-sizing:border-box}

/* --- menu toggle (icon only) --- */
.ascl-item{display:flex;align-items:center}
.ascl-toggle{
	display:inline-flex;align-items:center;justify-content:center;
	background:none;border:0;cursor:pointer;line-height:1;color:#2B2B2B;
	padding:.45rem .55rem;border-radius:9px;transition:color .2s ease,background .2s ease;
}
.ascl-toggle:hover,
.ascl-toggle[aria-expanded="true"]{color:#3E5E4E;background:#E3EAE2}
.ascl-toggle svg{display:block}
.ascl-toggle__text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* --- panel --- */
.ascl-panel{
	position:fixed;z-index:99999;
	width:min(460px,calc(100vw - 24px));
	background:#fff;color:#2B2B2B;
	border:1px solid #E4E1D8;border-top:0;border-radius:0 0 4px 4px;
	box-shadow:none;
	padding:.9rem;
	font-family:'Atkinson Hyperlegible',system-ui,-apple-system,sans-serif;
	opacity:0;transform:translateY(-10px);visibility:hidden;pointer-events:none;
	transition:opacity .2s ease,transform .2s ease,visibility .2s ease;
}
.ascl-panel.is-open{opacity:1;transform:translateY(0);visibility:visible;pointer-events:auto}

/* --- views --- */
.ascl-view{display:none}
.ascl-view.is-active{display:block}

/* --- the side-by-side row --- */
.ascl-row{display:flex;align-items:stretch;gap:.4rem}
.ascl-row input{
	flex:1 1 0;min-width:0;font:inherit;font-size:.92rem;
	padding:.55rem .7rem;border:1px solid #E4E1D8;border-radius:9px;
	background:#fff;color:#2B2B2B;transition:border-color .2s ease,box-shadow .2s ease;
}
.ascl-row input::placeholder{color:#9a9d97}
.ascl-row input:focus{outline:0;border-color:#3E5E4E;box-shadow:0 0 0 3px #E3EAE2}
.ascl-code{flex:0 0 5.2em;text-align:center;letter-spacing:.18em}

/* --- icon buttons --- */
.ascl-icon-btn{
	flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
	width:2.5rem;border:1px solid #E4E1D8;border-radius:9px;background:#fff;color:#3E5E4E;
	cursor:pointer;text-decoration:none;transition:background .2s ease,color .2s ease,border-color .2s ease,transform .05s ease;
}
.ascl-icon-btn:hover{background:#E3EAE2;border-color:#cfe0d0}
.ascl-icon-btn:active{transform:translateY(1px)}
.ascl-icon-btn--go{background:#3E5E4E;border-color:#3E5E4E;color:#FCFBF7}
.ascl-icon-btn--go:hover{background:#33503f;border-color:#33503f;color:#FCFBF7}
.ascl-icon-btn svg{display:block}
/* force icon colour so the theme's button rules can't blank it out */
.ascl-icon-btn svg,.ascl-icon-btn svg *{stroke:#3E5E4E}
.ascl-icon-btn--go svg,.ascl-icon-btn--go svg *{stroke:#FCFBF7}

/* --- meta row (remember / links) --- */
.ascl-meta{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-top:.55rem}
.ascl-meta--single{justify-content:flex-end}
.ascl-remember{display:inline-flex;align-items:center;gap:.4rem;font-size:.82rem;color:#2B2B2B;cursor:pointer;margin:0}
.ascl-remember input{width:.95rem;height:.95rem;accent-color:#3E5E4E;margin:0}
.ascl-textlink{background:none;border:0;padding:0;cursor:pointer;font:inherit;font-size:.82rem;color:#3E5E4E;text-decoration:none}
.ascl-textlink:hover{text-decoration:underline}

/* --- reset lead text --- */
.ascl-lead{margin:0 0 .55rem;font-size:.85rem;line-height:1.35;color:#54574f}

/* --- status / error message --- */
.ascl-msg{margin:0 0 .6rem;font-size:.85rem;line-height:1.35;padding:.5rem .65rem;border-radius:8px;background:#E3EAE2;color:#2f4a3c}
.ascl-msg.is-error{background:#f7e6e0;color:#8f3f28}

/* --- logged-in account row --- */
.ascl-account{display:flex;align-items:center;justify-content:space-between;gap:.9rem;padding:.15rem .2rem}
.ascl-account__name{font-size:.95rem;font-weight:700;color:#232624;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ascl-account .ascl-icon-btn{width:2.3rem;height:2.3rem}

/* --- logged-in account pills --- */
.ascl-link-pill{transition:background .2s ease,border-color .2s ease}
.ascl-link-pill:hover{background:#d3e2d4;border-color:#bcd4be}

/* --- narrow screens: stack the row --- */
@media (max-width:420px){
	.ascl-row{flex-wrap:wrap}
	.ascl-row input{flex:1 1 100%}
	.ascl-code{flex:1 1 100%;text-align:left;letter-spacing:.12em}
	.ascl-icon-btn--go{width:100%;height:2.5rem}
}
@media (prefers-reduced-motion:reduce){.ascl-panel{transition:opacity .1s linear}}