@charset "UTF-8";

/* Header notification disclosure. Kept after legacy controller/palette CSS so
   the component owns its geometry independent of the former canvas feedback. */
body.logged-out #notification_menu,
body.logged-out #history_menu,
body.header-presentation-corner #notification_menu,
body.header-presentation-corner #history_menu,
body.viewport-notifications-hidden #notification_menu,
body.viewport-notifications-hidden #history_menu
	{ display:none !important; }

#notification_menu[hidden],
#history_menu[hidden]
	{ display:none !important; }

body.logged-in #notification_menu
	{ z-index:500; }

body.logged-in #history_menu
	{
		display:flex;
		position:absolute;
		right:172px;
		top:4px;
		z-index:500;
		align-items:flex-start;
		gap:5px;
	}

#header_history,
#header_auto_zoom
	{
		box-sizing:border-box;
		height:29px;
		min-width:68px;
		padding:0 6px;
		border:1px solid var(--color-border-strong);
		border-radius:6px;
		background:var(--color-control);
		color:var(--color-control-text);
		font-weight:700;
		cursor:pointer;
	}

#header_auto_zoom
	{
		min-width:108px;
	}

#header_auto_zoom[data-state="off"]
	{
		border-color:var(--color-border);
		background:var(--color-control-disabled);
		color:var(--color-control-disabled-text);
	}

#timeline_history_surface.history_popover
	{
		position:absolute;
		top:33px;
		right:0;
		z-index:501;
		box-sizing:border-box;
		width:min(360px, calc(100vw - 16px));
		max-height:min(70vh, 420px);
		padding:8px;
		border:1px solid var(--color-border-strong);
		background:var(--color-surface-solid);
		box-shadow:0 4px 12px var(--color-selection-shadow);
		color:var(--color-text);
		overflow:auto;
	}

#timeline_history_surface[hidden]
	{ display:none; }

body.logged-in #action_feedback.notification_popover
	{
		position:absolute;
		left:auto;
		right:0;
		top:33px;
		z-index:501;
		box-sizing:border-box;
		width:min(308px, calc(100vw - 16px));
		height:auto;
		margin:0;
		padding:10px 12px;
		transform:none;
		overflow-wrap:anywhere;
		visibility:visible;
		opacity:1;
	}

body.logged-in #action_feedback.notification_popover[hidden]
	{ display:none; }

body.logged-in #action_feedback.notification_popover #completion_summary
	{
		display:block;
		min-width:0;
		margin:0 0 5px;
		overflow:visible;
		color:var(--feedback-text);
		font-weight:bold;
		line-height:1.25;
		text-overflow:clip;
		white-space:normal;
	}

body.logged-in #action_feedback.notification_popover #action_feedback_explanation
	{
		position:static;
		box-sizing:border-box;
		margin:0;
		padding:5px 0 0;
		border:0;
		border-top:1px solid var(--feedback-prominent-border);
		border-radius:0;
		background:transparent;
		box-shadow:none;
		color:var(--feedback-text);
		font:inherit;
	}

body.logged-in #action_feedback.notification_popover.feedback-error
	{
		border-color:var(--feedback-error-border);
		border-left-color:var(--feedback-error-accent);
		background:var(--feedback-error-surface);
		color:var(--feedback-error-text);
	}

body.logged-in #action_feedback.notification_popover.feedback-error #completion_summary,
body.logged-in #action_feedback.notification_popover.feedback-error #action_feedback_explanation
	{ color:var(--feedback-error-text); }

body.logged-in #action_feedback.notification_popover.feedback-error #action_feedback_explanation
	{ border-top-color:var(--feedback-error-border); }