.manisha-flashcards{max-width:none;width:100%;border:1px solid #e1e1e1;padding:16px;border-radius:8px;font-family:Arial,Helvetica,sans-serif}
.manisha-flashcards.floating{position:fixed;top:50%;left:50%;transform:translate(-50%, -50%);z-index:9999;width:300px;min-width:0px;min-height:0px;max-width:none;border:1px solid #e1e1e1;padding:1em;border-radius:0.5em;font-family:Arial,Helvetica,sans-serif;font-size:16px;background:#fff;box-shadow:0 4px 8px rgba(0,0,0,0.3);cursor:move;display:flex;flex-direction:column}
.manisha-card{perspective:1000px;position:relative;flex:1}
.manisha-card .front,.manisha-card .back{width:100%;height:100%;backface-visibility:hidden;display:flex;align-items:center;justify-content:center;padding:0.75em;box-sizing:border-box;border-radius:0.375em;background:#e8f5e8;border:1px solid #ddd;position:absolute;top:0;left:0;line-height:1.2}
.manisha-card .back{transform:rotateY(180deg);background:#f9f9f9}
.manisha-card.is-flipped .front{transform:rotateY(180deg)}
.manisha-card.is-flipped .back{transform:rotateY(360deg)}
.manisa-timer{margin:8px 0;text-align:center;font-size:24px;font-weight:bold;color:#fff;background:#007cba;border-radius:50%;width:60px;height:60px;display:flex;align-items:center;justify-content:center;margin:0.5em auto;border:0.1875em solid #005a87;box-shadow:0 2px 4px rgba(0,0,0,0.2)}
.manisa-timer-small{
	position:absolute;
	font-weight:bold;
	color:#000;
	background:#fff;
	border-radius:0 0.375rem 0.375rem 0;
	padding:0.25rem 0.5rem;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	border:1px solid rgba(0,0,0,0.08);
	box-shadow:0 2px 4px rgba(0,0,0,0.08);
	z-index:10;
}

/* Make the top and left edges visually match the flashcards container by overlaying
   strips that use the container background color (so the timer looks attached). */
.manisha-flashcards.floating{--manisha-fc-bg: #fff}
.manisa-timer-small::before,
.manisa-timer-small::after{
	content:'';
	position:absolute;
	background:var(--manisha-fc-bg);
	z-index:9;
}
.manisa-timer-small::before{
	/* top strip */
	top:-0.25rem;
	left:0;
	right:0;
	height:0.25rem;
	border-top-left-radius:inherit;
}
.manisa-timer-small::after{
	/* left strip */
	top:0;
	left:-0.25rem;
	width:0.25rem;
	bottom:0;
	border-top-left-radius:inherit;
}
.manisha-controls{margin-top:0.75em;display:flex;gap:0.5em}
.manisha-controls button{padding:0.25em 0.375em;border-radius:0.25em;border:1px solid #bbb;background:#fff;cursor:pointer}
.manisha-hide{background:#f00;color:#fff;border-color:#f00}
.resize-handle{position:absolute;bottom:0;right:0;width:1.25em;height:1.25em;cursor:nw-resize;background:linear-gradient(-45deg, transparent 0%, transparent 40%, #ccc 40%, #ccc 60%, transparent 60%, transparent 100%)}
.eye-button{position:fixed;bottom:1rem;right:1rem;z-index:10000;width:2.5rem;height:2.5rem;background:#007cba;color:#fff;border:none;cursor:pointer;font-size:3.6rem;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px rgba(0,0,0,0.3);padding:0;overflow:visible;border-radius:0.15rem}
.eye-button img{
    margin: auto !important;
	display:block !important;
	width:1.6rem !important;
	height:1.6rem !important;
	max-width:100%;
	max-height:100%;
	object-fit:contain;
	margin:auto;
	transform:translateY(0);
}