/* Minification failed. Returning unminified contents.
(53,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(54,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(55,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(56,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(57,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(58,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(59,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(62,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(63,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(66,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(67,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(68,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(69,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(70,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(71,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(72,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(73,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(76,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(77,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(78,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(79,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(80,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(81,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(82,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(83,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(86,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(87,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(88,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(89,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(90,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(91,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(94,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(95,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(96,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(97,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(98,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(99,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(100,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(101,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(102,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(103,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(104,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(107,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(108,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(109,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(110,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(111,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(112,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(113,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(114,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(121,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(122,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(123,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(124,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(125,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(126,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(127,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(130,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(131,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(132,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(133,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(134,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(135,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(136,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(139,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(140,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(141,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(142,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(145,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(146,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(147,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(148,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(149,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(150,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(151,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(152,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(155,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(156,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(157,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(158,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(159,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(166,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(167,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(170,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(171,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(172,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(173,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(174,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(177,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(177,28): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(178,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(178,28): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(179,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(179,28): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(180,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(180,28): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(181,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(181,28): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(182,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(182,28): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(183,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(183,28): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(184,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(184,28): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(185,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(186,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(187,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(188,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(189,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(189,28): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(190,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(191,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(194,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(195,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(196,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(197,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(204,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(205,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(206,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(207,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(208,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(209,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(210,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(211,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(212,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(213,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(214,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(215,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(216,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(219,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(220,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(221,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(222,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(223,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(224,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(225,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(228,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(229,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(230,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(231,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(232,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(234,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(235,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(238,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(239,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(240,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(241,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(242,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(243,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(246,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(247,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(248,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(265,21): run-time error CSS1039: Token not allowed after unary operator: '-font-sans'
(266,19): run-time error CSS1039: Token not allowed after unary operator: '-fs-body'
(267,21): run-time error CSS1039: Token not allowed after unary operator: '-lh-body'
(268,21): run-time error CSS1039: Token not allowed after unary operator: '-fw-regular'
(269,15): run-time error CSS1039: Token not allowed after unary operator: '-text-body'
(270,20): run-time error CSS1039: Token not allowed after unary operator: '-surface-canvas'
(277,15): run-time error CSS1039: Token not allowed after unary operator: '-text-strong'
(278,21): run-time error CSS1039: Token not allowed after unary operator: '-fw-bold'
(279,24): run-time error CSS1039: Token not allowed after unary operator: '-tracking-heading'
(289,15): run-time error CSS1039: Token not allowed after unary operator: '-text-link'
(300,15): run-time error CSS1039: Token not allowed after unary operator: '-text-on-dark'
(315,20): run-time error CSS1039: Token not allowed after unary operator: '-shadow-focus'
(316,23): run-time error CSS1039: Token not allowed after unary operator: '-radius-sm'
(321,20): run-time error CSS1039: Token not allowed after unary operator: '-aq-gradient'
(328,19): run-time error CSS1039: Token not allowed after unary operator: '-fs-micro'
(329,21): run-time error CSS1039: Token not allowed after unary operator: '-fw-semibold'
(330,24): run-time error CSS1039: Token not allowed after unary operator: '-tracking-overline'
(332,15): run-time error CSS1039: Token not allowed after unary operator: '-text-muted'
(355,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(356,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(357,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(358,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(359,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(360,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(361,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(363,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(366,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(367,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(368,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(369,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(370,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(371,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(372,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(375,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(376,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(377,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(378,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(379,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(380,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(381,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(384,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(385,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(386,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(387,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(388,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(389,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(392,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(393,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(394,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(395,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(396,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(397,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(398,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(399,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(400,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(401,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(402,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(405,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(406,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(407,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(408,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(409,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(410,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(413,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(414,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(415,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(416,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(417,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(418,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(421,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(422,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(423,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(424,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(427,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(428,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(429,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(430,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(431,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(434,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(435,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(436,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(439,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(440,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(441,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(444,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(445,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(446,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(447,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(450,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(451,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(454,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(455,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(456,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(457,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(458,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(459,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(460,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(461,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(462,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(463,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(466,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(467,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(468,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(469,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(470,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(471,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(474,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(475,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(476,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(477,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(478,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(479,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(480,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(481,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(484,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(485,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(486,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(487,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(488,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(489,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(492,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(493,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(494,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(495,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(496,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(499,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(500,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(508,21): run-time error CSS1039: Token not allowed after unary operator: '-arq-font'
(511,21): run-time error CSS1039: Token not allowed after unary operator: '-arq-fw-regular'
(512,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(513,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(517,44): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(517,81): run-time error CSS1039: Token not allowed after unary operator: '-arq-fw-bold'
(524,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-focus'
(524,83): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(527,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(531,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-fw-semibold'
(532,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(555,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-sidebar-w'
(555,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-bg'
(555,86): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-chrome'
(556,54): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-item'
(556,81): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark'
(560,134): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-surface'
(565,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(566,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(566,44): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-accent-text'
(566,73): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(572,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(573,60): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-item'
(573,87): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(575,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(575,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(575,74): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(575,94): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(577,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-hover-bg'
(577,103): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-item-hover'
(578,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-item-hover'
(581,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(584,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(585,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(587,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-line'
(588,139): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-accent-deep-text'
(588,192): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(589,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(593,16): run-time error CSS1039: Token not allowed after unary operator: '-arq-topbar-h'
(593,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(594,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(597,34): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-300'
(598,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(599,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(601,111): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(601,174): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(602,117): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(603,144): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(603,198): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(604,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(608,44): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(608,96): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(610,71): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(617,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(618,152): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(619,48): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(620,80): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(621,54): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(623,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(624,39): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(627,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(627,85): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(628,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(630,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(636,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(636,60): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-pill'
(636,96): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(637,52): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(639,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(641,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(642,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(643,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-300'
(669,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-300'
(671,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-200'
(672,103): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-300'
(676,29): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(676,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(676,106): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(676,140): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(677,79): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(677,112): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(680,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(681,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(683,39): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(683,71): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(683,107): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-xs'
(686,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(686,88): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(687,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(689,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(689,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(689,81): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(689,101): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(689,129): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(689,149): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(691,39): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(691,73): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-300'
(693,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(694,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-focus'
(694,54): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(696,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(696,80): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-strip'
(698,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(699,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(699,48): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(702,49): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(705,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-bg'
(705,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(705,76): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-item'
(705,139): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(708,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(712,117): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(715,93): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(716,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(716,57): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(717,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(717,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(717,81): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(717,101): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(719,39): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(720,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(720,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-select-ring'
(722,62): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(722,96): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(723,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(723,120): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(726,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(727,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(728,124): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(728,159): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(729,117): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(730,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(738,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(738,90): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-300'
(739,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(740,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(740,64): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-700'
(740,99): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-200'
(741,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(742,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(742,65): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-700'
(742,101): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-200'
(743,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-600'
(744,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(744,90): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-300'
(745,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(746,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(746,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(746,98): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(747,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(748,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(748,64): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(748,99): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-200'
(749,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-500'
(750,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(750,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-600'
(750,93): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(751,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-500'
(754,140): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(754,167): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(754,202): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(755,148): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(757,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(760,81): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(761,171): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(761,209): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(762,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(762,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(767,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(767,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(768,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(772,74): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(773,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-200'
(775,141): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(780,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(782,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(787,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(787,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(787,97): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(789,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(789,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(789,81): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(789,101): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(791,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-300'
(792,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-strip'
(792,87): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(796,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(797,125): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(798,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(799,62): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(800,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(803,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-xl'
(803,102): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-panel-bg'
(803,128): run-time error CSS1039: Token not allowed after unary operator: '-arq-ai-panel'
(803,157): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark'
(803,194): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-md'
(807,92): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(807,181): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(808,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(810,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(814,95): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(817,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(819,176): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(821,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(825,139): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(826,54): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(829,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(833,97): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(834,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(837,140): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(837,289): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(837,309): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(837,337): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(837,357): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(837,384): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(837,404): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(844,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(844,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-accent-text'
(844,90): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(845,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-500'
(846,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(846,60): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(847,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-500'
(854,36): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-bg'
(854,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(854,92): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-item'
(855,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-bg-hover'
(855,73): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(856,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(856,76): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(856,109): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(857,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(858,55): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(859,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(862,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(862,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(869,30): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(869,73): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(869,107): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(869,141): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(869,211): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(869,231): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(870,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-focus'
(870,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-md'
(871,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-strip'
(873,78): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(873,112): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(873,139): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(875,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(876,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(877,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(877,76): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(877,96): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(879,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(880,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-slow'
(880,73): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(885,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(885,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-700'
(886,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(886,67): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-text'
(887,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(887,60): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-700'
(888,34): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(888,58): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-600'
(889,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(889,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(890,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(890,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-700'
(895,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(895,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-700'
(896,49): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(897,36): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(897,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-700'
(898,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(899,36): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(899,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-text'
(900,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(903,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(903,81): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(904,105): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(905,124): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(906,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(910,113): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(911,118): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(911,153): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(911,188): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(920,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(921,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(921,52): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(924,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-300'
(930,65): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(932,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(935,98): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(936,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(938,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(938,95): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-300'
(938,123): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-700'
(943,127): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(944,122): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(945,94): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(945,128): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(946,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(947,62): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(947,96): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(958,48): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(961,54): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(972,65): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(974,70): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(974,111): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(975,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(975,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(977,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(978,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-focus'
(985,62): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(988,57): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(988,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(989,48): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(990,110): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(990,144): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(990,178): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(991,73): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(993,166): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(993,222): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(994,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(995,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(995,117): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(995,149): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(995,190): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(998,92): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1000,81): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(1002,127): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1002,168): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(1002,202): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1003,32): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1003,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1003,87): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-accent-text'
(1003,116): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1004,80): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-300'
(1004,170): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(1004,190): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1005,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1006,159): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-xs'
(1006,203): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(1006,223): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease-out'
(1009,81): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(1009,122): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1009,173): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1009,223): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(1009,243): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1009,271): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(1009,291): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1010,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-300'
(1011,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1011,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-select-ring'
(1012,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(1013,85): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(1014,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1015,122): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1018,67): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1019,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1022,32): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(1022,67): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1022,101): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1023,114): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1024,106): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1026,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1027,86): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1028,108): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1028,142): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(1028,174): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-text'
(1028,256): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-strip'
(1032,123): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-pill'
(1032,165): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1032,196): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1032,263): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(1033,98): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1034,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(1034,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1035,44): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-400'
(1039,114): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1039,199): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1040,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(1040,109): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1041,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1045,71): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-400'
(1045,109): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1045,158): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1046,85): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1046,110): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1046,148): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(1046,225): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(1047,120): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1048,71): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1050,74): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(1051,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1052,108): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1055,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1055,120): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(1055,156): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1055,190): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1058,80): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1058,114): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(1058,157): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-strip'
(1059,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1060,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-text'
(1061,48): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1067,86): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-xl'
(1067,138): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-panel-bg'
(1067,164): run-time error CSS1039: Token not allowed after unary operator: '-arq-ai-panel'
(1067,193): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark'
(1067,230): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-md'
(1073,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(1073,173): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1075,55): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1077,117): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1080,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(1080,111): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-slow'
(1080,131): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1084,114): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1085,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1088,122): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1093,121): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1099,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(1102,171): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1103,44): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1104,115): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1105,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1108,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-danger'
(1109,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(1109,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1113,121): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1113,153): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1120,152): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(1124,70): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1125,32): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1129,184): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1131,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1133,82): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1134,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1137,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1137,113): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1141,44): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(1141,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-700'
(1142,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(1142,78): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1144,55): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1146,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1146,98): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1146,133): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1147,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(1149,119): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1149,153): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(1149,185): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1149,226): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-strip'
(1150,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-bg'
(1150,60): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1150,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-item'
(1154,30): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1154,70): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-xl'
(1154,104): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-xl'
(1155,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1158,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1159,101): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1160,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1161,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(1162,120): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(1162,161): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1163,118): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1164,49): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1168,100): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1168,134): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-900'
(1168,182): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-lg'
(1168,263): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(1168,283): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease-out'
(1169,32): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1172,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(1172,75): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1172,96): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(1172,162): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(1179,126): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-pill'
(1179,162): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-900'
(1179,276): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-lg'
(1180,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1181,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-900'
(1181,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(1181,118): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-xl'
(1183,101): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1186,151): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(1188,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1188,65): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1189,54): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-200'
(1190,39): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1195,155): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-pill'
(1195,240): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1196,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1197,184): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(1197,209): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-600'
(1198,34): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(1198,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1199,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1199,70): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1200,30): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(1201,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(1201,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1202,30): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1203,62): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1210,169): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1210,216): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(1210,273): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(1211,82): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1217,55): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1218,27): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1218,70): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1218,104): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(1218,138): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(1219,113): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1221,80): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(1221,107): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(1224,29): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1225,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1226,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1227,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1236,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-slow'
(1236,60): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1240,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(1248,71): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(1253,94): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-line'
(1254,55): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1256,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1257,56): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1262,48): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1265,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1266,169): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1267,109): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-surface'
(1268,85): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-item'
(1268,112): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1268,195): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(1269,39): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-hover-bg'
(1269,102): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-item-hover'
(1270,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-line'
(1271,44): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(1271,64): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1273,71): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-item-hover'
(1274,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-line'
(1274,146): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-item'
(1274,173): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1277,118): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1278,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1279,55): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1279,90): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1279,133): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1281,145): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(1281,170): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1281,304): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1284,119): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-pill'
(1285,36): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(1285,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-700'
(1286,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1287,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1287,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-600'
(1287,97): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1296,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1297,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1297,127): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1297,161): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(1297,195): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(1298,127): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1298,175): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-bg'
(1298,200): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1298,231): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-item'
(1299,118): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1300,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-400'
(1305,58): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-xl'
(1305,110): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-panel-bg'
(1305,136): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1305,172): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-md'
(1308,100): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(1308,189): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1310,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1312,120): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1317,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1317,74): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1317,108): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(1317,142): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(1318,117): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1321,115): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1321,200): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1322,67): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1324,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1325,141): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1326,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-700'
(1331,32): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(1331,86): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(1332,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1336,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-panel-bg'
(1336,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1338,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-900'
(1339,79): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1340,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1340,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1341,75): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1342,36): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(1342,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1343,76): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1355,22): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-chrome-deep'
(1361,62): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-chrome-deep'
(1367,190): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(1390,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1391,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1392,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1393,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-lg'
(1394,21): run-time error CSS1039: Token not allowed after unary operator: '-arq-font'
(1396,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1405,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1406,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1417,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1433,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(1438,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(1442,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1443,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-brand'
(1446,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1447,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1447,96): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1452,74): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1458,22): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1476,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(1476,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1495,29): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1538,22): run-time error CSS1039: Token not allowed after unary operator: '-arq-danger'
(1544,32): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1560,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-focus'
(1585,22): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1586,28): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1587,25): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(1588,22): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-lg'
(1595,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1598,52): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1601,17): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1613,17): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1618,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1632,36): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(1632,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1718,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1718,80): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1719,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-200'
(1724,22): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(1726,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1729,129): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1729,160): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1729,230): run-time error CSS1039: Token not allowed after unary operator: '-arq-text'
(1730,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1730,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1732,56): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1732,106): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1733,111): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1733,154): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1733,188): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-xl'
(1734,187): run-time error CSS1039: Token not allowed after unary operator: '-arq-text'
(1735,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-50'
(1735,104): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1736,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1737,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1737,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1742,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1759,203): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1759,246): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1759,272): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1759,307): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(1760,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1760,88): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1766,134): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1766,186): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1766,250): run-time error CSS1039: Token not allowed after unary operator: '-arq-text'
(1767,39): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1767,74): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-50'
(1770,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1771,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1773,54): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1807,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1808,22): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1808,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1809,39): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1809,77): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(1810,52): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1810,90): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1812,95): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1813,22): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1814,28): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-200'
(1818,28): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(1819,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(1822,30): run-time error CSS1039: Token not allowed after unary operator: '-arq-danger'
(1823,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-danger'
(1833,176): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1833,217): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-xl'
(1833,257): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1833,295): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1833,339): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-lg'
(1834,54): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1835,57): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1879,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(1897,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1898,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1899,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-xl'
(1900,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(1910,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1915,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1921,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1926,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(1937,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1938,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1939,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1945,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(1945,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1947,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-500'
(1950,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1951,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(1952,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(1954,49): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1968,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1970,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1978,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1981,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(1983,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1998,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1999,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(2000,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(2001,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(2005,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(2005,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2006,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(2006,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2007,30): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(2007,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2010,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-md'
(2011,22): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-300'
(2024,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(2028,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(2029,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(2033,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(2033,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(2034,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2034,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(2035,60): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(2035,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(2036,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(2036,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-700'
(2037,62): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2037,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(2038,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(2038,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-700'
(2045,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(2051,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2058,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(2059,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(2060,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(2061,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(2069,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(2074,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(2078,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(2082,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(2083,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2084,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(2085,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-pill'
(2097,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(2101,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2101,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2103,52): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(2104,36): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2109,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(2113,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2114,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(2121,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(2128,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2134,52): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-300'
(2142,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2143,29): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2193,18): run-time error CSS1030: Expected identifier, found '>'
(2193,40): run-time error CSS1031: Expected selector, found ')'
(2193,40): run-time error CSS1025: Expected comma or open brace, found ')'
(2227,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(2234,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-slow'
(2234,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2261,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(2262,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(2263,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(2266,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2267,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2275,22): run-time error CSS1039: Token not allowed after unary operator: '-p-ok'
(2276,20): run-time error CSS1039: Token not allowed after unary operator: '-p-ok'
(2276,32): run-time error CSS1039: Token not allowed after unary operator: '-p-near'
(2277,20): run-time error CSS1039: Token not allowed after unary operator: '-p-near'
(2285,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(2300,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(2308,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2317,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(2326,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(2331,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(2331,78): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(2337,56): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(2337,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(2338,56): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(2338,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-700'
(2339,56): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(2339,88): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(2340,56): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(2340,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-600'
(2351,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(2352,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(2353,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(2354,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-xs'
(2360,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(2368,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2383,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(2384,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(2385,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(2386,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(2389,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2389,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2390,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2390,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2392,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-400'
(2392,75): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(2397,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(2401,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2402,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(2407,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2414,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2416,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-300'
(2428,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2428,64): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(2428,86): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2430,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2435,62): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(2436,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2436,64): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(2436,86): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2438,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2493,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(2494,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(2495,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-xl'
(2496,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-md'
(2504,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(2512,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(2522,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(2524,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2526,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2526,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2526,74): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2526,94): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2528,36): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2528,60): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(2535,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(2543,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2549,29): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(2550,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(2550,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(2563,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(2567,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(2568,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2568,83): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2569,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2570,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2576,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(2584,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2590,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-300'
(2599,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(2600,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(2601,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(2602,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2605,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2605,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2606,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2606,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2607,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2607,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2609,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-300'
(2609,73): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(2609,100): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(2627,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2634,30): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(2640,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(2641,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(2642,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(2643,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(2647,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2647,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2649,49): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2651,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2665,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-300'
(2665,87): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-50'
(2665,125): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(2670,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2671,79): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(2676,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(2677,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(2678,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(2679,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(2684,56): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-400'
(2692,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(2694,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(2699,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2700,39): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-300'
(2700,83): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-50'
(2700,121): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(2701,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2702,64): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2706,32): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-bg'
(2706,57): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-chrome'
(2706,101): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-item'
(2706,149): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-bg'
(2706,174): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-chrome'
(2707,54): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-bg-hover'
(2707,85): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(2718,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(2719,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-bg'
(2719,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-chrome'
(2720,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-brand-menu-item'
(2723,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-md'
(2725,28): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2725,48): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2725,75): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2725,95): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2735,83): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
 */
/* Arqueum — Webfonts. DM Sans (the brand typeface), used for everything. */

@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/Content/modern/ds/assets/fonts/DMSans-Regular.ttf) format("truetype");
}
@font-face {
  font-family: "DM Sans";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/Content/modern/ds/assets/fonts/DMSans-Italic.ttf) format("truetype");
}
@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/Content/modern/ds/assets/fonts/DMSans-Medium.ttf) format("truetype");
}
@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/Content/modern/ds/assets/fonts/DMSans-SemiBold.ttf) format("truetype");
}
@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/Content/modern/ds/assets/fonts/DMSans-Bold.ttf) format("truetype");
}
@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/Content/modern/ds/assets/fonts/DMSans-ExtraBold.ttf) format("truetype");
}

/* Arqueum — Color tokens.
   Brand rule of thumb (WCAG): teal / green / lime are FILLS & ACCENTS, never body
   text on light. Text/icons on light, teal or green must be petrol or deepest.
   White text only on petrol/deepest. Links on light → petrol. No blue. */

:root {
  /* ---- Brand primitives ---- */
  --aq-teal: #1AC6B1;       /* primary brand */
  --aq-green: #49D16B;      /* secondary brand */
  --aq-petrol: #093F49;     /* app chrome + text-on-light */
  --aq-deepest: #052628;    /* near-black text / darkest surface */
  --aq-neutral: #C5D0CD;    /* borders, dividers, muted surface */
  --aq-white: #FFFFFF;      /* base */
  --aq-lime: #64FF00;       /* energy accent ONLY — focus glow, never text */

  /* Signature gradient (teal → green). Use sparingly: hero, key CTAs, brand marks. */
  --aq-gradient: linear-gradient(90deg, #1AC6B1 0%, #49D16B 100%); /* @kind color */
  --aq-gradient-135: linear-gradient(135deg, #1AC6B1 0%, #49D16B 100%); /* @kind color */

  /* ---- Teal tints/shades (derived; teal is the hero hue) ---- */
  --aq-teal-50:  #E9FBF8;
  --aq-teal-100: #C7F4ED;
  --aq-teal-200: #93E9DC;
  --aq-teal-300: #54D9C7;
  --aq-teal-400: #1AC6B1;   /* = brand teal */
  --aq-teal-500: #14A595;
  --aq-teal-600: #0F8478;
  --aq-teal-700: #0B655C;

  /* ---- Green tints/shades ---- */
  --aq-green-50:  #ECFBEF;
  --aq-green-100: #CFF4D6;
  --aq-green-200: #A1E9B0;
  --aq-green-300: #6FDC87;
  --aq-green-400: #49D16B;  /* = brand green */
  --aq-green-500: #34AE53;
  --aq-green-600: #268A41;
  --aq-green-700: #1B6831;

  /* ---- Petrol family (chrome + ink) ---- */
  --aq-petrol-900: #052628; /* = deepest */
  --aq-petrol-800: #073239;
  --aq-petrol-700: #093F49; /* = petrol */
  --aq-petrol-600: #0E5460;
  --aq-petrol-500: #166B79;
  --aq-petrol-400: #2E8896;

  /* ---- Neutral / slate ramp (cool, slightly green-grey to match brand) ---- */
  --aq-n-0:   #FFFFFF;
  --aq-n-25:  #F7FAF9;      /* app canvas */
  --aq-n-50:  #EEF3F2;      /* muted surface / hover row */
  --aq-n-100: #E2EAE8;      /* subtle border */
  --aq-n-200: #C5D0CD;      /* = brand neutral, default border */
  --aq-n-300: #A7B5B2;      /* strong border / disabled fill */
  --aq-n-400: #859390;      /* placeholder */
  --aq-n-500: #6B7A77;      /* muted text on light */
  --aq-n-600: #4E5C59;      /* secondary text */
  --aq-n-700: #33403D;
  --aq-n-800: #1C2826;

  /* ---- Semantic status (kept in-family; uses brand green for success) ---- */
  --aq-success: #34AE53;
  --aq-success-bg: #ECFBEF;
  --aq-warning: #C9821A;
  --aq-warning-bg: #FBF1E2;
  --aq-danger: #C5453B;
  --aq-danger-bg: #FBECEA;
  --aq-info: #166B79;
  --aq-info-bg: #E9FBF8;

  /* ======================================================================
     SEMANTIC ALIASES — prefer these in product UI
     ====================================================================== */

  /* Surfaces */
  --surface-canvas: var(--aq-n-25);      /* light content area background */
  --surface-card: var(--aq-white);       /* cards, panels, sheets */
  --surface-muted: var(--aq-n-50);       /* zebra rows, wells, hover */
  --surface-sunken: var(--aq-n-100);
  --surface-chrome: var(--aq-petrol-700);/* top bar, side nav, AI panel */
  --surface-chrome-deep: var(--aq-petrol-900);
  --surface-inverse: var(--aq-petrol-900);

  /* Text */
  --text-strong: var(--aq-deepest);      /* headings */
  --text-body: var(--aq-petrol-700);     /* default body on light */
  --text-muted: var(--aq-n-500);         /* captions, meta */
  --text-on-dark: var(--aq-white);       /* body on petrol/deepest */
  --text-on-dark-muted: #9FB6B5;         /* muted on petrol */
  --text-on-brand: var(--aq-deepest);    /* text on teal/green fills */
  --text-link: var(--aq-petrol-700);     /* links on light = petrol */

  /* Borders & dividers */
  --border-subtle: var(--aq-n-100);
  --border-default: var(--aq-n-200);
  --border-strong: var(--aq-n-300);
  --border-on-dark: rgba(255, 255, 255, 0.14);

  /* Brand / interactive */
  --brand-primary: var(--aq-teal);
  --brand-secondary: var(--aq-green);
  --action-fill: var(--aq-teal);         /* primary button fill */
  --action-fill-hover: var(--aq-teal-500);
  --action-fill-press: var(--aq-teal-600);
  --action-text: var(--aq-deepest);      /* text on teal/green button */
  --accent-active: var(--aq-green);      /* sidebar active accent */
  --focus-ring: var(--aq-lime);          /* energy accent — focus glow only */

  /* AI surface (Arqueum IA Hub) */
  --ai-panel: var(--aq-petrol-700);
  --ai-panel-deep: var(--aq-petrol-900);
  --ai-bubble-ai: #0B5560;               /* darker teal for AI bubbles */
  --ai-bubble-user: rgba(255,255,255,0.10);
  --ai-send: var(--aq-green);
}

/* Arqueum — Typography tokens. DM Sans for everything. Min body 14px.
   Weights in use: 400 regular, 500 medium, 600 semibold, 700 bold, 800 extrabold. */

:root {
  --font-sans: "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "DM Sans", system-ui, sans-serif; /* same family, heavier weights */

  /* Weights */
  --fw-regular: 400; /* @kind font */
  --fw-medium: 500; /* @kind font */
  --fw-semibold: 600; /* @kind font */
  --fw-bold: 700; /* @kind font */
  --fw-extrabold: 800; /* @kind font */

  /* Type scale (px). Display sizes use tighter tracking + heavier weight. */
  --fs-display-2xl: 56px;  --lh-display-2xl: 1.04; /* @kind font */
  --fs-display-xl: 44px;   --lh-display-xl: 1.06; /* @kind font */
  --fs-display-lg: 36px;   --lh-display-lg: 1.10; /* @kind font */
  --fs-h1: 30px;           --lh-h1: 1.15; /* @kind font */
  --fs-h2: 24px;           --lh-h2: 1.20; /* @kind font */
  --fs-h3: 20px;           --lh-h3: 1.25; /* @kind font */
  --fs-h4: 18px;           --lh-h4: 1.30; /* @kind font */
  --fs-body-lg: 16px;      --lh-body-lg: 1.55; /* @kind font */
  --fs-body: 15px; /* default UI/body @kind font */
  --lh-body: 1.55; /* @kind font */
  --fs-body-sm: 14px; /* min body @kind font */
  --lh-body-sm: 1.50; /* @kind font */
  --fs-caption: 13px;      --lh-caption: 1.40; /* @kind font */
  --fs-micro: 12px; /* labels/overlines @kind font */
  --lh-micro: 1.35; /* @kind font */

  /* Letter-spacing */
  --tracking-display: -0.02em; /* @kind font */
  --tracking-heading: -0.01em; /* @kind font */
  --tracking-body: 0em; /* @kind font */
  --tracking-overline: 0.08em; /* @kind font */
}

/* Arqueum — Spacing, radii, shadows, motion. 4px base grid. */

:root {
  /* Spacing scale (4px base) */
  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  /* Radii — rounded, friendly. */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 10px;   /* inputs, buttons */
  --radius-lg: 14px;   /* cards */
  --radius-xl: 20px;   /* large panels, modals */
  --radius-2xl: 28px;
  --radius-pill: 999px;

  /* Shadows — soft, cool-tinted (petrol-based), never harsh black. */
  --shadow-xs: 0 1px 2px rgba(5, 38, 40, 0.06);
  --shadow-sm: 0 1px 3px rgba(5, 38, 40, 0.08), 0 1px 2px rgba(5, 38, 40, 0.04);
  --shadow-md: 0 4px 12px rgba(5, 38, 40, 0.08), 0 2px 4px rgba(5, 38, 40, 0.05);
  --shadow-lg: 0 12px 28px rgba(5, 38, 40, 0.12), 0 4px 8px rgba(5, 38, 40, 0.06);
  --shadow-xl: 0 24px 48px rgba(5, 38, 40, 0.16);
  /* Lime energy focus glow (accent only) */
  --shadow-focus: 0 0 0 3px rgba(100, 255, 0, 0.45);
  --ring-focus: 0 0 0 2px var(--aq-white), 0 0 0 4px rgba(100, 255, 0, 0.55);

  /* Motion — calm, slightly futurist. Quick, gentle easing. No bounce on UI. */
  --ease-standard: cubic-bezier(0.2, 0, 0.1, 1); /* @kind other */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --ease-in: cubic-bezier(0.4, 0, 1, 1); /* @kind other */
  --dur-fast: 120ms; /* @kind other */
  --dur-base: 200ms; /* @kind other */
  --dur-slow: 320ms; /* @kind other */

  /* Layout */
  --container-max: 1280px; /* @kind spacing */
  --sidebar-w: 256px; /* @kind spacing */
  --topbar-h: 60px; /* @kind spacing */
}

/* Arqueum — Base element defaults. Light content area, DM Sans, calm + clean. */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  font-weight: var(--fw-regular);
  color: var(--text-body);
  background: var(--surface-canvas);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  color: var(--text-strong);
  font-weight: var(--fw-bold);
  letter-spacing: var(--tracking-heading);
  text-wrap: balance;
}

p {
  margin: 0;
  text-wrap: pretty;
}

a {
  color: var(--text-link);
  text-decoration: none;
  text-underline-offset: 2px;
}
a:hover {
  text-decoration: underline;
}

/* Links living on dark chrome flip to white */
.on-dark a,
a.on-dark {
  color: var(--text-on-dark);
}

img, svg {
  display: block;
  max-width: 100%;
}

button {
  font-family: inherit;
}

/* Energy-accent focus: lime glow only, never as a text/fill color */
:focus-visible {
  outline: none;
  box-shadow: var(--shadow-focus);
  border-radius: var(--radius-sm);
}

/* Brand utility helpers */
.aq-gradient-text {
  background: var(--aq-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.aq-overline {
  font-size: var(--fs-micro);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--tracking-overline);
  text-transform: uppercase;
  color: var(--text-muted);
}

@keyframes aq-spin {
  to { transform: rotate(360deg); }
}

/* Smart Publishing (3378) - design tokens (--arq-*) + base reset, vendored from the
   design prototype (prototype/css/tokens.css). @font-face blocks removed: DM Sans is
   declared by Content/modern/ds/tokens/fonts.css with correct asset paths. */

/* ============================================================================
   Arqueum — token layer for the Publicação inteligente screen.
   Framework-agnostic. All values exposed as --arq-* custom properties so the
   screen ports cleanly into the Razor/Handlebars monolith. NO hard-coded hex
   inside components — components reference these tokens only.
   Hard rules encoded here: no blue, no red; severity = petrol + alert icon +
   the neutral attention token; lime is focus-glow only; gradient is sparing.
   ========================================================================== */

/* ---- DM Sans, self-hosted (no CDN) ---- */
:root {
  /* ===== Brand primitives ===== */
  --arq-teal: #1AC6B1;
  --arq-green: #49D16B;
  --arq-petrol: #093F49;
  --arq-deepest: #052628;
  --arq-neutral: #C5D0CD;
  --arq-white: #FFFFFF;
  --arq-lime: #64FF00;            /* focus glow ONLY */

  --arq-gradient: linear-gradient(135deg, #1AC6B1 0%, #49D16B 100%);

  /* Teal ramp */
  --arq-teal-50: #E9FBF8;
  --arq-teal-100: #C7F4ED;
  --arq-teal-200: #93E9DC;
  --arq-teal-300: #54D9C7;
  --arq-teal-500: #14A595;
  --arq-teal-600: #0F8478;
  --arq-teal-700: #0B655C;

  /* Green ramp */
  --arq-green-50: #ECFBEF;
  --arq-green-100: #CFF4D6;
  --arq-green-200: #A1E9B0;
  --arq-green-300: #6FDC87;
  --arq-green-500: #34AE53;
  --arq-green-600: #268A41;
  --arq-green-700: #1B6831;

  /* Petrol family */
  --arq-petrol-900: #052628;
  --arq-petrol-800: #073239;
  --arq-petrol-700: #093F49;
  --arq-petrol-600: #0E5460;
  --arq-petrol-500: #166B79;
  --arq-petrol-400: #2E8896;

  /* Neutral / cool green-grey ramp */
  --arq-n-0: #FFFFFF;
  --arq-n-25: #F7FAF9;
  --arq-n-50: #EEF3F2;
  --arq-n-100: #E2EAE8;
  --arq-n-200: #C5D0CD;
  --arq-n-300: #A7B5B2;
  --arq-n-400: #859390;
  --arq-n-500: #6B7A77;
  --arq-n-600: #4E5C59;
  --arq-n-700: #33403D;
  --arq-n-800: #1C2826;

  /* ===== Semantic surfaces ===== */
  --arq-surface-canvas: var(--arq-n-25);
  --arq-surface-card: var(--arq-white);
  --arq-surface-muted: var(--arq-n-50);
  --arq-surface-sunken: var(--arq-n-100);
  --arq-surface-chrome: var(--arq-petrol-700);
  --arq-surface-chrome-deep: var(--arq-petrol-900);

  /* ===== Text ===== */
  --arq-text-strong: var(--arq-deepest);
  --arq-text-body: var(--arq-petrol-700);
  --arq-text-muted: var(--arq-n-500);
  --arq-text-on-dark: var(--arq-white);
  --arq-text-on-dark-muted: #9FB6B5;
  --arq-text-on-brand: var(--arq-deepest);

  /* ===== Borders ===== */
  --arq-border-subtle: var(--arq-n-100);
  --arq-border: var(--arq-n-200);
  --arq-border-strong: var(--arq-n-300);
  --arq-border-on-dark: rgba(255,255,255,0.14);

  /* ===== Interactive ===== */
  --arq-action-fill: var(--arq-teal);
  --arq-action-fill-hover: var(--arq-teal-500);
  --arq-action-fill-press: var(--arq-teal-600);
  --arq-action-text: var(--arq-deepest);
  --arq-accent-active: var(--arq-green);

  /* ===== AI surfaces ===== */
  --arq-ai-panel: var(--arq-petrol-700);
  --arq-ai-panel-deep: var(--arq-petrol-900);
  --arq-ai-bubble: #0B5560;

  /* ===== Status (in-family; success=green, NO red, NO blue) ===== */
  --arq-success: var(--arq-green-500);
  --arq-success-bg: var(--arq-green-50);
  --arq-success-text: var(--arq-green-700);

  /* Attention = petrol+neutral, never amber/red. Severity via icon + weight. */
  --arq-attention-strip: var(--arq-petrol-500);
  --arq-attention-bg: #EAF1F0;            /* subtle petrol-tinted neutral */
  --arq-attention-border: var(--arq-petrol-300, #6E9AA1);
  --arq-attention-text: var(--arq-petrol-700);

  /* Info / inherited = neutral border + petrol text */
  --arq-info-bg: var(--arq-n-50);
  --arq-info-text: var(--arq-petrol-700);

  /* ===== Spacing (4px grid) ===== */
  --arq-space-1: 4px;
  --arq-space-2: 8px;
  --arq-space-3: 12px;
  --arq-space-4: 16px;
  --arq-space-5: 20px;
  --arq-space-6: 24px;
  --arq-space-8: 32px;
  --arq-space-10: 40px;
  --arq-space-12: 48px;
  --arq-space-16: 64px;

  /* ===== Radii ===== */
  --arq-radius-xs: 4px;
  --arq-radius-sm: 6px;
  --arq-radius-md: 10px;     /* inputs, buttons */
  --arq-radius-lg: 14px;     /* cards */
  --arq-radius-xl: 20px;     /* panels, modals */
  --arq-radius-pill: 999px;

  /* ===== Shadows — soft, petrol-tinted ===== */
  --arq-shadow-xs: 0 1px 2px rgba(5,38,40,0.06);
  --arq-shadow-sm: 0 1px 3px rgba(5,38,40,0.08), 0 1px 2px rgba(5,38,40,0.04);
  --arq-shadow-md: 0 4px 12px rgba(5,38,40,0.08), 0 2px 4px rgba(5,38,40,0.05);
  --arq-shadow-lg: 0 12px 28px rgba(5,38,40,0.12), 0 4px 8px rgba(5,38,40,0.06);
  --arq-shadow-xl: 0 24px 48px rgba(5,38,40,0.16);
  --arq-focus: 0 0 0 3px rgba(100,255,0,0.45);              /* lime glow */
  --arq-focus-ring: 0 0 0 2px var(--arq-white), 0 0 0 4px rgba(100,255,0,0.55);
  --arq-select-ring: 0 0 0 3px rgba(26,198,177,0.40);       /* teal selection */

  /* ===== Type ===== */
  --arq-font: "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --arq-fw-regular: 400;
  --arq-fw-medium: 500;
  --arq-fw-semibold: 600;
  --arq-fw-bold: 700;
  --arq-fw-extrabold: 800;

  /* ===== Motion ===== */
  --arq-ease: cubic-bezier(0.2,0,0.1,1);
  --arq-ease-out: cubic-bezier(0.16,1,0.3,1);
  --arq-dur-fast: 120ms;
  --arq-dur-base: 200ms;
  --arq-dur-slow: 320ms;

  /* ===== Layout ===== */
  --arq-sidebar-w: 248px;
  --arq-topbar-h: 60px;
}

/* ============================ Base reset ============================ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--arq-font);
  font-size: 15px;
  line-height: 1.55;
  font-weight: var(--arq-fw-regular);
  color: var(--arq-text-body);
  background: var(--arq-surface-canvas);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
h1,h2,h3,h4,h5,h6 { margin: 0; color: var(--arq-text-strong); font-weight: var(--arq-fw-bold); letter-spacing: -0.01em; text-wrap: balance; }
p { margin: 0; text-wrap: pretty; }
button { font-family: inherit; }
img, svg { display: block; max-width: 100%; }
input, select, textarea { font-family: inherit; }

/* Lime focus glow — focus state only, never a fill/text color */
:focus-visible { outline: none; box-shadow: var(--arq-focus); border-radius: var(--arq-radius-sm); }

.arq-gradient-text {
  background: var(--arq-gradient);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.arq-overline {
  font-size: 12px; font-weight: var(--arq-fw-semibold);
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--arq-text-muted);
}
.arq-sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
@keyframes arq-spin { to { transform: rotate(360deg); } }

/* ============================================================================
   Publicação inteligente — screen styles. Composes the Arqueum visual language
   in plain CSS against --arq-* tokens (no framework, no hard-coded hex).
   ========================================================================== */

/* ===================== App shell / chrome ===================== */
html, body { height: 100%; }
.pi-app { display: flex; height: 100vh; overflow: hidden; }

/* As variaveis --arq-brand-menu-* vem do tema do menu lateral (Administracao Central >
   Tema), publicadas por Views/Shared/_ModernBrandingVars.cshtml. So existem quando o tema
   foi personalizado; sem elas cada regra cai no valor do design system, que e' a reserva
   escrita no segundo argumento do var(). O mapa de qual cor vai onde esta' em
   Utility/ModernBrandingModel.cs, junto do porque. */
.pi-sidebar {
  width: var(--arq-sidebar-w); flex: none; background: var(--arq-brand-menu-bg, var(--arq-surface-chrome));
  display: flex; flex-direction: column; color: var(--arq-brand-menu-item, var(--arq-text-on-dark));
}
/* 3378: logo at 80% (26 -> ~21px) + vertically centered to align with the 60px topbar bar.
   Collapsed state (html.pi-nav-collapsed in layout.css) overrides min-height + hides the img. */
.pi-sidebar__logo { padding: 0 20px; display: flex; align-items: center; justify-content: center; min-height: 60px; background: var(--arq-brand-menu-surface, transparent); }
.pi-sidebar__logo img { height: 21px; width: auto; }
.pi-sidebar__cta { padding: 4px 12px 8px; }
.pi-newpub {
  width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px;
  height: 42px; border: none; border-radius: var(--arq-radius-md); cursor: pointer;
  background: var(--arq-teal); color: var(--arq-brand-accent-text, var(--arq-deepest));
  font-size: 15px; font-weight: 600;
}
.pi-nav { padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; flex: 1; overflow: auto; }
.pi-nav__item {
  display: flex; align-items: center; gap: 12px; min-height: 40px; padding: 9px 12px; line-height: 1.25;
  border: none; border-radius: var(--arq-radius-md); cursor: pointer; text-align: left;
  position: relative; background: transparent; color: var(--arq-brand-menu-item, var(--arq-text-on-dark-muted));
  font-size: 15px; font-weight: 500; width: 100%;
  transition: background var(--arq-dur-fast) var(--arq-ease), color var(--arq-dur-fast) var(--arq-ease);
}
.pi-nav__item:hover { background: var(--arq-brand-menu-hover-bg, rgba(255,255,255,0.06)); color: var(--arq-brand-menu-item-hover, #fff); }
.pi-nav__item--active { background: rgba(73,209,107,0.14); color: var(--arq-brand-menu-item-hover, #fff); font-weight: 600; }
.pi-nav__item--active::before {
  content: ""; position: absolute; left: 0; top: 9px; bottom: 9px; width: 3px;
  border-radius: 3px; background: var(--arq-green);
}
.pi-nav__item .pi-count {
  margin-left: auto; font-size: 12px; font-weight: 700; color: var(--arq-deepest);
  background: var(--arq-green); border-radius: 999px; padding: 2px 7px; line-height: 1.2;
}
.pi-sidebar__user { padding: 12px; border-top: 1px solid var(--arq-brand-menu-line, rgba(255,255,255,0.10)); display: flex; align-items: center; gap: 10px; }
.pi-avatar { border-radius: 999px; display: flex; align-items: center; justify-content: center; flex: none; font-weight: 600; color: var(--arq-brand-accent-deep-text, #fff); background: var(--arq-teal-600); }
.pi-avatar--sq { border-radius: var(--arq-radius-sm); }

.pi-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.pi-topbar {
  height: var(--arq-topbar-h); flex: none; background: var(--arq-surface-card);
  border-bottom: 1px solid var(--arq-border); display: flex; align-items: center; gap: 16px; padding: 0 20px;
}
.pi-crumb { display: flex; align-items: center; gap: 6px; min-width: 0; }
.pi-crumb span.sep { color: var(--arq-n-300); display: flex; }
.pi-crumb .c { font-size: 15px; white-space: nowrap; color: var(--arq-text-muted); font-weight: 500; }
.pi-crumb .c.last { color: var(--arq-text-strong); font-weight: 700; }
.pi-topbar__search { flex: 1; max-width: 380px; margin-left: auto; }
.pi-searchbox { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px; background: var(--arq-n-50); border: 1px solid transparent; border-radius: var(--arq-radius-md); }
.pi-searchbox input { flex: 1; border: none; outline: none; background: transparent; font-size: 14.5px; color: var(--arq-text-strong); }
.pi-iconbtn-chrome { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border: none; border-radius: var(--arq-radius-md); background: transparent; color: var(--arq-text-body); cursor: pointer; position: relative; }
.pi-iconbtn-chrome:hover { background: var(--arq-n-50); }

/* ===================== Screen scaffold (fixed header + footer, no page scroll) ===================== */
.pi-main { min-height: 0; }
.pi-subhead { flex: none; background: var(--arq-surface-canvas); border-bottom: 1px solid var(--arq-border); }
.pi-subhead__inner { max-width: 1320px; margin: 0 auto; padding: 14px 28px 12px; }
.pi-body { flex: 1; min-height: 0; overflow: hidden; background: var(--arq-surface-canvas); position: relative; }
.pi-body__inner { max-width: 1320px; height: 100%; margin: 0 auto; padding: 16px 28px; }

.pi-screenhead { display: flex; align-items: center; gap: 16px; margin-bottom: 12px; }
/* Grupo à direita do subhead: badge de IA + atalho "Alterar para publicação clássica".
   margin-left:auto garante o alinhamento à direita sem depender do flex do título. */
.pi-screenhead__aside { margin-left: auto; display: inline-flex; align-items: center; gap: 12px; flex: none; }
.pi-screenhead__sep { width: 1px; height: 16px; background: var(--arq-border); flex: none; }
.pi-screenhead__toclassic { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; font-size: 12.5px; font-weight: 600; color: var(--arq-text-muted); text-decoration: none; cursor: pointer; }
.pi-screenhead__toclassic .pi-ic { color: var(--arq-text-muted); }
.pi-screenhead__toclassic:hover, .pi-screenhead__toclassic:focus { color: var(--arq-text-strong); text-decoration: underline; }
.pi-screenhead__toclassic:hover .pi-ic { color: var(--arq-text-strong); }
.pi-screenhead__title h1 { font-size: 23px; font-weight: 800; letter-spacing: -0.02em; }
.pi-screenhead__title .ai-spark { color: var(--arq-teal); vertical-align: middle; }
.pi-screenhead__title p { color: var(--arq-text-muted); font-size: 13.5px; margin-top: 1px; }
.pi-escape {
  margin-left: auto; display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 14px;
  background: transparent; border: 1px solid var(--arq-border); border-radius: var(--arq-radius-md);
  color: var(--arq-text-body); font-size: 14px; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.pi-escape:hover { background: var(--arq-n-50); }

/* Quick-nav chips */
.pi-quicknav { display: flex; flex-wrap: wrap; gap: 8px; }
.pi-chipnav {
  display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 11px;
  border: 1px solid var(--arq-border); border-radius: var(--arq-radius-pill); background: var(--arq-surface-card);
  font-size: 12.5px; font-weight: 600; color: var(--arq-text-body); cursor: pointer;
}
.pi-chipnav:hover { background: var(--arq-n-50); }
.pi-chipnav .st { width: 8px; height: 8px; border-radius: 999px; }
.pi-chipnav .st--ok { background: var(--arq-green); }
.pi-chipnav .st--attn { background: var(--arq-petrol-500); }
.pi-chipnav .st--opt { background: var(--arq-n-300); }

/* ===================== Split grid ===================== */
.pi-grid { display: grid; grid-template-columns: minmax(330px, 384px) minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); gap: 18px; align-items: stretch; height: 100%; min-height: 0; }
.pi-workarea { display: grid; grid-template-columns: minmax(0, 1fr) 302px; grid-template-rows: minmax(0, 1fr); gap: 16px; align-items: stretch; min-width: 0; height: 100%; min-height: 0; }

/* On narrower desktops keep tracks but a touch tighter */
@media (max-width: 1380px) {
  .pi-workarea { grid-template-columns: minmax(0, 1fr) 280px; gap: 14px; }
  .pi-grid { grid-template-columns: minmax(320px, 352px) minmax(0, 1fr); gap: 14px; }
}
/* Below tablet: allow page scroll, stack columns */
@media (max-width: 1180px) {
  .pi-body { overflow: auto; }
  .pi-grid { grid-template-columns: 1fr; height: auto; }
  .pi-canvas, .pi-form, #pi-drawer-mount { overflow: visible !important; max-height: none !important; height: auto !important; }
  .pi-workarea { grid-template-columns: 1fr; height: auto; }
  .pi-drawer { position: relative !important; max-height: none !important; }
}

/* ===================== Left canvas ===================== */
.pi-canvas { min-width: 0; min-height: 0; height: 100%; overflow-y: auto; overflow-x: hidden; padding-right: 4px; }
.pi-form { min-width: 0; min-height: 0; height: 100%; overflow-y: auto; overflow-x: hidden; padding-right: 4px; display: flex; flex-direction: column; }
#pi-drawer-mount { min-width: 0; min-height: 0; height: 100%; }

/* Subtle thin scrollbars for the internal scroll regions */
.pi-canvas, .pi-form { scrollbar-width: thin; scrollbar-color: var(--arq-n-300) transparent; }
.pi-canvas::-webkit-scrollbar, .pi-form::-webkit-scrollbar { width: 8px; }
.pi-canvas::-webkit-scrollbar-thumb, .pi-form::-webkit-scrollbar-thumb { background: var(--arq-n-200); border-radius: 999px; border: 2px solid transparent; background-clip: padding-box; }
.pi-canvas::-webkit-scrollbar-thumb:hover, .pi-form::-webkit-scrollbar-thumb:hover { background: var(--arq-n-300); background-clip: padding-box; }
.pi-drawer__list { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.25) transparent; }
.pi-drawer__list::-webkit-scrollbar { width: 7px; }
.pi-drawer__list::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.2); border-radius: 999px; }
.pi-card { background: var(--arq-surface-card); border: 1px solid var(--arq-border); border-radius: var(--arq-radius-lg); box-shadow: var(--arq-shadow-sm); }
.pi-canvas__sources { display: flex; gap: 4px; padding: 6px; background: var(--arq-n-100); border-radius: var(--arq-radius-md); margin-bottom: 14px; }
.pi-srctab {
  flex: 1; display: flex; align-items: center; justify-content: center; gap: 7px; height: 38px; padding: 0 8px;
  border: none; border-radius: var(--arq-radius-sm); background: transparent; cursor: pointer;
  font-size: 13px; font-weight: 600; color: var(--arq-text-muted);
}
.pi-srctab--active { background: var(--arq-surface-card); color: var(--arq-text-strong); box-shadow: var(--arq-shadow-xs); }

.pi-dropzone {
  position: relative; border: 2px dashed var(--arq-border-strong); border-radius: var(--arq-radius-lg);
  background: var(--arq-n-25); padding: 40px 24px; text-align: center; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  transition: border-color var(--arq-dur-base) var(--arq-ease), background var(--arq-dur-base) var(--arq-ease), box-shadow var(--arq-dur-base) var(--arq-ease);
}
.pi-dropzone:hover { background: var(--arq-teal-50); border-color: var(--arq-teal-300); }
.pi-dropzone--over {
  border-style: solid; border-color: transparent; background: var(--arq-teal-50);
  box-shadow: var(--arq-focus), inset 0 0 0 2px var(--arq-teal);
}
.pi-dropzone--reject { background: var(--arq-attention-bg); border-color: var(--arq-attention-strip); }
.pi-dropzone__mark {
  width: 56px; height: 56px; border-radius: var(--arq-radius-lg); display: flex; align-items: center; justify-content: center;
  background: var(--arq-gradient); color: var(--arq-deepest);
}
.pi-dropzone h3 { font-size: 16px; font-weight: 700; }
.pi-dropzone p { font-size: 13.5px; color: var(--arq-text-muted); max-width: 280px; }
.pi-dropzone__browse {
  display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 16px; margin-top: 4px;
  background: var(--arq-brand-menu-bg, var(--arq-petrol-700)); color: var(--arq-brand-menu-item, #fff); border: none; border-radius: var(--arq-radius-md);
  font-size: 14px; font-weight: 600; cursor: pointer;
}
.pi-dropzone__hint { font-size: 12px; color: var(--arq-text-muted); }

/* File chips / filmstrip */
.pi-filehead { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.pi-filehead h3 { font-size: 13px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--arq-text-muted); }
.pi-filmstrip { display: flex; flex-direction: column; gap: 8px; }
.pi-filechip {
  display: flex; align-items: center; gap: 11px; padding: 11px 12px; border: 1px solid var(--arq-border);
  border-radius: var(--arq-radius-md); background: var(--arq-surface-card); cursor: pointer; position: relative;
  transition: box-shadow var(--arq-dur-base) var(--arq-ease), border-color var(--arq-dur-base) var(--arq-ease);
}
.pi-filechip:hover { box-shadow: var(--arq-shadow-sm); }
.pi-filechip--active { border-color: var(--arq-teal); box-shadow: var(--arq-select-ring); }
.pi-filechip__thumb {
  width: 40px; height: 48px; flex: none; border-radius: var(--arq-radius-sm); background: var(--arq-n-50);
  border: 1px solid var(--arq-border-subtle); display: flex; align-items: center; justify-content: center; color: var(--arq-petrol-500);
}
.pi-filechip__body { flex: 1; min-width: 0; }
.pi-filechip__name { font-size: 14px; font-weight: 600; color: var(--arq-text-strong); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pi-filechip__meta { font-size: 12px; color: var(--arq-text-muted); margin-top: 1px; }
.pi-filechip__prov { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 600; color: var(--arq-petrol-600); background: var(--arq-n-50); border-radius: 999px; padding: 2px 8px; margin-top: 5px; }
.pi-anexgroup__lbl { display: flex; align-items: center; gap: 7px; font-size: 11.5px; font-weight: 700; color: var(--arq-petrol-600); margin-bottom: 7px; }
.pi-anexgroup__lbl .pi-ic { color: var(--arq-teal-600); }

/* ----- File-type thumbnails ----- */
.pi-fthumb { flex-direction: column; gap: 2px; padding: 4px 0; overflow: hidden; }
.pi-fthumb__ic { display: flex; }
.pi-fthumb__ext { font-size: 8px; font-weight: 800; letter-spacing: 0.02em; line-height: 1; padding: 1.5px 4px; border-radius: 3px; color: #fff; }
.pi-fthumb--lg { width: 64px; height: 76px; gap: 5px; }
.pi-fthumb--lg .pi-fthumb__ext { font-size: 10px; padding: 2px 6px; }
.pi-fthumb--pdf  { background: #EAF1F0; color: var(--arq-petrol-700); border-color: var(--arq-petrol-300, #8FB3B8); }
.pi-fthumb--pdf  .pi-fthumb__ext { background: var(--arq-petrol-700); }
.pi-fthumb--doc  { background: var(--arq-teal-50); color: var(--arq-teal-700); border-color: var(--arq-teal-200); }
.pi-fthumb--doc  .pi-fthumb__ext { background: var(--arq-teal-600); }
.pi-fthumb--xls  { background: var(--arq-green-50); color: var(--arq-green-700); border-color: var(--arq-green-200); }
.pi-fthumb--xls  .pi-fthumb__ext { background: var(--arq-green-600); }
.pi-fthumb--ppt  { background: #EAF1F0; color: var(--arq-petrol-600); border-color: var(--arq-petrol-300, #8FB3B8); }
.pi-fthumb--ppt  .pi-fthumb__ext { background: var(--arq-petrol-500); }
.pi-fthumb--xml  { background: var(--arq-n-50); color: var(--arq-petrol-600); border-color: var(--arq-border); }
.pi-fthumb--xml  .pi-fthumb__ext { background: var(--arq-petrol-500); }
.pi-fthumb--img  { background: var(--arq-teal-50); color: var(--arq-teal-600); border-color: var(--arq-teal-200); }
.pi-fthumb--img  .pi-fthumb__ext { background: var(--arq-teal-500); }
.pi-fthumb--gen  { background: var(--arq-n-50); color: var(--arq-n-600); border-color: var(--arq-border); }
.pi-fthumb--gen  .pi-fthumb__ext { background: var(--arq-n-500); }

/* ----- Type-varied big preview ----- */
.pi-preview__img { flex: 1; display: flex; align-items: center; justify-content: center; background: repeating-linear-gradient(45deg, var(--arq-teal-50) 0 10px, var(--arq-n-25) 10px 20px); color: var(--arq-teal-600); }
.pi-preview__grid { flex: 1; display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 22px; gap: 1px; padding: 16px; background: var(--arq-n-100); }
.pi-preview__grid .cell { background: #fff; }
.pi-preview__grid .cell.h { background: var(--arq-green-50); }
.pi-preview__code { flex: 1; display: flex; flex-direction: column; gap: 8px; padding: 22px; }
.pi-preview__code .row { display: flex; }
.pi-preview__code .row span { height: 8px; border-radius: 3px; background: var(--arq-n-100); }
.pi-iconbtn-mini { width: 28px; height: 28px; flex: none; display: flex; align-items: center; justify-content: center; border: none; background: transparent; color: var(--arq-text-muted); border-radius: var(--arq-radius-sm); cursor: pointer; }
.pi-iconbtn-mini:hover { background: var(--arq-n-100); color: var(--arq-text-strong); }

/* big preview in canvas */
.pi-preview { padding: 14px; }
.pi-preview__sheet {
  border-radius: var(--arq-radius-md); border: 1px solid var(--arq-border); overflow: hidden;
  background: #fff; box-shadow: var(--arq-shadow-sm); aspect-ratio: 8.5 / 11; max-height: 360px; margin: 0 auto;
  display: flex; flex-direction: column;
}
.pi-preview__doc { flex: 1; padding: 22px; display: flex; flex-direction: column; gap: 9px; overflow: hidden; }
.pi-preview__doc .ln { height: 8px; border-radius: 3px; background: var(--arq-n-100); }
.pi-preview__doc .ln.t { height: 14px; width: 62%; background: var(--arq-n-200); margin-bottom: 6px; }
.pi-preview__doc .ln.s { width: 90%; } .pi-preview__doc .ln.m { width: 78%; } .pi-preview__doc .ln.x { width: 96%; }
.pi-preview__cap { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px 4px; font-size: 12px; color: var(--arq-text-muted); }

/* ===================== Right form: spine ===================== */
/* #pi-spine is a flex child of the scrolling .pi-form; make IT the sticky element
   so Local/Tipo stay pinned while the cards below scroll. */
#pi-spine { position: sticky; top: 0; z-index: 6; background: var(--arq-surface-canvas); }
.pi-spine {
  position: relative; background: var(--arq-surface-canvas);
  padding: 2px 0 12px; margin-bottom: 4px;
}
.pi-spine__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pi-spinefield {
  background: var(--arq-surface-card); border: 1px solid var(--arq-border); border-radius: var(--arq-radius-md);
  padding: 9px 12px; cursor: pointer; position: relative;
  transition: border-color var(--arq-dur-fast) var(--arq-ease), box-shadow var(--arq-dur-fast) var(--arq-ease);
}
.pi-spinefield:hover { border-color: var(--arq-teal-300); }
.pi-spinefield--conflict { border-color: var(--arq-attention-strip); background: var(--arq-attention-bg); }
/* 4039: tipo documental travado ate haver local de guarda. O :hover precisa ser
   neutralizado depois da regra acima, senao a borda ainda reage e sugere clique. */
.pi-spinefield--locked { opacity: .55; cursor: not-allowed; }
.pi-spinefield--locked:hover { border-color: var(--arq-border); }
.pi-spinefield__label { font-size: 11.5px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--arq-text-muted); display: flex; align-items: center; gap: 6px; }
.pi-spinefield__value { font-size: 16px; font-weight: 700; color: var(--arq-text-strong); margin-top: 4px; display: flex; align-items: center; gap: 8px; }
.pi-spinefield__value .chev { margin-left: auto; color: var(--arq-text-muted); }
.pi-spinefield__path { font-size: 12px; color: var(--arq-text-muted); margin-top: 2px; }

/* ===================== AI summary card (dark petrol) ===================== */
.pi-ai { position: relative; border-radius: var(--arq-radius-xl); overflow: hidden; background: var(--arq-brand-panel-bg, var(--arq-ai-panel)); color: var(--arq-text-on-dark); box-shadow: var(--arq-shadow-md); margin: 12px 0 18px; }
.pi-ai__bg { position: absolute; inset: 0; background-image: repeating-linear-gradient(135deg, rgba(255,255,255,0.05) 0 1px, transparent 1px 24px); pointer-events: none; }
.pi-ai__in { position: relative; padding: 18px 20px 20px; }
.pi-ai__top { display: flex; align-items: center; gap: 11px; margin-bottom: 12px; }
.pi-ai__mark { width: 34px; height: 34px; flex: none; border-radius: 9px; background: var(--arq-gradient); display: flex; align-items: center; justify-content: center; color: var(--arq-deepest); }
.pi-ai__mark--pulse { animation: pi-pulse 1.6s var(--arq-ease) infinite; }
.pi-ai__title { font-size: 15px; font-weight: 700; color: #fff; }
.pi-ai__sub { font-size: 12.5px; color: var(--arq-text-on-dark-muted); }
.pi-ai__msg { font-size: 14.5px; color: #EAF4F2; line-height: 1.5; margin-bottom: 14px; }
.pi-ai__pills { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.pi-aipill {
  display: inline-flex; align-items: center; gap: 8px; padding: 7px 11px; border-radius: var(--arq-radius-md);
  background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.14); cursor: pointer;
}
.pi-aipill__k { font-size: 11px; color: var(--arq-text-on-dark-muted); text-transform: uppercase; letter-spacing: 0.04em; font-weight: 700; }
.pi-aipill__v { font-size: 14px; font-weight: 700; color: #fff; }
.pi-ai__attrs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; margin-bottom: 14px; padding: 12px 14px; background: rgba(255,255,255,0.05); border-radius: var(--arq-radius-md); }
.pi-ai__attr { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.pi-ai__attr .k { color: var(--arq-text-on-dark-muted); }
.pi-ai__attr .v { color: #fff; font-weight: 600; margin-left: auto; }

/* overall confidence band */
.pi-confband { display: flex; align-items: center; gap: 12px; padding: 11px 14px; background: rgba(255,255,255,0.05); border-radius: var(--arq-radius-md); margin-bottom: 14px; }
.pi-confband__label { font-size: 12.5px; color: var(--arq-text-on-dark-muted); }
.pi-confband__meter { display: flex; gap: 3px; flex: 1; max-width: 160px; }
.pi-confband__meter i { height: 6px; flex: 1; border-radius: 3px; background: rgba(255,255,255,0.16); }
.pi-confband__meter i.on { background: var(--arq-gradient); }
.pi-confband__name { font-size: 13px; font-weight: 700; color: #fff; margin-left: auto; }

.pi-ai__actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.pi-ai__disclaimer { display: flex; align-items: center; gap: 7px; font-size: 12px; color: var(--arq-text-on-dark-muted); margin-top: 13px; padding-top: 13px; border-top: 1px solid rgba(255,255,255,0.12); }
.pi-ai__disclaimer .pi-ic { color: var(--arq-green-300); flex: none; }

/* ===================== Buttons ===================== */
.pi-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: var(--arq-radius-md); font-size: 14px; font-weight: 600; cursor: pointer; border: 1px solid transparent; white-space: nowrap; transition: background var(--arq-dur-fast) var(--arq-ease), box-shadow var(--arq-dur-fast) var(--arq-ease), transform var(--arq-dur-fast) var(--arq-ease); }
.pi-btn:active { transform: scale(0.99); }
.pi-btn--sm { height: 34px; padding: 0 12px; font-size: 13px; }
.pi-btn--lg { height: 46px; padding: 0 22px; font-size: 15px; }
/* O rotulo sobre o preenchimento de acao e' calculado a partir da cor de destaque do tema
   (claro sobre destaque escuro, escuro sobre destaque claro). Enquanto esteve fixo em
   --arq-deepest, um destaque escuro produzia texto quase invisivel no botao. */
.pi-btn--primary { background: var(--arq-teal); color: var(--arq-brand-accent-text, var(--arq-deepest)); }
.pi-btn--primary:hover { background: var(--arq-teal-500); }
.pi-btn--green { background: var(--arq-green); color: var(--arq-deepest); }
.pi-btn--green:hover { background: var(--arq-green-500); }
/* O preenchimento "petroleo" e' a COR DO CROMO usada como fundo (--arq-surface-chrome tambem
   aponta para --arq-petrol-700): antes do tema ele combinava com a barra lateral por construcao.
   Com um menu de outra cor, seguir o fundo do menu e' o que restaura essa intencao -- e o texto
   usa a cor dos ITENS do menu, que e' justamente a que o administrador ja' escolheu para se ler
   sobre esse fundo. NAO da' para redefinir --arq-petrol-700 direto: ele tambem e' --arq-text-body,
   e o corpo do texto do produto inteiro viraria a cor da marca. */
.pi-btn--petrol { background: var(--arq-brand-menu-bg, var(--arq-petrol-700)); color: var(--arq-brand-menu-item, #fff); }
.pi-btn--petrol:hover { background: var(--arq-brand-menu-bg-hover, var(--arq-petrol-600)); }
.pi-btn--outline { background: var(--arq-surface-card); border-color: var(--arq-border-strong); color: var(--arq-text-body); }
.pi-btn--outline:hover { background: var(--arq-n-50); }
.pi-btn--ghost { background: transparent; color: var(--arq-text-body); }
.pi-btn--ghost:hover { background: var(--arq-n-50); }
.pi-btn--ghost-dark { background: transparent; color: #fff; border-color: rgba(255,255,255,0.22); }
.pi-btn--ghost-dark:hover { background: rgba(255,255,255,0.08); }
.pi-btn--gradient { background: var(--arq-gradient); color: var(--arq-deepest); font-weight: 700; box-shadow: 0 2px 10px rgba(26,198,177,0.30); }
.pi-btn--gradient:hover { box-shadow: 0 4px 16px rgba(26,198,177,0.40); }
.pi-btn[disabled], .pi-btn.is-disabled { opacity: 0.5; cursor: not-allowed; pointer-events: none; }
.pi-btn--block { width: 100%; }

/* ===================== Review cards ===================== */
.pi-cards { display: flex; flex-direction: column; gap: 12px; }
.pi-rcard { background: var(--arq-surface-card); border: 1px solid var(--arq-border); border-radius: var(--arq-radius-lg); box-shadow: var(--arq-shadow-sm); scroll-margin-top: 96px; transition: box-shadow var(--arq-dur-base) var(--arq-ease); }
.pi-rcard--highlight { box-shadow: var(--arq-focus), var(--arq-shadow-md); }
.pi-rcard--attn { border-color: var(--arq-attention-strip); }
.pi-rcard__head { display: flex; align-items: center; gap: 12px; padding: 12px 16px; cursor: pointer; }
.pi-rcard__icon { width: 34px; height: 34px; flex: none; border-radius: var(--arq-radius-md); background: var(--arq-teal-50); color: var(--arq-teal-600); display: flex; align-items: center; justify-content: center; }
.pi-rcard__titles { flex: 1; min-width: 0; }
.pi-rcard__title { font-size: 15.5px; font-weight: 700; color: var(--arq-text-strong); display: flex; align-items: center; gap: 9px; }
.pi-rcard__sub { font-size: 13px; color: var(--arq-text-muted); margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pi-rcard__chev { color: var(--arq-text-muted); transition: transform var(--arq-dur-base) var(--arq-ease); }
.pi-rcard--open .pi-rcard__chev { transform: rotate(180deg); }
.pi-rcard__body { padding: 0 16px 14px; border-top: 1px solid var(--arq-border-subtle); margin-top: 0; padding-top: 12px; }
.pi-rcard__body--reveal { animation: pi-reveal var(--arq-dur-slow) var(--arq-ease); }

/* status pills on cards */
.pi-pill { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.pi-pill .pi-ic { width: 14px; height: 14px; }
.pi-pill--ok { background: var(--arq-green-50); color: var(--arq-green-700); }
.pi-pill--attn { background: var(--arq-attention-bg); color: var(--arq-attention-text); }
.pi-pill--ai { background: var(--arq-teal-50); color: var(--arq-teal-700); }
.pi-pill--opt { background: var(--arq-n-50); color: var(--arq-n-600); }
.pi-pill--user { background: var(--arq-n-50); color: var(--arq-petrol-700); }
.pi-pill--done { background: var(--arq-green-50); color: var(--arq-green-700); }

/* ===================== Confidence chips ===================== */
.pi-conf { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; padding: 3px 9px; border-radius: 999px; }
.pi-conf__dot { width: 8px; height: 8px; border-radius: 999px; flex: none; }
.pi-conf--alta { background: var(--arq-green-50); color: var(--arq-green-700); }
.pi-conf--alta .pi-conf__dot { background: var(--arq-green); }
.pi-conf--media { background: var(--arq-teal-50); color: var(--arq-teal-700); }
.pi-conf--media .pi-conf__dot { background: var(--arq-teal); }
.pi-conf--baixa { background: var(--arq-attention-bg); color: var(--arq-attention-text); }
.pi-conf--baixa .pi-conf__dot { background: var(--arq-petrol-500); }

/* ===================== Attribute fields ===================== */
.pi-attrgroup { border: 1px solid var(--arq-border-subtle); border-radius: var(--arq-radius-md); margin-bottom: 10px; overflow: hidden; }
.pi-attrgroup__head { display: flex; align-items: center; gap: 9px; padding: 9px 13px; background: var(--arq-n-25); cursor: pointer; }
.pi-attrgroup__head h4 { font-size: 13px; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; color: var(--arq-petrol-700); }
.pi-attrgroup__count { margin-left: auto; font-size: 12px; color: var(--arq-text-muted); }
.pi-attrgroup__body { padding: 12px; display: flex; flex-direction: column; gap: 11px; }

.pi-field { }
.pi-field__label { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--arq-text-strong); margin-bottom: 6px; }
.pi-field__req { font-size: 10.5px; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; color: var(--arq-petrol-600); background: var(--arq-n-50); border: 1px solid var(--arq-border); border-radius: 999px; padding: 1px 7px; }
.pi-field__src { margin-left: auto; }
/* 4036: estrela do favorito na lista de Locais de Guarda / Tipos Documentais. */
.pi-favstar { color: #E0A400; margin-right: 5px; display: inline-flex; vertical-align: -2px; }
.pi-favstar svg { fill: currentColor; }
/* 4036: chip que alterna "somente favoritos" no picker. Ligado, a estrela fica
   preenchida (fill: currentColor) — mesmo sinal visual da estrela das linhas. */
.pi-favfilter {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px;
  border: 1px solid var(--arq-border-strong); border-radius: 999px;
  background: var(--arq-surface-card); color: var(--arq-text-muted);
  font-size: 12.5px; font-weight: 600; cursor: pointer;
}
.pi-favfilter:hover { border-color: var(--arq-teal-300); }
.pi-favfilter--on { border-color: #E0A400; background: #FFF8E6; color: #7A5A00; }
.pi-favfilter--on svg { fill: currentColor; }

/* 3938: calendário próprio do campo data (substitui o picker nativo do navegador). */
.pi-cal__nav { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.pi-cal__label { font-size: 14px; font-weight: 700; color: var(--arq-text-strong); text-transform: capitalize; }
.pi-cal { width: 100%; border-collapse: collapse; }
.pi-cal th { font-size: 11px; font-weight: 700; color: var(--arq-text-muted); text-transform: capitalize; padding-bottom: 6px; }
.pi-cal td { text-align: center; padding: 1px; }
.pi-cal__day, .pi-cal__month {
  width: 100%; min-width: 34px; height: 34px; border: 1px solid transparent; border-radius: var(--arq-radius-sm);
  background: transparent; color: var(--arq-text-body); font-size: 13px; cursor: pointer;
}
.pi-cal__day:hover, .pi-cal__month:hover { background: var(--arq-teal-50); border-color: var(--arq-teal-300); color: var(--arq-teal-700); }
.pi-cal__months { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.pi-cal__month { text-transform: capitalize; }

/* 3938: linha de hora do calendário (atributos "data e hora"). */
.pi-cal__time { display: flex; align-items: center; gap: 6px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--arq-border); }
.pi-cal__timelabel { font-size: 11.5px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--arq-text-muted); margin-right: auto; }
.pi-cal__timebox { width: 56px; text-align: center; padding: 6px 4px; border: 1px solid var(--arq-border); border-radius: var(--arq-radius-sm); font: inherit; font-variant-numeric: tabular-nums; }
.pi-cal__timesep { font-weight: 700; color: var(--arq-text-muted); }
.pi-cal__meridian { padding: 6px 6px; border: 1px solid var(--arq-border); border-radius: var(--arq-radius-sm); font: inherit; }

/* 3938: o placeholder da máscara ("__/__/____") saía com os traços PICOTADOS — o underscore
   da DM Sans não ocupa toda a largura de avanço, então cada par vira dois riscos separados.
   O clássico usa o mesmo placeholder e sai como um traço contínuo só porque a fonte dele é
   outra. Num campo mascarado a fonte tabular é a escolha certa de qualquer forma: os traços
   se juntam e os dígitos ficam alinhados na mesma coluna enquanto o usuário digita. */
.pi-control[data-mask="date"] { font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", Consolas, "Liberation Mono", monospace; font-variant-numeric: tabular-nums; letter-spacing: 0; }


/* 4025: descrição configurada no atributo — orienta o preenchimento, logo abaixo do nome. */
.pi-field__desc { font-size: 12px; color: var(--arq-text-muted); margin: 2px 0 6px; line-height: 1.45; }
/* 4034: texto formatado (RichText) — bloco de conteúdo entre os campos, não é um campo.
   Herda a tipografia do card; o HTML vem do próprio atributo. */
.pi-field--richtext { font-size: 13.5px; color: var(--arq-text-body); line-height: 1.55; }
/* 4034: o bloco carrega ql-editor para as classes de tamanho/alinhamento do Quill valerem
   (ver a nota no _Templates). Junto vem a caixa do EDITOR, que aqui nao serve: height:100%
   estica o bloco para a altura do ancestral com altura definida — medi 1237px onde o
   conteudo pede 84 —, overflow-y:auto vira um painel rolante e o padding do editor
   desalinha do resto do formulario. O classico escapa porque a coluna dele tem altura
   automatica. Fica so' a tipografia do conteudo. */
.pi-field--richtext.ql-editor { height: auto; overflow-y: visible; padding: 0; }
.pi-field--richtext.ql-editor > * { cursor: inherit; }
.pi-field--richtext p { margin: 0 0 6px; }
.pi-field--richtext ul, .pi-field--richtext ol { margin: 0 0 6px; padding-left: 20px; }
.pi-field--richtext strong, .pi-field--richtext b { color: var(--arq-text-strong); }
.pi-control {
  width: 100%; height: 40px; padding: 0 12px; border: 1px solid var(--arq-border-strong); border-radius: var(--arq-radius-md);
  background: var(--arq-surface-card); font-size: 14px; color: var(--arq-text-strong); outline: none;
}
.pi-control:focus { border-color: var(--arq-teal); box-shadow: 0 0 0 3px rgba(26,198,177,0.18); }
.pi-control:focus-visible { box-shadow: var(--arq-focus); }
textarea.pi-control { height: auto; padding: 10px 12px; resize: vertical; min-height: 64px; }
/* 4057: a seta do select vem daqui. O data URI PRECISA ser base64: o minificador de CSS
   do empacotador (WebGrease, ativo so em Release) nao aguenta SVG inline sem codificar e
   descarta a declaracao inteira -- em desenvolvimento a seta aparecia e no QAS nao, o que
   fazia o campo parecer texto e nao lista. */
select.pi-control { appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxNicgaGVpZ2h0PScxNicgdmlld0JveD0nMCAwIDI0IDI0JyBmaWxsPSdub25lJyBzdHJva2U9JyM0RTVDNTknIHN0cm9rZS13aWR0aD0nMicgc3Ryb2tlLWxpbmVjYXA9J3JvdW5kJyBzdHJva2UtbGluZWpvaW49J3JvdW5kJz48cGF0aCBkPSdtNiA5IDYgNiA2LTYnLz48L3N2Zz4="); background-repeat: no-repeat; background-position: right 12px center; padding-right: 36px; }
.pi-field--missing .pi-control { border-left: 3px solid var(--arq-teal); }
/* 4032: atributo de multiplas linhas exibe as quebras que o usuario digitou. */
.pi-field__filled .val--multiline { white-space: pre-wrap; }
.pi-field--missing { padding: 12px; border-radius: var(--arq-radius-md); background: var(--arq-teal-50); }
.pi-field__help { font-size: 12px; color: var(--arq-petrol-600); margin-top: 6px; display: flex; align-items: center; gap: 6px; }
.pi-field__filled { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border: 1px solid var(--arq-border); border-radius: var(--arq-radius-md); background: var(--arq-n-25); }
.pi-field__filled .val { font-size: 14px; font-weight: 600; color: var(--arq-text-strong); flex: 1; min-width: 0; }
.pi-field__acts { display: flex; gap: 4px; }
.pi-linkbtn { display: inline-flex; align-items: center; gap: 5px; background: none; border: none; cursor: pointer; font-size: 12.5px; font-weight: 600; color: var(--arq-petrol-700); padding: 4px 6px; border-radius: var(--arq-radius-sm); }
.pi-linkbtn:hover { background: var(--arq-n-50); }
.pi-rationale { font-size: 12px; color: var(--arq-text-muted); margin-top: 7px; padding: 8px 11px; background: var(--arq-n-25); border-radius: var(--arq-radius-sm); border: 1px dashed var(--arq-border); }

/* multi-select chips, switches, radios */
.pi-checkrow { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--arq-text-strong); cursor: pointer; }
.pi-checkrow--sm { font-size: 13px; gap: 9px; }
.pi-box { width: 20px; height: 20px; border-radius: 6px; border: 2px solid var(--arq-border-strong); display: flex; align-items: center; justify-content: center; flex: none; background: #fff; }
.pi-box--sm { width: 18px; height: 18px; border-radius: 5px; }
.pi-fileopts { display: flex; flex-direction: column; gap: 9px; margin: 8px 0 2px; padding: 11px 13px; border: 1px solid var(--arq-border-subtle); border-radius: var(--arq-radius-sm); background: var(--arq-n-50); }
.pi-box--on { background: var(--arq-teal); border-color: var(--arq-teal); color: var(--arq-brand-accent-text, var(--arq-deepest)); }
.pi-switch { width: 40px; height: 24px; border-radius: 999px; background: var(--arq-n-300); position: relative; flex: none; cursor: pointer; transition: background var(--arq-dur-base) var(--arq-ease); border: none; }
.pi-switch--on { background: var(--arq-teal); }
.pi-switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 999px; background: #fff; box-shadow: var(--arq-shadow-xs); transition: transform var(--arq-dur-base) var(--arq-ease-out); }
.pi-switch--on::after { transform: translateX(16px); }

.pi-radiocard { display: flex; gap: 12px; padding: 14px; border: 1px solid var(--arq-border-strong); border-radius: var(--arq-radius-md); cursor: pointer; background: var(--arq-surface-card); transition: border-color var(--arq-dur-fast) var(--arq-ease), box-shadow var(--arq-dur-fast) var(--arq-ease); }
.pi-radiocard:hover { border-color: var(--arq-teal-300); }
.pi-radiocard--on { border-color: var(--arq-teal); box-shadow: var(--arq-select-ring); }
.pi-radiocard--rec { border-color: var(--arq-green); }
.pi-radio { width: 20px; height: 20px; border-radius: 999px; border: 2px solid var(--arq-border-strong); flex: none; margin-top: 1px; position: relative; }
.pi-radiocard--on .pi-radio { border-color: var(--arq-teal); }
.pi-radiocard--on .pi-radio::after { content: ""; position: absolute; inset: 3px; border-radius: 999px; background: var(--arq-teal); }
/* Fermin: keep the icon and the title on ONE line (the DS icon renders block, which pushed
   the title to its own line); the description stays as the sibling below. */
.pi-radiocard__t { font-size: 14px; font-weight: 600; color: var(--arq-text-strong); display: flex; align-items: center; gap: 7px; }
.pi-radiocard__d { font-size: 12.5px; color: var(--arq-text-muted); margin-top: 2px; }

/* inherited permissions list */
.pi-inherit { background: var(--arq-n-25); border: 1px solid var(--arq-border); border-radius: var(--arq-radius-md); padding: 13px 14px; margin-bottom: 14px; }
.pi-inherit__head { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--arq-petrol-700); margin-bottom: 10px; }
.pi-grantrow { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-top: 1px solid var(--arq-border-subtle); }
.pi-grantrow:first-of-type { border-top: none; }
.pi-grantrow .nm { font-size: 13.5px; font-weight: 600; color: var(--arq-text-strong); }
.pi-grantrow .ac { margin-left: auto; font-size: 12px; font-weight: 600; color: var(--arq-text-muted); }
.pi-warnchip { display: inline-flex; align-items: center; gap: 7px; padding: 6px 11px; border-radius: var(--arq-radius-md); background: var(--arq-attention-bg); color: var(--arq-attention-text); font-size: 12.5px; font-weight: 600; border: 1px solid var(--arq-attention-strip); }

/* tokens / invite chips */
.pi-tokens { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.pi-token { display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 6px 0 11px; border-radius: var(--arq-radius-pill); border: 1px solid var(--arq-border); background: var(--arq-surface-card); font-size: 13px; font-weight: 600; color: var(--arq-text-body); }
.pi-token button { width: 20px; height: 20px; border: none; background: transparent; color: var(--arq-text-muted); cursor: pointer; display: flex; align-items: center; justify-content: center; border-radius: 999px; }
.pi-token button:hover { background: var(--arq-n-100); color: var(--arq-text-strong); }
.pi-token--src-modelo { border-color: var(--arq-petrol-400); }

/* tables (seguidores) */
.pi-table { width: 100%; border-collapse: collapse; }
.pi-table th { font-size: 11px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--arq-text-muted); text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--arq-border); }
.pi-table td { font-size: 13.5px; color: var(--arq-text-body); padding: 10px; border-bottom: 1px solid var(--arq-border-subtle); vertical-align: middle; }
.pi-table .nm { font-weight: 600; color: var(--arq-text-strong); display: flex; align-items: center; gap: 9px; }

/* workflow diagram */
.pi-flow { display: flex; align-items: stretch; gap: 0; overflow-x: auto; padding: 6px 2px 4px; }
.pi-flownode { flex: none; min-width: 150px; border: 1.5px solid var(--arq-petrol-400); border-radius: var(--arq-radius-md); padding: 12px; background: var(--arq-surface-card); position: relative; }
.pi-flownode--current { border-color: transparent; background: linear-gradient(var(--arq-surface-card), var(--arq-surface-card)) padding-box, var(--arq-gradient) border-box; border: 1.5px solid transparent; box-shadow: var(--arq-shadow-sm); }
.pi-flownode__step { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--arq-text-muted); }
.pi-flownode__name { font-size: 13.5px; font-weight: 700; color: var(--arq-text-strong); margin: 4px 0 8px; }
.pi-flownode__who { display: flex; align-items: center; gap: 8px; }
.pi-flownode__who .nm { font-size: 12.5px; font-weight: 600; color: var(--arq-text-body); }
.pi-flowconn { flex: none; align-self: center; width: 26px; height: 2px; background: var(--arq-teal); position: relative; }
.pi-flowconn::after { content: ""; position: absolute; right: -1px; top: -3px; border-left: 6px solid var(--arq-teal); border-top: 4px solid transparent; border-bottom: 4px solid transparent; }

/* placeholder / soft state */
.pi-placeholder { padding: 22px; text-align: center; color: var(--arq-text-muted); font-size: 13.5px; background: var(--arq-n-25); border: 1px dashed var(--arq-border); border-radius: var(--arq-radius-md); }

/* conflict banner on card */
.pi-banner { display: flex; gap: 11px; padding: 13px 15px; border-radius: var(--arq-radius-md); background: var(--arq-attention-bg); border: 1px solid var(--arq-attention-strip); margin-bottom: 14px; }
.pi-banner .pi-ic { color: var(--arq-petrol-600); flex: none; margin-top: 1px; }
.pi-banner__t { font-size: 13.5px; font-weight: 700; color: var(--arq-attention-text); }
.pi-banner__d { font-size: 12.5px; color: var(--arq-petrol-600); margin-top: 2px; }

/* ===================== Assisted review drawer ===================== */
/* --arq-brand-panel-bg e' o fundo do menu, e so' existe quando esse fundo e' ESCURO (ver
   ModernBrandingModel.PanelBackground): os textos e realces internos deste painel sao todos
   claros e fixos, entao sobre um menu claro eles sumiriam. */
.pi-drawer { position: relative; height: 100%; max-height: 100%; border-radius: var(--arq-radius-xl); overflow: hidden; background: var(--arq-brand-panel-bg, var(--arq-ai-panel)); color: var(--arq-text-on-dark); box-shadow: var(--arq-shadow-md); display: flex; flex-direction: column; }
.pi-drawer__bg { position: absolute; inset: 0; background-image: repeating-linear-gradient(135deg, rgba(255,255,255,0.04) 0 1px, transparent 1px 22px); pointer-events: none; }
/* Round 3 (Fermin): shorter head — the accept-AI button is the head's SIBLING and gets
   its breathing room from the layout.css margin rule. */
.pi-drawer__head { position: relative; padding: 10px 14px; border-bottom: 1px solid rgba(255,255,255,0.12); }
.pi-drawer__brand { display: flex; align-items: center; gap: 10px; margin-bottom: 0; }
.pi-drawer__mark { width: 26px; height: 26px; border-radius: 7px; background: var(--arq-gradient); display: flex; align-items: center; justify-content: center; color: var(--arq-deepest); flex: none; }
.pi-drawer__brand .t { font-size: 14px; font-weight: 700; color: #fff; }
.pi-drawer__brand .s { font-size: 11.5px; color: var(--arq-text-on-dark-muted); }
.pi-meter { margin-bottom: 12px; }
.pi-meter__row { display: flex; align-items: center; justify-content: space-between; font-size: 12.5px; color: var(--arq-text-on-dark-muted); margin-bottom: 6px; }
.pi-meter__row b { color: #fff; font-weight: 700; }
.pi-meter__bar { height: 7px; border-radius: 999px; background: rgba(255,255,255,0.14); overflow: hidden; }
.pi-meter__fill { height: 100%; border-radius: 999px; background: var(--arq-gradient); transition: width var(--arq-dur-slow) var(--arq-ease); }
.pi-drawer__headbtns { display: flex; gap: 8px; }
.pi-drawer__list { position: relative; padding: 14px; overflow-y: auto; display: flex; flex-direction: column; gap: 11px; flex: 1; }

.pi-decision { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); border-radius: var(--arq-radius-md); padding: 13px; }
.pi-decision--priority { border-color: var(--arq-green-300); background: rgba(73,209,107,0.10); }
.pi-decision--resolved { opacity: 0.62; }
.pi-decision__top { display: flex; align-items: center; gap: 8px; margin-bottom: 7px; }
.pi-decision__kind { font-size: 10.5px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--arq-text-on-dark-muted); }
.pi-decision__kind .pi-ic { width: 14px; height: 14px; vertical-align: -2px; margin-right: 3px; }
.pi-decision__title { font-size: 14px; font-weight: 700; color: #fff; margin-bottom: 4px; }
.pi-decision__desc { font-size: 12.5px; color: #CFE0DE; line-height: 1.45; margin-bottom: 11px; }
.pi-decision__acts { display: flex; flex-wrap: wrap; gap: 8px; }
.pi-decision__resolved { display: flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 600; color: var(--arq-green-300); }
.pi-decision .pi-control { background: rgba(255,255,255,0.10); border-color: rgba(255,255,255,0.2); color: #fff; }
.pi-decision .pi-control::placeholder { color: rgba(255,255,255,0.5); }
.pi-decision__radio { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.16); }
.pi-decision__radio .pi-radiocard__t { color: #fff; }
.pi-decision__radio .pi-radiocard__d { color: #BBD0CE; }
.pi-decision__radio.pi-radiocard--on { border-color: var(--arq-green); box-shadow: 0 0 0 3px rgba(73,209,107,0.30); }

/* ----- Guide (drawer checklist) ----- */
.pi-guidegroup__label { display: flex; align-items: center; gap: 6px; font-size: 10.5px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--arq-text-on-dark-muted); margin: 2px 2px 2px; }
.pi-guidegroup__label .pi-ic { color: var(--arq-green-300); }
.pi-guideitem { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.14); border-radius: var(--arq-radius-md); padding: 12px; }
.pi-guideitem--cur { border-color: var(--arq-green-300); background: rgba(73,209,107,0.12); }
.pi-guideitem__top { display: flex; align-items: flex-start; gap: 9px; }
.pi-guideitem__dot { width: 20px; height: 20px; border-radius: 999px; flex: none; display: flex; align-items: center; justify-content: center; margin-top: 1px; }
.pi-guideitem__dot--attn { background: var(--arq-danger, #E5484D); color: #fff; } /* Caio 9: red = missing mandatory action */
.pi-guideitem__dot--ok { background: var(--arq-green); color: var(--arq-deepest); }
.pi-guideitem__dot--opt { background: rgba(255,255,255,0.12); }
.pi-guideitem__title { font-size: 13.5px; font-weight: 700; color: #fff; }
.pi-guideitem__msg { font-size: 12px; color: #CFE0DE; margin-top: 2px; line-height: 1.4; }
.pi-guideitem__here { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--arq-deepest); background: var(--arq-green-300); border-radius: 999px; padding: 2px 7px; flex: none; }
.pi-guideitem__controls { margin-top: 11px; }
.pi-guideitem__controls:empty { display: none; }
/* Caio 10: give the pending block a red-leaning highlight so it stands out as "still needed".
   The current step keeps its green --cur treatment (scoped with :not() so it is not clobbered). */
.pi-guideitem:not(.pi-guideitem--cur) { background: rgba(229,72,77,0.12); border-color: rgba(229,72,77,0.34); }
.pi-guidefield__lbl { display: block; font-size: 12px; font-weight: 600; color: #EAF4F2; margin-bottom: 6px; }
.pi-guiderow { display: flex; align-items: center; gap: 9px; width: 100%; text-align: left; background: transparent; border: none; border-radius: var(--arq-radius-sm); padding: 7px 8px; cursor: pointer; }
.pi-guiderow:hover { background: rgba(255,255,255,0.06); }
.pi-guiderow--cur { background: rgba(255,255,255,0.05); }
.pi-guiderow__label { font-size: 13px; font-weight: 600; color: #DCEAE8; flex: 1; }
.pi-guiderow__tag { font-size: 10.5px; font-weight: 700; color: var(--arq-text-on-dark-muted); }
.pi-guiderow__go { color: var(--arq-text-on-dark-muted); display: flex; }
.pi-guiderow .pi-guideitem__dot { width: 18px; height: 18px; margin: 0; }

.pi-drawer__empty { position: relative; padding: 36px 22px; text-align: center; flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; }
.pi-drawer__empty .ring { width: 64px; height: 64px; border-radius: 999px; background: rgba(73,209,107,0.15); display: flex; align-items: center; justify-content: center; color: var(--arq-green-300); }
.pi-drawer__empty h3 { color: #fff; font-size: 17px; }
.pi-drawer__empty p { color: var(--arq-text-on-dark-muted); font-size: 13px; max-width: 230px; }
.pi-drawer__foot { position: relative; padding: 12px 14px; border-top: 1px solid rgba(255,255,255,0.12); }
.pi-drawer__disclaimer { display: flex; gap: 7px; font-size: 11.5px; color: var(--arq-text-on-dark-muted); line-height: 1.4; }
.pi-drawer__disclaimer .pi-ic { color: var(--arq-green-300); flex: none; }

/* ===================== Action bar ===================== */
.pi-actionbar { position: relative; flex: none; background: var(--arq-surface-card); border-top: 1px solid var(--arq-border); box-shadow: 0 -6px 20px rgba(5,38,40,0.06); z-index: 8; }
.pi-actionbar__in { max-width: 1320px; margin: 0 auto; padding: 12px 28px; display: flex; align-items: center; gap: 14px; }
.pi-readiness { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; }
.pi-readiness__icon { width: 32px; height: 32px; border-radius: 999px; display: flex; align-items: center; justify-content: center; flex: none; }
.pi-readiness__icon--ok { background: var(--arq-green-50); color: var(--arq-green-700); }
.pi-readiness__icon--attn { background: var(--arq-attention-bg); color: var(--arq-petrol-600); }
.pi-readiness__txt { min-width: 0; }
.pi-readiness__txt b { font-size: 13.5px; color: var(--arq-text-strong); font-weight: 700; }
.pi-readiness__reasons { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.pi-reason { font-size: 11.5px; font-weight: 600; color: var(--arq-petrol-700); background: var(--arq-n-50); border: 1px solid var(--arq-border); border-radius: 999px; padding: 1px 9px; cursor: pointer; }
.pi-reason:hover { background: var(--arq-attention-bg); }
.pi-actionbar__cluster { display: flex; align-items: center; gap: 10px; flex: none; }
.pi-revchip { display: inline-flex; align-items: center; gap: 7px; height: 40px; padding: 0 14px; border-radius: var(--arq-radius-md); background: var(--arq-attention-bg); color: var(--arq-petrol-700); border: 1px solid var(--arq-attention-strip); font-size: 13.5px; font-weight: 700; cursor: pointer; }
.pi-revchip .n { background: var(--arq-brand-menu-bg, var(--arq-petrol-700)); color: var(--arq-brand-menu-item, #fff); border-radius: 999px; min-width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; padding: 0 5px; }

/* ===================== Modal ===================== */
.pi-modal-scrim { position: fixed; inset: 0; background: rgba(5,38,40,0.45); backdrop-filter: blur(2px); display: flex; align-items: center; justify-content: center; z-index: 40; padding: 24px; }
.pi-modal { background: var(--arq-surface-card); border-radius: var(--arq-radius-xl); box-shadow: var(--arq-shadow-xl); width: 100%; max-width: 560px; max-height: 80vh; display: flex; flex-direction: column; overflow: hidden; }
.pi-modal__head { padding: 18px 20px; border-bottom: 1px solid var(--arq-border-subtle); display: flex; align-items: center; gap: 12px; }
.pi-modal__head h3 { font-size: 17px; font-weight: 700; flex: 1; }
.pi-modal__body { padding: 18px 20px; overflow-y: auto; }
.pi-modal__foot { padding: 14px 20px; border-top: 1px solid var(--arq-border-subtle); display: flex; gap: 10px; justify-content: flex-end; }
.pi-optrow { display: flex; align-items: center; gap: 11px; padding: 11px 12px; border-radius: var(--arq-radius-md); cursor: pointer; }
.pi-optrow:hover { background: var(--arq-n-50); }
.pi-optrow--on { background: var(--arq-teal-50); }
.pi-search-modal { display: flex; align-items: center; gap: 9px; height: 42px; padding: 0 13px; border: 1px solid var(--arq-border-strong); border-radius: var(--arq-radius-md); margin-bottom: 12px; }
.pi-search-modal input { border: none; outline: none; flex: 1; font-size: 14px; background: transparent; color: var(--arq-text-strong); }
.pi-pickreason { font-size: 11.5px; color: var(--arq-text-muted); margin-left: auto; }

/* ===================== Toast ===================== */
.pi-toasts { position: fixed; bottom: 88px; left: 50%; transform: translateX(-50%); z-index: 60; display: flex; flex-direction: column; gap: 10px; align-items: center; }
.pi-toast { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-radius: var(--arq-radius-md); background: var(--arq-petrol-900); color: #fff; box-shadow: var(--arq-shadow-lg); font-size: 13.5px; font-weight: 600; animation: pi-toastin var(--arq-dur-base) var(--arq-ease-out); max-width: 460px; }
.pi-toast .pi-ic { color: var(--arq-green-300); flex: none; }

/* ===================== Skeletons / shimmer ===================== */
.pi-skel { background: linear-gradient(100deg, var(--arq-n-100) 30%, var(--arq-n-50) 50%, var(--arq-n-100) 70%); background-size: 220% 100%; border-radius: var(--arq-radius-sm); animation: pi-shimmer 1.4s linear infinite; }
.pi-skel--line { height: 12px; margin: 7px 0; }
.pi-skel--block { height: 64px; }
.pi-skelcard { padding: 16px 18px; }

/* ===================== Scenario devbar ===================== */
.pi-devbar { position: fixed; left: 14px; bottom: 14px; z-index: 70; display: flex; flex-direction: column; gap: 8px; max-width: 280px; }
.pi-devbar__toggle { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px; border-radius: var(--arq-radius-pill); background: var(--arq-petrol-900); color: #fff; border: none; cursor: pointer; font-size: 13px; font-weight: 700; box-shadow: var(--arq-shadow-lg); align-self: flex-start; }
.pi-devbar__toggle .pi-ic { color: var(--arq-teal); }
.pi-devpanel { background: var(--arq-petrol-900); color: #fff; border-radius: var(--arq-radius-lg); box-shadow: var(--arq-shadow-xl); padding: 12px; max-height: 70vh; overflow-y: auto; display: none; }
.pi-devbar--open .pi-devpanel { display: block; }
.pi-devpanel h4 { font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--arq-text-on-dark-muted); margin: 10px 4px 6px; }
.pi-devpanel h4:first-child { margin-top: 2px; }
.pi-devscn { display: flex; flex-direction: column; gap: 3px; }
.pi-devscn button { text-align: left; background: transparent; border: none; color: #DCEAE8; font-size: 12.5px; padding: 7px 9px; border-radius: var(--arq-radius-sm); cursor: pointer; line-height: 1.3; }
.pi-devscn button:hover { background: rgba(255,255,255,0.08); color: #fff; }
.pi-devscn button.on { background: var(--arq-teal); color: var(--arq-deepest); font-weight: 700; }
.pi-devscn button .k { font-weight: 700; color: var(--arq-teal-200); margin-right: 7px; }
.pi-devscn button.on .k { color: var(--arq-deepest); }

/* ===================== Stepper (top, step-by-step) ===================== */
.pi-stepper { display: flex; align-items: center; gap: 1px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
.pi-stepper::-webkit-scrollbar { display: none; }
.pi-step { display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 12px; border: none; background: transparent; border-radius: var(--arq-radius-pill); cursor: pointer; font-size: 12.5px; font-weight: 600; color: var(--arq-text-muted); white-space: nowrap; }
.pi-step:hover { background: var(--arq-n-50); }
.pi-step__n { width: 20px; height: 20px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; background: var(--arq-n-100); color: var(--arq-n-600); flex: none; }
.pi-step--cur { background: var(--arq-teal-50); color: var(--arq-text-strong); }
.pi-step--cur .pi-step__n { background: var(--arq-teal); color: var(--arq-deepest); }
.pi-step--done { color: var(--arq-text-body); }
.pi-step--done .pi-step__n { background: var(--arq-green); color: var(--arq-deepest); }
.pi-step__attn { color: var(--arq-petrol-500); display: flex; }
.pi-step__sep { width: 12px; height: 1.5px; background: var(--arq-border); flex: none; }

/* Step content: cards are always open, non-collapsible */
.pi-cards--step { display: flex; flex-direction: column; gap: 12px; }
.pi-cards--step .pi-rcard__chev { display: none; }
.pi-cards--step .pi-rcard__head { cursor: default; }

.pi-stepnav { position: sticky; bottom: 0; z-index: 3; display: flex; align-items: center; gap: 12px; margin-top: 16px; padding: 12px 0 6px; border-top: 1px solid var(--arq-border); background: linear-gradient(var(--arq-surface-canvas) 30%, transparent); background: var(--arq-surface-canvas); }
.pi-stepnav__count { flex: 1; text-align: center; font-size: 12.5px; color: var(--arq-text-muted); font-weight: 600; font-variant-numeric: tabular-nums; }

/* ===================== Overview (Revisão geral) ===================== */
.pi-overview { display: flex; flex-direction: column; gap: 12px; }
.pi-overview__head { display: flex; align-items: flex-start; gap: 14px; padding: 2px 2px 6px; }
.pi-overview__head h2 { font-size: 20px; font-weight: 800; letter-spacing: -0.01em; margin-top: 2px; }
.pi-overview__head p { font-size: 13.5px; color: var(--arq-text-muted); margin-top: 4px; max-width: 560px; }
.pi-ov { background: var(--arq-surface-card); border: 1px solid var(--arq-border); border-radius: var(--arq-radius-lg); box-shadow: var(--arq-shadow-sm); }
.pi-ov__head { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--arq-border-subtle); }
.pi-ov__head h3 { font-size: 14.5px; font-weight: 700; }
.pi-ov__icon { width: 30px; height: 30px; border-radius: 8px; background: var(--arq-teal-50); color: var(--arq-teal-600); display: flex; align-items: center; justify-content: center; flex: none; }
.pi-ov__body { padding: 12px 16px; display: flex; flex-direction: column; gap: 8px; }
.pi-ov__kv { display: flex; align-items: center; gap: 12px; font-size: 13.5px; }
.pi-ov__kv .k { color: var(--arq-text-muted); display: flex; align-items: center; gap: 7px; min-width: 0; }
.pi-ov__kv .v { margin-left: auto; font-weight: 600; color: var(--arq-text-strong); text-align: right; }
.pi-ov__kv--missing .v { color: var(--arq-petrol-600); display: flex; align-items: center; gap: 5px; }
.pi-ov__muted { font-size: 13px; color: var(--arq-text-muted); }

/* ===================== Animations ===================== */
@keyframes pi-shimmer { to { background-position: -220% 0; } }
@keyframes pi-reveal { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes pi-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(73,209,107,0.0); } 50% { box-shadow: 0 0 0 6px rgba(73,209,107,0.22); } }
@keyframes pi-spin { to { transform: rotate(360deg); } }
@keyframes pi-toastin { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.pi-spin { animation: pi-spin 0.8s linear infinite; }
.pi-fadein { animation: pi-reveal var(--arq-dur-slow) var(--arq-ease); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; }
  .pi-skel { background: var(--arq-n-100); }
}

/* ============================================================================
   Views, chrome (sidebar profile / topbar icons), and HOME dashboard
   ========================================================================== */
[hidden] { display: none !important; }
.pi-publish { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.pi-home { flex: 1; min-height: 0; overflow-y: auto; background: var(--arq-surface-canvas); }
.pi-home__inner { max-width: 1240px; margin: 0 auto; padding: 26px 28px 60px; }

/* ----- Sidebar profile (top) + real menu ----- */
.pi-sidebar { overflow: hidden; }
.pi-sidebar__user--top { padding: 14px 16px; border-top: none; border-bottom: 1px solid var(--arq-brand-menu-line, rgba(255,255,255,0.10)); margin-bottom: 4px; }
.pi-sidebar__welcome { font-size: 11.5px; color: var(--arq-text-on-dark-muted); }
.pi-sidebar__name { font-size: 14.5px; font-weight: 700; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pi-sidebar__role { font-size: 12px; color: var(--arq-green-300); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pi-avatar--photo { overflow: hidden; background: var(--arq-petrol-500); }
.pi-avatar--photo img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.pi-nav { flex: 1; overflow-y: auto; padding: 18px 12px 12px; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.2) transparent; }
.pi-nav::-webkit-scrollbar { width: 7px; }
.pi-nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.16); border-radius: 999px; }
.pi-nav__chev { margin-left: auto; color: var(--arq-text-on-dark-muted); display: flex; }
.pi-nav__item--primary { background: rgba(26,198,177,0.16); color: #fff; font-weight: 700; }
.pi-nav__item--primary:hover { background: rgba(26,198,177,0.24); }
.pi-nav__item--primary .pi-ic { color: var(--arq-teal); }
.pi-nav__item--primary.pi-nav__item--active::before { content: ""; position: absolute; left: 0; top: 9px; bottom: 9px; width: 3px; border-radius: 3px; background: var(--arq-teal); }
.pi-nav__group { display: flex; flex-direction: column; padding: 2px 0 6px 30px; gap: 1px; background: var(--arq-brand-menu-surface, transparent); }
.pi-nav__sub { text-align: left; background: transparent; border: none; color: var(--arq-brand-menu-item, var(--arq-text-on-dark-muted)); font-size: 13px; padding: 6px 10px; border-radius: var(--arq-radius-sm); cursor: pointer; }
.pi-nav__sub:hover { background: var(--arq-brand-menu-hover-bg, rgba(255,255,255,0.06)); color: var(--arq-brand-menu-item-hover, #fff); }
.pi-nav__divider { height: 1px; background: var(--arq-brand-menu-line, rgba(255,255,255,0.10)); margin: 8px 4px; }
.pi-nav__chev { transition: transform var(--arq-dur-fast) var(--arq-ease); }
.pi-nav__item[aria-expanded="true"] .pi-nav__chev { transform: rotate(90deg); }
.pi-nav__sub--active { background: rgba(73,209,107,0.14); color: var(--arq-brand-menu-item-hover, #fff); }
.pi-sidebar__foot { padding: 12px 16px; border-top: 1px solid var(--arq-brand-menu-line, rgba(255,255,255,0.10)); font-size: 11.5px; color: var(--arq-brand-menu-item, var(--arq-text-on-dark-muted)); line-height: 1.5; }

/* ----- Topbar icon cluster ----- */
.pi-crumb .c--link { background: none; border: none; cursor: pointer; font-size: 15px; font-weight: 500; color: var(--arq-text-muted); padding: 0; }
.pi-crumb .c--link:hover { color: var(--arq-text-strong); text-decoration: underline; }
.pi-topbar__search kbd { font-size: 11px; color: var(--arq-text-muted); background: var(--arq-surface-card); border: 1px solid var(--arq-border); border-radius: 6px; padding: 2px 6px; }
.pi-topbar__icons { display: flex; align-items: center; gap: 2px; }
.pi-iconbadge { position: absolute; top: 4px; right: 4px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px; background: var(--arq-green); color: var(--arq-deepest); font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; border: 2px solid var(--arq-surface-card); }

/* ----- AI status badge in subhead ----- */
.pi-aibadge { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border-radius: var(--arq-radius-pill); font-size: 12.5px; font-weight: 700; white-space: nowrap; }
.pi-aibadge--on { background: var(--arq-teal-50); color: var(--arq-teal-700); }
.pi-aibadge--on .pi-ic { color: var(--arq-teal); }
.pi-aibadge--off { background: var(--arq-n-50); color: var(--arq-n-600); border: 1px solid var(--arq-border); }
/* Round 3 (Fermin): AI enabled in the central admin but the Hub is unreachable. */
.pi-aibadge--warn { background: #FFF4E0; color: #8A5A00; border: 1px solid #F0C879; }
.pi-aibadge--warn .pi-ic { color: #C98A00; }
.pi-drawer--plain .pi-drawer__mark { background: rgba(255,255,255,0.12); color: #fff; }

/* ----- Home hero + search ----- */
.pi-home__hero { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.pi-home__hero h1 { font-size: 27px; font-weight: 800; letter-spacing: -0.02em; }
.pi-home__hero p { font-size: 14.5px; color: var(--arq-text-muted); margin-top: 5px; max-width: 560px; }
.pi-home__search { display: flex; align-items: center; gap: 10px; background: var(--arq-surface-card); border: 1px solid var(--arq-border); border-radius: var(--arq-radius-lg); box-shadow: var(--arq-shadow-sm); padding: 8px 10px 8px 8px; margin-bottom: 22px; }
.pi-home__searchbtn { display: inline-flex; align-items: center; gap: 4px; height: 40px; padding: 0 12px; border-radius: var(--arq-radius-md); border: none; background: var(--arq-brand-menu-bg, var(--arq-petrol-700)); color: var(--arq-brand-menu-item, #fff); cursor: pointer; }
.pi-home__search input { flex: 1; border: none; outline: none; background: transparent; font-size: 15px; color: var(--arq-text-strong); }
.pi-home__search input::placeholder { color: var(--arq-n-400); }

/* ----- Spotlight (Nova publicação) ----- */
/* Painel grande: o interior tem texto claro fixo, entao usa a variavel com trava de menu
   escuro (a mesma do Guia de publicacao), e nao a cor do menu direto. */
.pi-home__spot { position: relative; border-radius: var(--arq-radius-xl); overflow: hidden; background: var(--arq-brand-panel-bg, var(--arq-petrol-700)); box-shadow: var(--arq-shadow-md); margin-bottom: 26px; }
.pi-home__spot-bg { position: absolute; inset: 0; background-image: repeating-linear-gradient(135deg, rgba(255,255,255,0.05) 0 1px, transparent 1px 24px); pointer-events: none; }
.pi-home__spot-in { position: relative; display: flex; align-items: center; gap: 16px; padding: 18px 22px; }
.pi-home__spot-mark { width: 44px; height: 44px; flex: none; border-radius: 12px; background: var(--arq-gradient); display: flex; align-items: center; justify-content: center; color: var(--arq-deepest); }
.pi-home__spot-t { font-size: 16px; font-weight: 700; color: #fff; }
.pi-home__spot-d { font-size: 13.5px; color: var(--arq-text-on-dark-muted); margin-top: 3px; max-width: 620px; }

.pi-home__overline { font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--arq-text-muted); margin: 4px 2px 12px; }

/* ----- Home panels + tables ----- */
.pi-home__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 22px; }
@media (max-width: 980px) { .pi-home__cols { grid-template-columns: 1fr; } }
.pi-hpanel { background: var(--arq-surface-card); border: 1px solid var(--arq-border); border-radius: var(--arq-radius-lg); box-shadow: var(--arq-shadow-sm); overflow: hidden; }
.pi-hpanel__head { display: flex; align-items: center; gap: 10px; padding: 13px 16px; border-bottom: 1px solid var(--arq-border-subtle); }
.pi-hpanel__head h3 { font-size: 14.5px; font-weight: 700; flex: 1; }
.pi-htable { width: 100%; border-collapse: collapse; }
.pi-htable th { font-size: 11px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--arq-text-muted); text-align: left; padding: 9px 16px; border-bottom: 1px solid var(--arq-border-subtle); }
.pi-htable td { padding: 10px 16px; border-bottom: 1px solid var(--arq-border-subtle); vertical-align: middle; font-size: 13.5px; }
.pi-htable tr:last-child td { border-bottom: none; }
.pi-htable td.d { color: var(--arq-text-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.pi-hlink { background: none; border: none; padding: 0; text-align: left; cursor: pointer; font-size: 13.5px; font-weight: 600; color: var(--arq-petrol-700); }
.pi-hlink:hover { color: var(--arq-teal-700); text-decoration: underline; }

/* ----- Stat cards (brand palette, no blue/purple) ----- */
.pi-home__stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 22px; }
@media (max-width: 980px) { .pi-home__stats { grid-template-columns: repeat(2, 1fr); } }
.pi-stat { border-radius: var(--arq-radius-lg); padding: 16px 18px; box-shadow: var(--arq-shadow-sm); position: relative; overflow: hidden; min-height: 116px; }
.pi-stat__ic { width: 34px; height: 34px; border-radius: var(--arq-radius-md); display: flex; align-items: center; justify-content: center; margin-bottom: 10px; }
.pi-stat__label { font-size: 11.5px; font-weight: 700; letter-spacing: 0.02em; text-transform: uppercase; opacity: 0.9; }
.pi-stat__value { font-size: 28px; font-weight: 800; letter-spacing: -0.02em; margin-top: 4px; line-height: 1.05; }
.pi-stat__hint { font-size: 12px; margin-top: 3px; opacity: 0.85; }
.pi-stat--petrol { background: var(--arq-brand-panel-bg, var(--arq-petrol-700)); color: #fff; }
.pi-stat--petrol .pi-stat__ic { background: rgba(255,255,255,0.14); color: #fff; }
.pi-stat--deep { background: var(--arq-petrol-900); color: #fff; }
.pi-stat--deep .pi-stat__ic { background: rgba(255,255,255,0.12); color: var(--arq-green-300); }
.pi-stat--teal { background: var(--arq-teal); color: var(--arq-deepest); }
.pi-stat--teal .pi-stat__ic { background: rgba(5,38,40,0.12); color: var(--arq-deepest); }
.pi-stat--green { background: var(--arq-green); color: var(--arq-deepest); }
.pi-stat--green .pi-stat__ic { background: rgba(5,38,40,0.12); color: var(--arq-deepest); }

/* ----- Info tooltip (dark, parity with the classic Bootstrap tooltip) -----
   The modern shell has no styled tooltip and otherwise falls back to the browser's plain native
   title box. Usage: add class "pi-tip" + a data-tip="..." attribute to the trigger element;
   the bubble shows below on hover/focus. */
.pi-tip { position: relative; display: inline-flex; }
.pi-tip::after, .pi-tip::before { opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .12s ease; z-index: 60; }
.pi-tip::after {
    content: attr(data-tip);
    position: absolute; top: calc(100% + 8px); left: 50%; transform: translateX(-50%);
    width: max-content; max-width: 280px; padding: 8px 10px;
    background: var(--arq-surface-chrome-deep, #052628); color: #fff;
    font-size: 12px; font-weight: 400; line-height: 1.4; text-align: left;
    white-space: normal; border-radius: 6px; box-shadow: 0 6px 20px rgba(5,38,40,0.28);
}
.pi-tip::before {
    content: ""; position: absolute; top: calc(100% + 3px); left: 50%; transform: translateX(-50%);
    border: 5px solid transparent; border-bottom-color: var(--arq-surface-chrome-deep, #052628);
}
.pi-tip:hover::after, .pi-tip:focus-visible::after,
.pi-tip:hover::before, .pi-tip:focus-visible::before { opacity: 1; visibility: visible; }

/* ----- Devbar env toggle ----- */
.pi-devtoggle { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 9px; margin-bottom: 6px; background: rgba(255,255,255,0.05); border-radius: var(--arq-radius-sm); font-size: 12.5px; font-weight: 600; color: #DCEAE8; }

/* pi-select (4110) — lista de seleção do skin moderno.

   A lista de um <select> nativo é desenhada pelo navegador FORA do documento, com o tema
   do sistema operacional: nem o tema do dmdocs nem regra alguma da página alcançam a faixa
   que destaca a opção sob o cursor. A tela clássica nunca teve esse problema porque usa o
   select2, que desenha a lista como HTML comum. Aqui a lista é HTML da própria página,
   então as cores saem dos tokens --arq-*.

   O painel é filho do <body>, e não do campo: dentro do formulário ele seria recortado
   pelos contêineres com overflow (o painel de atributos rola) e ficaria preso ao
   empilhamento do cartão. Por isso a posição é calculada em JavaScript. */

.pi-select-pop {
  position: fixed;
  /* acima do scrim do modal (40) — o seletor de papéis do fluxo abre dentro dele —
     e abaixo dos toasts (60), que precisam continuar visíveis por cima. */
  z-index: 50;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-sizing: border-box;
  background: var(--arq-surface-card);
  border: 1px solid var(--arq-border);
  border-radius: var(--arq-radius-md);
  box-shadow: var(--arq-shadow-lg);
  font-family: var(--arq-font);
  font-size: 14px;
  color: var(--arq-text-strong);
}

.pi-select-pop__search {
  flex: none;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--arq-border-subtle);
  color: var(--arq-text-muted);
}

.pi-select-pop__search input {
  flex: 1;
  min-width: 0;
  border: none;
  outline: none;
  background: none;
  font-family: inherit;
  font-size: 13.5px;
  color: var(--arq-text-strong);
}

.pi-select-pop__list {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 6px;
  outline: none;
}

.pi-select-pop__opt {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 11px;
  border-radius: var(--arq-radius-sm);
  cursor: pointer;
  line-height: 1.3;
}

.pi-select-pop__opt--sel { background: var(--arq-teal-50); font-weight: 600; }

.pi-select-pop__opt--active,
.pi-select-pop__opt--active.pi-select-pop__opt--sel {
  background: var(--arq-teal);
  color: var(--arq-text-on-brand);
}

.pi-select-pop__opt--off { color: var(--arq-text-muted); cursor: default; }
.pi-select-pop__opt--off.pi-select-pop__opt--active { background: var(--arq-n-50); color: var(--arq-text-muted); }

.pi-select-pop__check { flex: none; width: 16px; display: flex; align-items: center; justify-content: center; }
.pi-select-pop__txt { flex: 1; min-width: 0; }

.pi-select-pop__empty { padding: 14px 12px; font-size: 13px; color: var(--arq-text-muted); text-align: center; }

/* O campo continua sendo o <select> nativo: ele é o gatilho, o valor e o que o leitor de
   tela anuncia. Enquanto o painel está aberto o foco vive lá dentro, então o campo perde
   o anel de foco — este estado o devolve. */
select.pi-control[aria-expanded="true"] {
  border-color: var(--arq-teal);
  box-shadow: 0 0 0 3px rgba(26,198,177,0.18);
}

/*
 * Modern shell layout extensions (ticket 3378 / ADR-0002).
 * Sidebar collapse + responsive shell + user chip (avatar dropdown in the topbar).
 *
 * Collapse works by overriding the --arq-sidebar-w token (consumed once by
 * .pi-sidebar in screen.css); any future consumer of the token inherits the
 * collapsed width automatically. The collapse class lives on <html> so the
 * pre-paint script in _LayoutModern can apply it before first render (no FOUC).
 * Collapse rules are scoped to min-width:769px — below that the sidebar is an
 * off-canvas drawer (html.pi-nav-open) and is always full width.
 * z-index ladder (screen.css): 40 modal scrim, 60 toasts, 70 devbar —
 * user menu = 50, off-canvas scrim = 75, off-canvas sidebar = 80.
 */

.pi-sidebar { transition: width var(--arq-dur-base, .2s) var(--arq-ease, ease); }
@media (prefers-reduced-motion: reduce) { .pi-sidebar { transition: none; } }

/* ===== Modal fix: don't trap view-embedded fixed modals below the backdrop =====
 * .pi-main is display:flex, which makes the classic .page-content a FLEX ITEM. A flex
 * item with z-index != auto creates a stacking context even when position is static
 * (CSS spec). The classic .page-content carries z-index:6, so a view modal
 * (position:fixed, e.g. #modal-forms / "Novo usuário") was confined to that context and
 * rendered BELOW the body-level .modal-backdrop (z 1040) -> the backdrop swallowed every
 * click and the modal looked frozen (couldn't type or close). Neutralizing the z-index
 * removes the stacking context so Bootstrap's ladder holds (modal 1050 > backdrop 1040).
 * Classic skin is unaffected: there the body/main are not flex, so z-index:6 is inert.
 * 3760: .page-container carries z-index:10 from the classic Less and is ALSO a flex item
 * of .pi-main — same trap, seen on the Workflow step modal (dimmed/unusable under the
 * backdrop). Neutralize both containment ancestors. */
.pi-main .page-content, .pi-main .page-container { z-index: auto; }

/* ===== Collapsed sidebar (desktop / tablet) ===== */
@media (min-width: 769px) {
    html.pi-nav-collapsed { --arq-sidebar-w: 64px; }

    /* Hide item labels, foot, logo wordmark — AND any OPEN submenu group. An
       auto-opened group (.pi-nav__group without [hidden], e.g. "Documents"
       expanded on /Search) is display:flex, so its .pi-nav__sub links render at
       full width inside the 64px rail and overflow, breaking the layout. Re-hide
       it here: html.pi-nav-collapsed .pi-nav__group (0,2,1) beats the base
       .pi-nav__group{display:flex} (0,1,0). Expanding the sidebar restores it. */
    html.pi-nav-collapsed .pi-nav__item > span,
    html.pi-nav-collapsed .pi-nav__group,
    html.pi-nav-collapsed .pi-sidebar__foot,
    html.pi-nav-collapsed .pi-sidebar__logo img {
        display: none;
    }

    html.pi-nav-collapsed .pi-sidebar__logo {
        /* compact brand mark when collapsed */
        background: url(/Content/modern/ds/assets/app-icon-petrol.svg) no-repeat center / 28px 28px;
        min-height: 44px;
    }

    html.pi-nav-collapsed .pi-nav__item {
        justify-content: center;
        padding-left: 0;
        padding-right: 0;
    }
}

/* ===== Topbar: nav toggle + user chip ===== */
.pi-navtoggle { flex: none; margin-right: 4px; }

/* 3775: unread-count badge on topbar tray icons (bell). Small red pill anchored to
   the icon's top-right, ringed in the topbar surface so it reads on the light chrome. */
.pi-topbar__icons .pi-iconbtn-chrome { position: relative; }
.pi-chrome-badge {
    position: absolute;
    top: 1px;
    right: 1px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    box-sizing: border-box;
    border-radius: 999px;
    background: var(--arq-danger, #E5484D);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    line-height: 16px;
    text-align: center;
    box-shadow: 0 0 0 2px var(--arq-surface-card, #fff);
    pointer-events: none;
}
.pi-chrome-badge[hidden] { display: none; }

.pi-userchip { position: relative; display: flex; align-items: center; }

.pi-userchip__btn {
    border: 0;
    padding: 0;
    background: transparent;
    cursor: pointer;
    border-radius: 50%;
    display: flex;
    align-items: center;
}
.pi-userchip__btn:focus-visible { outline: 2px solid var(--arq-focus, #B5E048); outline-offset: 2px; }

.pi-userchip .pi-avatar {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 12px;
    overflow: hidden;
}
.pi-userchip .pi-avatar img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    object-fit: cover;
}

.pi-userchip__menu {
    position: absolute;
    right: 0;
    top: calc(100% + 10px);
    min-width: 264px;
    background: var(--arq-surface-card, #fff);
    border: 1px solid var(--arq-border, #DCE4E2);
    border-radius: var(--arq-radius-lg, 14px);
    box-shadow: var(--arq-shadow-lg, 0 14px 40px rgba(5, 38, 40, .16));
    padding: 6px;
    z-index: 50;
}

.pi-userchip__head {
    padding: 10px 12px 8px 12px;
    border-bottom: 1px solid var(--arq-border, #DCE4E2);
    margin-bottom: 6px;
}
.pi-userchip__name { font-weight: 700; color: var(--arq-text-strong, #052628); }
.pi-userchip__role, .pi-userchip__mail {
    font-size: 12px;
    color: var(--arq-text-muted, #5C6B68);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pi-userchip__item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    border-radius: 8px;
    color: var(--arq-text-strong, #052628);
    text-decoration: none;
    font-size: 13.5px;
    cursor: pointer;
}
.pi-userchip__item:hover { background: var(--arq-n-50, #F2F6F5); text-decoration: none; }

/* ===== Tablet (<=1024px): JS defaults to collapsed; class-driven like desktop ===== */

/* ===== Smartphone (<=768px): off-canvas sidebar ===== */
@media (max-width: 768px) {
    .pi-sidebar {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        width: 248px;
        max-width: 84vw;
        transform: translateX(-105%);
        transition: transform var(--arq-dur-base, .2s) var(--arq-ease, ease);
        z-index: 80;
    }
    html.pi-nav-open .pi-sidebar { transform: none; }

    .pi-nav-scrim {
        position: fixed;
        inset: 0;
        background: rgba(5, 38, 40, .45);
        z-index: 75;
    }

    .pi-topbar__search { display: none; }
    .pi-topbar { padding-left: 10px; padding-right: 10px; }
    .pi-crumb { min-width: 0; overflow: hidden; }
    .pi-crumb .c.last { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .pi-userchip__menu { position: fixed; right: 8px; left: 8px; top: 64px; min-width: 0; }
}
/* ===== Smart Publishing polish (test feedback round 1) ===== */
/* #4: attribute field header wraps gracefully (long names + status pills) */
.pi-field__label { flex-wrap: wrap; row-gap: 3px; }
.pi-field__label .pi-pill, .pi-field__src .pi-pill { white-space: nowrap; }
.pi-field__req { white-space: nowrap; }
/* #13 (round 3): overview rows — label left, value right; values wrap at WORD
   boundaries (overflow-wrap:anywhere shredded short metas letter-by-letter
   whenever a long sibling squeezed the flex item). The label must NOT be
   shrinkable (flex-shrink + the base min-width:0 let it collapse under its
   text, which then painted UNDER the value) — cap it at 48% and wrap instead. */
.pi-ov__kv { align-items: flex-start; }
.pi-ov__kv .k { flex: 0 0 auto; max-width: 48%; overflow-wrap: break-word; }
.pi-ov__kv .v { flex: 1 1 auto; min-width: 0; overflow-wrap: break-word; }
/* file rows: the NAME truncates with ellipsis; size/indicator stay whole, same line */
.pi-ov__kv--file .k { flex: 1 1 auto; min-width: 0; max-width: none; }
.pi-ov__kv--file .k .nm { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pi-ov__kv--file .k .pi-pill { flex: none; }
.pi-ov__kv--file .v { flex: none; white-space: nowrap; }

/* Selector modals (pickers, invites, related, attach, resume, roles): FIXED height
   so filtering never resizes/jumps the dialog — the scrim already centers it.
   The body fills the fixed box and scrolls; short result lists leave blank space. */
.pi-modal--picker { height: min(620px, 80vh); }
.pi-modal--picker .pi-modal__body { flex: 1 1 auto; min-height: 0; }

/* ====== Layout rework (owner items 5/6/9 + round 23): slim canvas, rail TAB ====== */
/* wider screen overall: the center gets the room (owner: enlarge horizontally) */
.pi-body__inner, .pi-subhead__inner { max-width: 1760px; }
/* compact title bar (owner: more vertical room) */
.pi-subhead__inner { padding: 7px 28px 6px; }
.pi-screenhead { margin-bottom: 0; gap: 12px; }
/* PO: the AI badge stays on the same line as the band subtitle but pushed to the far
   right — the title block grows to take the free space. */
.pi-screenhead__title { flex: 1; min-width: 0; }
.pi-screenhead__title h1 { font-size: 18px; }
.pi-screenhead__title p { font-size: 12px; margin-top: 0; }
/* files column: wide enough for the source tabs to sit on ONE line */
.pi-grid { grid-template-columns: minmax(280px, 318px) minmax(0, 1fr); }
/* compact tabs: text only (icons hidden), smaller type — the three labels fit */
.pi-canvas__sources { flex-wrap: nowrap; }
.pi-canvas__sources .pi-srctab { font-size: 12px; gap: 4px; padding: 0 4px; min-width: 0; white-space: nowrap; }
.pi-canvas__sources .pi-srctab svg { display: none; }
.pi-canvas .pi-filechip__thumb { max-height: 150px; }
/* workarea: center | guide | rail tab (far right, opens on click) */
/* Fermin 20: trim the guide column (302 -> 268) to give the main form more room. */
.pi-workarea { grid-template-columns: minmax(0, 1fr) 268px auto; }

/* PO redesign (start screen): the empty-state 4-card chooser uses the FULL width — the
   cards sit side by side. Collapse the canvas|workarea split, hide the empty workarea
   placeholder, and let the canvas grow (no inner scroll) while the chooser is showing. */
#pi-view-publish.pi-mode-chooser .pi-grid { grid-template-columns: 1fr; }
#pi-view-publish.pi-mode-chooser .pi-workarea { display: none; }
#pi-view-publish.pi-mode-chooser .pi-canvas { overflow-y: auto; height: 100%; padding-right: 0; }
/* 3771: the start chooser is not a started publication — hide the bottom action bar
   (Descartar / Salvar rascunho / Publicar) until an intake begins. */
#pi-view-publish.pi-mode-chooser .pi-actionbar { display: none; }

/* #10 (Fermin): once a publication has files, remove the left attachments panel and let the
   center form + guide span the full width — the miniatura + preview move into the Arquivos
   card. Only the files list moved (the duplicate filmstrip disappears with the panel, which
   also resolves Caio 2 "PDF icon in two places" and Caio 3 "Principal pill"). */
#pi-view-publish.pi-mode-files .pi-grid { grid-template-columns: 1fr; }
#pi-view-publish.pi-mode-files .pi-canvas { display: none; }

/* #10 (Fermin): on-demand miniatura — a popover peeks the file preview on hover over the
   thumb; the eye button opens the full preview in the viewer modal. */
.pi-thumbwrap { position: relative; display: inline-flex; flex: none; }
.pi-thumbpop { position: absolute; left: 0; top: calc(100% + 6px); z-index: 40; width: 300px;
    padding: 10px; border-radius: var(--arq-radius-md, 10px); background: var(--arq-surface-card, #fff);
    box-shadow: 0 12px 34px rgba(9,63,73,0.22); border: 1px solid var(--arq-n-200, #e4e9ea);
    display: none; pointer-events: none; }
.pi-thumbwrap:hover .pi-thumbpop, .pi-thumbwrap:focus-within .pi-thumbpop { display: block; }
.pi-thumbpop img { width: 100%; height: 230px; object-fit: contain; background: #fff; border-radius: 6px; display: block; }
.pi-thumbpop__ph { display: flex; align-items: center; justify-content: center; height: 230px;
    background: var(--arq-n-100, #f4f6f6); border-radius: 6px; }
.pi-thumbpop__ph .pi-fthumb { transform: scale(1.9); }
.pi-thumbpop__nm { display: block; margin-top: 6px; font-size: 11.5px; color: var(--arq-text-muted, #667);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pi-rail-wrap { display: flex; align-items: stretch; gap: 6px; }
.pi-rail__tab { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 14px 7px; border: 1px solid var(--arq-border); background: var(--arq-surface-card); border-radius: 12px; cursor: pointer; color: var(--arq-text); font: inherit; font-size: 11.5px; }
.pi-rail__tab:hover { border-color: var(--arq-petrol-500); color: var(--arq-petrol-600); }
.pi-rail__tabtx { writing-mode: vertical-rl; text-orientation: mixed; letter-spacing: .4px; font-weight: 600; }
.pi-rail-wrap.is-open .pi-rail__tab { background: var(--arq-petrol-500); color: #fff; border-color: var(--arq-petrol-500); }
.pi-rail { display: flex; flex-direction: column; gap: 4px; padding: 10px 6px; width: 168px; background: var(--arq-surface-card); border: 1px solid var(--arq-border); border-radius: var(--arq-radius-xl); overflow-y: auto; }
.pi-rail__step { display: flex; align-items: center; gap: 9px; padding: 9px 10px; border: 0; background: transparent; border-radius: 10px; cursor: pointer; text-align: left; color: var(--arq-text); font: inherit; font-size: 12.5px; }
.pi-rail__step:hover:not(.pi-rail__step--cur) { background: var(--arq-petrol-50, #e7f1f1); color: var(--arq-petrol-600); }
.pi-rail__step--cur { background: var(--arq-petrol-500); color: #fff; font-weight: 600; }
.pi-rail__step--cur:hover { background: var(--arq-petrol-600, var(--arq-petrol-500)); color: #fff; }
.pi-rail__step--cur .pi-rail__opt { color: rgba(255,255,255,.75); }
.pi-rail__ic { flex: none; display: inline-flex; }
.pi-rail__tx { display: flex; flex-direction: column; min-width: 0; }
.pi-rail__lb { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pi-rail__opt { font-size: 10px; color: var(--arq-text-muted); }
@media (max-width: 1024px) {
  .pi-workarea { grid-template-columns: 1fr; }
  .pi-rail-wrap { order: -1; }
  .pi-rail { width: auto; flex-direction: row; overflow-x: auto; flex: 1; }
  .pi-rail__step { flex: none; }
  .pi-rail__tab { flex-direction: row; padding: 8px 12px; }
  .pi-rail__tabtx { writing-mode: horizontal-tb; }
}
/* attachment rows: NAME truncated alone on line 1; size + pill + actions on line 2 */
.pi-filechip .pi-filechip__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.pi-filerow__l2 { display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; }
.pi-filerow__l2 .pi-pill { flex: none; }
.pi-filerow__l2 .pi-iconbtn-mini { flex: none; }
.pi-filerow__sz { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* "view document" overlay icon on the preview sheet (top-right) */
.pi-preview.pi-card { position: relative; }
.pi-viewbtn { position: absolute; top: 10px; right: 10px; z-index: 2; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 9px; background: var(--arq-surface-card); border: 1px solid var(--arq-border); color: var(--arq-petrol-600); box-shadow: var(--arq-shadow-sm, 0 2px 8px rgba(5,38,40,.10)); }
.pi-viewbtn:hover { background: var(--arq-petrol-500); color: #fff; border-color: var(--arq-petrol-500); }
/* guide: the accept-all CTA must not touch the panel edges NOR the head above it —
   Round 3 (Fermin): the button sits OUTSIDE .pi-drawer__head (its sibling), so the
   vertical breathing room lives here. */
.pi-drawer [data-action="accept-all"] { width: calc(100% - 28px); margin: 12px 14px 2px; }
/* AI alternative-suggestion chips (P2-polish) — one-click apply of a runner-up */
.pi-altsug { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; padding: 9px 12px; border: 1px solid var(--arq-border); border-radius: 10px; background: var(--arq-surface-card); cursor: pointer; font: inherit; color: var(--arq-text); }
.pi-altsug:hover { border-color: var(--arq-petrol-500); background: var(--arq-petrol-50, #e7f1f1); }
.pi-altsug__txt { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0; }
.pi-altsug__tipo { font-weight: 600; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pi-altsug__loc { font-size: 11.5px; color: var(--arq-text-muted); display: inline-flex; align-items: center; gap: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pi-altsug__go { flex: none; color: var(--arq-petrol-500); }
/* guide flash when the footer handle is clicked */
@keyframes piFlash { 0% { box-shadow: 0 0 0 3px var(--arq-teal); } 100% { box-shadow: none; } }
.pi-flash { animation: piFlash 1.1s ease-out 1; }

/* 3774 (reopened): the round-2 rule here pinned a 25px box at top:0, which parked the
   circle's center 3.5px ABOVE the .dd-handle centerline — the exact reopened complaint.
   Measured live on /StorageLocation (modern skin): with the pinned 25px box the button
   needs top:3.5px for a 0px center delta against the row. Scoped to .pi-main; the admin
   areas' _LayoutModern trees carry their own !important restyle and are unaffected. */
.pi-main .dd-item > button { top: 3.5px; height: 25px; box-sizing: border-box; border: 0; }
/* The vendor draws the +/− as TEXT (28px, left:5%/top:-2px), calibrated for the classic
   skin's font. The modern chrome resolves a different font here (Arial 700), so the same
   offsets land the glyph off-center and heavier than classic. Draw it geometrically
   instead — two hairline bars centered by transform, immune to font metrics. */
.pi-main .dd-item > button:before {
    content: "";
    left: 50%; top: 50%; width: 13px; height: 13px;
    transform: translate(-50%, -50%);
    background:
        linear-gradient(#fff, #fff) center / 13px 3px no-repeat,
        linear-gradient(#fff, #fff) center / 3px 13px no-repeat;
}
/* Minus is a shorter, single horizontal bar — matches the classic skin where the '-' glyph reads
   narrower than the '+'. Same 3px weight so both signs stay bold like the classic. */
.pi-main .dd-item > button[data-action="collapse"]:before {
    content: "";
    background: linear-gradient(#fff, #fff) center / 10px 3px no-repeat;
}

/* Caio 7 + Fermin: per-file display options collapsed behind a gear, but INSIDE the file band
   (in the empty space between the name and the right-hand actions) — the checkboxes open as a
   floating dropdown, not a block below the chip. Overrides the base .pi-fileopts box. */
.pi-fileopts--inrow { position: relative; flex: none; display: inline-flex; margin: 0; padding: 0;
    border: 0; background: none; }
.pi-fileopts__btn { display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
    padding: 5px 10px; border: 1px solid var(--arq-border-subtle); border-radius: 999px;
    background: var(--arq-n-50); font-size: 12px; color: var(--arq-text-muted, #667); white-space: nowrap; }
.pi-fileopts__btn:hover { color: var(--arq-text-strong); border-color: var(--arq-border-strong); }
.pi-fileopts--open .pi-fileopts__btn { color: var(--arq-text-strong); border-color: var(--arq-teal); }
.pi-fileopts__menu { position: absolute; right: 0; top: calc(100% + 6px); z-index: 40; width: 258px;
    padding: 10px 12px; display: flex; flex-direction: column; gap: 10px; border-radius: var(--arq-radius-md, 10px);
    background: var(--arq-surface-card, #fff); box-shadow: 0 12px 34px rgba(9,63,73,0.20);
    border: 1px solid var(--arq-n-200, #e4e9ea); }

/* Fermin: the "ready" state is a green check icon in the same 28x28 slot as the "Tornar
   principal" icon, so it is an indicator (not a button) — no hover affordance. */
.pi-statusok { color: var(--arq-green, #2fa96a); cursor: default; }
.pi-statusok:hover { background: transparent; color: var(--arq-green, #2fa96a); }
/* Fermin: attention (Revisar / Sem local) as a red alert icon in the same slot — indicator,
   not a button. */
.pi-statusattn { color: var(--arq-danger, #E5484D); cursor: default; }
.pi-statusattn:hover { background: transparent; color: var(--arq-danger, #E5484D); }
/* Fermin: breathing room between the attachment tiles (they were flush against each other). */
#card-arquivos .pi-filechip { margin-bottom: 8px; }

/* ADR-0005: full-screen drop overlay of the global drag-drop -> inbox module
   (Content/modern/inbox-dropzone.js). Reuses the dropzone visual vocabulary
   (dashed teal target) at page scale; pointer-events:none keeps drag events
   flowing to the document handlers underneath. */
.pi-inboxdrop { position: fixed; inset: 0; z-index: 70; display: flex; align-items: center; justify-content: center; background: rgba(5, 38, 40, .45); pointer-events: none; }
.pi-inboxdrop[hidden] { display: none; }
.pi-inboxdrop__card { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; max-width: 460px; padding: 34px 42px; border: 2px dashed var(--arq-teal, #2BB3A3); border-radius: var(--arq-radius-xl, 16px); background: var(--arq-surface-card, #fff); color: var(--arq-petrol-600, #0E5460); box-shadow: var(--arq-shadow-lg, 0 18px 50px rgba(5, 38, 40, .28)); }
.pi-inboxdrop__card b { font-size: 17px; color: var(--arq-text-strong, #14333A); }
.pi-inboxdrop__card span { font-size: 13px; color: var(--arq-text-muted, #6C8288); }
/* ============================================================================
   Modern dashboard - ModernHome/Index (ticket 3378 / ADR-0002).

   Authored to the UNIFIED MODERN DASHBOARD CONTRACT (view + dashboard.js +
   this file all agree on one set of class / [data-dash*] / data-attr names).
   Mirrors the Arqueum visual language of Content/modern/smart-publish/screen.css
   (pi-*) in a parallel dash-* namespace, using ONLY --arq-* tokens (loaded
   earlier in the ~/Content/modernStyle bundle:
     ds/tokens -> smart-publish/tokens.css -> screen.css -> layout.css -> THIS FILE).

   Hard rules (same as tokens.css): flat - no gradients on surfaces, no shadows
   beyond the soft petrol-tinted --arq-shadow-* set; petrol/teal/green palette,
   NO blue. The ONLY semantic colors are the SLA states (green=on-time,
   amber=near, red=overdue) - fixed hex per the contract (#639922 / #BA7517 /
   #E24B4A), used ONLY on the SLA bar and SLA donut.

   DOM contract recap (every selector below is emitted by the view or the JS):
     .dash > .dash__inner ......................... page scaffold (scrolls)
     .dash-hero > .dash-hero__body (.dash-hero__greeting .nm, .dash-hero__pending)
                 + .dash-hero__cta / .dash-hero__cta--ghost
     .dash-kpis[data-dash=counters] > .dash-kpi.dash-kpi--<v>[data-kpi]
                 > .dash-kpi__icon + .dash-kpi__body (.dash-kpi__num[data-dash-num]
                 + .dash-kpi__label)
     .dash-sec > .dash-sec__head (.dash-sec__title + .dash-sec__more)
     .dash-grid > .dash-card[data-dash] > .dash-card__head (.dash-card__ic +
                 .dash-card__title) + .dash-card__body[data-dash-body]
     .dash-pending (2-col) > [data-dash=pending] list + .dash-pending-sla
                 (.dash-donut + .dash-legend)
     row: .dash-row (.dash-prow) > .dash-row__icon? + .dash-row__body
                 (.dash-row__title + .dash-row__meta) + .dash-sla?
     .dash-notifications[data-dash=notifications] (rows .dash-row--<tone>)
     .dash-admin-kpis > .dash-akpi (.dash-akpi__num + .dash-akpi__label)
     .dash-reports > .dash-rtile > .dash-rtile__ic + .dash-rtile__tx (.dash-rtile__t)
   ========================================================================== */

/* ===================== Page scaffold ===================== */
/* The dashboard is @RenderBody inside .pi-main (after the fixed .pi-topbar).
   Unlike the SmartPublish screen (.pi-body locks panes with overflow:hidden),
   the dashboard scrolls the whole page, so it uses its own .dash scaffold. */
.dash {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  background: var(--arq-surface-canvas);
}
.dash__inner {
  max-width: 1320px;
  margin: 0 auto;
  padding: 24px 28px 56px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* ===================== Hero ===================== */
.dash-hero {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
  padding: 22px 24px;
  background: var(--arq-surface-card);
  border: 1px solid var(--arq-border);
  border-radius: var(--arq-radius-xl);
  box-shadow: var(--arq-shadow-sm);
}
.dash-hero__body {
  flex: 1 1 320px;
  min-width: 0;
}
.dash-hero__greeting {
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--arq-text-strong);
  line-height: 1.2;
}
.dash-hero__greeting .nm {
  /* the server-rendered @currentUser.MinName - keep it on-brand petrol */
  color: var(--arq-petrol-600);
}
.dash-hero__pending {
  display: block;
  margin-top: 6px;
  font-size: 14px;
  color: var(--arq-text-muted);
  min-height: 20px; /* reserve room so the line doesn't jump when js fills it */
}
.dash-hero__pending b {
  font-weight: 700;
  color: var(--arq-text-body);
}
.dash-hero__cta {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  height: 46px;
  padding: 0 22px;
  border: none;
  border-radius: var(--arq-radius-md);
  background: var(--arq-teal);
  color: var(--arq-deepest);
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--arq-dur-fast) var(--arq-ease);
}
.dash-hero__cta:hover { background: var(--arq-teal-500); text-decoration: none; }
.dash-hero__cta svg { flex: none; }
.dash-hero__cta--ghost {
  background: var(--arq-surface-card);
  color: var(--arq-text-body);
  border: 1px solid var(--arq-border-strong);
}
.dash-hero__cta--ghost:hover { background: var(--arq-n-50); }

/* ===================== Section shell ===================== */
.dash-sec { display: flex; flex-direction: column; gap: 12px; }
.dash-sec__head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  min-height: 28px;
}
.dash-sec__title {
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--arq-text-strong);
}
.dash-sec__sub { font-size: 13px; color: var(--arq-text-muted); }
.dash-sec__more {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--arq-petrol-700);
  text-decoration: none;
  padding: 4px 6px;
  border-radius: var(--arq-radius-sm);
}
.dash-sec__more:hover { background: var(--arq-n-50); text-decoration: none; }
.dash-sec__more svg { flex: none; }

/* ===================== KPI cards row ===================== */
.dash-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 14px;
}
.dash-kpi {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 16px 18px;
  background: var(--arq-surface-card);
  border: 1px solid var(--arq-border);
  border-radius: var(--arq-radius-lg);
  box-shadow: var(--arq-shadow-sm);
  text-decoration: none;
  color: inherit;
  cursor: pointer;
  transition: box-shadow var(--arq-dur-base) var(--arq-ease),
              border-color var(--arq-dur-base) var(--arq-ease),
              transform var(--arq-dur-base) var(--arq-ease);
}
.dash-kpi:hover {
  box-shadow: var(--arq-shadow-md);
  border-color: var(--arq-teal-300);
  transform: translateY(-1px);
  text-decoration: none;
}
.dash-kpi__top {
  display: flex;
  align-items: center;
  gap: 12px;
}
.dash-kpi__icon {
  width: 44px;
  height: 44px;
  flex: none;
  border-radius: var(--arq-radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--arq-teal-50);
  color: var(--arq-teal-600);
}
.dash-kpi__icon svg { width: 22px; height: 22px; }
/* per-card icon accents (still in-family - petrol/teal/green/neutral, no blue) */
.dash-kpi--pendencias  .dash-kpi__icon { background: var(--arq-attention-bg); color: var(--arq-petrol-600); }
.dash-kpi--rascunhos   .dash-kpi__icon { background: var(--arq-n-50);         color: var(--arq-petrol-600); }
.dash-kpi--notificacoes .dash-kpi__icon { background: var(--arq-teal-50);     color: var(--arq-teal-600); }
.dash-kpi--inbox       .dash-kpi__icon { background: var(--arq-green-50);     color: var(--arq-green-700); }
.dash-kpi--compartilhados .dash-kpi__icon { background: var(--arq-n-50);      color: var(--arq-petrol-500); }
.dash-kpi--relatorios  .dash-kpi__icon { background: var(--arq-green-50);     color: var(--arq-green-700); }
.dash-kpi__body { min-width: 0; }
.dash-kpi__num {
  font-size: 28px;
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--arq-text-strong);
  font-variant-numeric: tabular-nums;
}
.dash-kpi__label {
  font-size: 13px;
  font-weight: 600;
  color: var(--arq-text-muted);
  text-align: center;
  white-space: normal;
}

/* ===================== Generic card / list ===================== */
.dash-card {
  background: var(--arq-surface-card);
  border: 1px solid var(--arq-border);
  border-radius: var(--arq-radius-lg);
  box-shadow: var(--arq-shadow-sm);
  overflow: hidden;
}
.dash-card__head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 13px 16px;
  border-bottom: 1px solid var(--arq-border-subtle);
}
.dash-card__head .dash-card__title {
  font-size: 14px;
  font-weight: 700;
  color: var(--arq-text-strong);
  flex: 1;
  min-width: 0;
}
.dash-card__head .dash-card__ic { color: var(--arq-petrol-500); flex: none; display: flex; }
.dash-card__head .dash-card__count {
  font-size: 12px;
  font-weight: 700;
  color: var(--arq-petrol-700);
  background: var(--arq-n-50);
  border: 1px solid var(--arq-border);
  border-radius: var(--arq-radius-pill);
  padding: 1px 9px;
}
.dash-card__body { padding: 6px; }

/* A row inside any list card (recent/drafts/published/favorites/models/
   pending/notifications/ack). Rows are usually <a> links. */
.dash-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 11px;
  border-radius: var(--arq-radius-md);
  text-decoration: none;
  color: inherit;
  cursor: pointer;
  transition: background var(--arq-dur-fast) var(--arq-ease);
}
.dash-row + .dash-row { border-top: 1px solid var(--arq-border-subtle); border-radius: 0; }
.dash-row:hover { background: var(--arq-n-50); text-decoration: none; }
.dash-row__icon {
  width: 36px;
  height: 36px;
  flex: none;
  border-radius: var(--arq-radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--arq-n-50);
  color: var(--arq-petrol-500);
}
.dash-row__icon svg { width: 18px; height: 18px; }
.dash-row__body { flex: 1; min-width: 0; }
.dash-row__title {
  font-size: 14px;
  font-weight: 600;
  color: var(--arq-text-strong);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dash-row__meta {
  font-size: 12px;
  color: var(--arq-text-muted);
  margin-top: 1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dash-row__meta .sep { padding: 0 5px; color: var(--arq-n-300); }
.dash-row__aside {
  flex: none;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}
.dash-row__time { font-size: 11.5px; color: var(--arq-text-muted); white-space: nowrap; }
.dash-row__go { color: var(--arq-text-muted); display: flex; flex: none; }

/* ===================== "Continuar de onde parei" - card grid ===================== */
.dash-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 16px;
  align-items: stretch;
}
/* 4018: card-count-aware columns. auto-fit above is the fallback for a .dash-grid without
   data-cards; with it we pick a track count that divides the cards evenly, so the last row is
   never a single orphan (Favoritos alone). The view emits data-cards = number of .dash-card
   children. The breakpoints are viewport-based but the grid is not: usable width is
   viewport - 248px (--arq-sidebar-w) - 56px (.dash__inner padding), capped at 1264px; below
   1024px layout.css turns the sidebar into an off-canvas drawer. */
.dash-grid[data-cards] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dash-grid[data-cards="3"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* 4 tracks only where they still clear the ~300px card minimum (1561 - 304 = 1257px). */
@media (min-width: 1561px) {
  .dash-grid[data-cards="4"] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
/* 3 cards can only stay balanced as 3-up or 1-up - never 2 + orphan. */
@media (max-width: 1200px) {
  .dash-grid[data-cards="3"] { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 1024px) {
  .dash-grid[data-cards] { grid-template-columns: minmax(0, 1fr); }
}

/* 3378: equal-height empty cards + centered "sem informacoes" indicator */
.dash-grid > .dash-card { display: flex; flex-direction: column; }
.dash-grid > .dash-card > .dash-card__body { flex: 1 1 auto; display: flex; flex-direction: column; }
.dash-grid .dash-empty { flex: 1 1 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; margin: 0; }

/* ===================== Pending block ("Aguardando minha ação") ===================== */
/* Two-column: the Top-5 list card (left) + an SLA donut summary (right). */
.dash-pending {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 16px;
  align-items: start;
}

/* 3378: dashboard top row — "Aguardando minha ação" (65%) + "Termos de ciência pendentes" (35%),
   side by side and EQUAL height (align-items:stretch is mutual: each matches the taller). */
.dash-toprow { display: grid; grid-template-columns: minmax(0, 65fr) minmax(0, 35fr); gap: 16px; align-items: stretch; }
/* 4018: only one of the two panels rendered (Termo de Aceite off in ADM Central, or workflow
   off) - collapse to a single full-width track instead of leaving the other one empty. The
   :has() rule is a safety net for a cached view that still lacks the modifier class. */
.dash-toprow--single { grid-template-columns: minmax(0, 1fr); }
.dash-toprow:has(> .dash-sec:only-child) { grid-template-columns: minmax(0, 1fr); }
.dash-toprow > .dash-sec { min-height: 0; }
.dash-toprow > .dash-sec > .dash-card { flex: 1 1 auto; }
/* SLA donut INSIDE the pending listing card, top-right corner (no separate box); the list keeps a
   right gutter so its rows do not run under the donut. */
.dash-pending-card { position: relative; }
/* 3814: the absolute sla block (donut 88 + gap + 3-item legend ~ 160px tall) contributes no
   height to the card, and .dash-card's overflow:hidden clipped the legend whenever the list
   body was shorter — reserve the block's height in flow. */
.dash-pending-card > .dash-card__body { padding-right: 128px; min-height: 184px; }
.dash-pending-card > .dash-pending-sla {
  position: absolute; top: 10px; right: 10px; z-index: 2;
  padding: 0; background: transparent; border: none; gap: 6px; width: auto;
}
.dash-pending-card .dash-donut { width: 88px; height: 88px; }
.dash-pending-card .dash-donut::after { inset: 11px; }
.dash-pending-card .dash-donut__num { font-size: 17px; }
.dash-pending-card .dash-donut__cap { font-size: 8px; margin-top: 1px; }
.dash-pending-card .dash-legend { width: auto; gap: 4px; font-size: 11px; }

/* Each pending row carries an SLA bar under its title, so it wraps. */
.dash-prow { flex-wrap: wrap; }
.dash-prow .dash-row__body { flex: 1 1 100%; }
.dash-sla {
  flex: 1 1 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 7px;
}
.dash-sla__bar {
  flex: 1;
  height: 6px;
  border-radius: 999px;
  background: var(--arq-n-100);
  overflow: hidden;
}
.dash-sla__fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  transition: width var(--arq-dur-slow) var(--arq-ease);
}
/* SLA semantic colors - the ONLY non-brand hues allowed (per contract):
   on-time = green, near = amber, overdue = red. >=100 red, >66 amber, else green. */
.dash-sla__fill--ok      { background: #639922; }
.dash-sla__fill--near    { background: #BA7517; }
.dash-sla__fill--overdue { background: #E24B4A; }
.dash-sla__pct {
  flex: none;
  font-size: 11.5px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  min-width: 34px;
  text-align: right;
}
.dash-sla__pct--ok      { color: #4d7a14; }
.dash-sla__pct--near    { color: #9a5f10; }
.dash-sla__pct--overdue { color: #c23a39; }

/* SLA donut - a conic ring summarizing the on-time/near/overdue split.
   js sets --p-ok/--p-near as percentages (0..100) cumulative stops. */
.dash-pending-sla {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 18px 16px;
  background: var(--arq-n-25);
  border: 1px solid var(--arq-border-subtle);
  border-radius: var(--arq-radius-md);
}
.dash-donut {
  --p-ok: 0%;
  --p-near: 0%;
  position: relative;
  width: 132px;
  height: 132px;
  border-radius: 999px;
  flex: none;
  background:
    conic-gradient(
      #639922 0 var(--p-ok),
      #BA7517 var(--p-ok) var(--p-near),
      #E24B4A var(--p-near) 100%
    );
}
.dash-donut::after {
  content: "";
  position: absolute;
  inset: 16px;
  border-radius: 999px;
  background: var(--arq-surface-card);
}
.dash-donut__center {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 1;
}
.dash-donut__num {
  font-size: 26px;
  font-weight: 800;
  line-height: 1;
  color: var(--arq-text-strong);
  font-variant-numeric: tabular-nums;
}
.dash-donut__cap {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--arq-text-muted);
  margin-top: 3px;
}
.dash-legend { display: flex; flex-direction: column; gap: 7px; width: 100%; list-style: none; margin: 0; padding: 0; }
.dash-legend__item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12.5px;
  color: var(--arq-text-body);
}
.dash-legend__sw { width: 10px; height: 10px; border-radius: 3px; flex: none; }
.dash-legend__sw--ok      { background: #639922; }
.dash-legend__sw--near    { background: #BA7517; }
.dash-legend__sw--overdue { background: #E24B4A; }
.dash-legend__n {
  margin-left: auto;
  font-weight: 700;
  color: var(--arq-text-strong);
  font-variant-numeric: tabular-nums;
}

/* acknowledgment-term pendences card (below pending, when EnableAcknowledgment) */
.dash-ack .dash-row__icon { background: var(--arq-attention-bg); color: var(--arq-petrol-600); }

/* ===================== Notifications ("Novidades") ===================== */
/* notification rows wrap their title (full message) and tint the icon chip by
   the API `typeclass` (info/success/danger/obsolete) via .dash-row--<tone>. */
.dash-notifications .dash-row__title { white-space: normal; }
.dash-row--info     .dash-row__icon { background: var(--arq-teal-50);  color: var(--arq-teal-600); }
.dash-row--success  .dash-row__icon { background: var(--arq-green-50); color: var(--arq-green-700); }
.dash-row--danger   .dash-row__icon { background: var(--arq-attention-bg); color: var(--arq-petrol-600); }
.dash-row--obsolete .dash-row__icon { background: var(--arq-n-100);    color: var(--arq-n-600); }

/* ===================== Admin block ("Administração da unidade") ===================== */
.dash-admin { display: flex; flex-direction: column; gap: 16px; }
.dash-admin-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}
.dash-akpi {
  padding: 14px 16px;
  background: var(--arq-surface-card);
  border: 1px solid var(--arq-border);
  border-radius: var(--arq-radius-md);
  box-shadow: var(--arq-shadow-xs);
}
.dash-akpi__num {
  font-size: 22px;
  font-weight: 800;
  line-height: 1.1;
  color: var(--arq-text-strong);
  font-variant-numeric: tabular-nums;
}
.dash-akpi__label {
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--arq-text-muted);
  margin-top: 4px;
}

/* report tiles (server-rendered links to /Report/Collection/*) */
.dash-reports {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}
.dash-rtile {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  background: var(--arq-surface-card);
  border: 1px solid var(--arq-border);
  border-radius: var(--arq-radius-md);
  color: var(--arq-text-strong);
  text-decoration: none;
  cursor: pointer;
  transition: border-color var(--arq-dur-fast) var(--arq-ease),
              background var(--arq-dur-fast) var(--arq-ease);
}
.dash-rtile:hover { border-color: var(--arq-petrol-400); background: var(--arq-n-25); text-decoration: none; }
.dash-rtile__ic {
  width: 36px;
  height: 36px;
  flex: none;
  border-radius: var(--arq-radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--arq-n-50);
  color: var(--arq-petrol-600);
}
.dash-rtile__ic svg { width: 18px; height: 18px; }
.dash-rtile__tx { min-width: 0; }
.dash-rtile__t { font-size: 13.5px; font-weight: 700; }
.dash-rtile__d { font-size: 12px; color: var(--arq-text-muted); margin-top: 1px; }

/* ===================== Empty / error / loading states ===================== */
.dash-empty {
  padding: 22px 16px;
  text-align: center;
  font-size: 13px;
  color: var(--arq-text-muted);
}
.dash-empty__ic { color: var(--arq-n-300); margin: 0 auto 8px; display: flex; justify-content: center; }

/* Skeleton shimmer while js fetches (rows are replaced on response). */
.dash-skel {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px;
}
.dash-skel__line {
  height: 12px;
  border-radius: 6px;
  background: linear-gradient(90deg, var(--arq-n-50) 25%, var(--arq-n-100) 37%, var(--arq-n-50) 63%);
  background-size: 400% 100%;
  animation: dash-shimmer 1.3s var(--arq-ease) infinite;
  flex: 1;
}
.dash-skel__line--short { max-width: 40%; }
.dash-skel__dot {
  width: 36px; height: 36px; flex: none; border-radius: var(--arq-radius-sm);
  background: linear-gradient(90deg, var(--arq-n-50) 25%, var(--arq-n-100) 37%, var(--arq-n-50) 63%);
  background-size: 400% 100%;
  animation: dash-shimmer 1.3s var(--arq-ease) infinite;
}
@keyframes dash-shimmer { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }
@media (prefers-reduced-motion: reduce) {
  .dash-skel__line, .dash-skel__dot { animation: none; }
  .dash-kpi:hover { transform: none; }
}

/* ===================== Responsive ===================== */
@media (max-width: 1024px) {
  .dash-pending { grid-template-columns: 1fr; }
  .dash-pending-sla { flex-direction: row; flex-wrap: wrap; justify-content: flex-start; gap: 18px; }
  .dash-pending-sla .dash-legend { width: auto; flex: 1 1 200px; }
  /* 3814: the row-direction flip above was written for the retired 2-col .dash-pending layout;
     the absolute in-card block must stay a compact column or it overlaps the list on tablets. */
  .dash-pending-card > .dash-pending-sla { flex-direction: column; flex-wrap: nowrap; gap: 6px; }
  .dash-pending-card > .dash-pending-sla .dash-legend { flex: none; }
}
@media (max-width: 768px) {
  .dash__inner { padding: 18px 16px 44px; gap: 20px; }
  .dash-hero { padding: 18px; }
  .dash-hero__cta { width: 100%; }
  .dash-kpi__num { font-size: 24px; }
}

/* 3378 fix: the JS emits these as inline <span>s; force block so num/label and title/meta
   stack (not glued) and their nowrap+ellipsis truncation works inside the constrained body. */
.dash-kpi__num, .dash-kpi__label,
.dash-row__title, .dash-row__meta,
.dash-akpi__num, .dash-akpi__label,
.dash-rtile__t, .dash-rtile__d { display: block; }

/* ===================== Quick modals (drafts / inbox / report-exports) ===================== */
/* Modern, dependency-free modals opened from [data-quick] triggers (dashboard KPI tiles, the
   topbar report icon, the user-chip menu). Built + filled by dashboard.js; styled here with the
   same --arq-* tokens. Flat, petrol/teal, no blue; the only literal hues are the delete-danger
   red family (shared with the SLA overdue tone). */
.qm-overlay {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 64px 20px 32px;
  background: rgba(11, 38, 44, 0.46);   /* petrol-tinted scrim */
  overflow-y: auto;
}
.qm-overlay[hidden] { display: none; }
.qm-dialog {
  width: 100%;
  max-width: 620px;
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 96px);
  background: var(--arq-surface-card);
  border: 1px solid var(--arq-border);
  border-radius: var(--arq-radius-xl);
  box-shadow: var(--arq-shadow-md);
  overflow: hidden;
}
.qm-head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--arq-border-subtle);
}
.qm-title {
  flex: 1;
  min-width: 0;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--arq-text-strong);
}
.qm-close {
  flex: none;
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: var(--arq-radius-sm);
  background: transparent;
  color: var(--arq-text-muted);
  cursor: pointer;
  transition: background var(--arq-dur-fast) var(--arq-ease), color var(--arq-dur-fast) var(--arq-ease);
}
.qm-close:hover { background: var(--arq-n-50); color: var(--arq-text-strong); }
/* 3759: tab bar inside the quick-modal (drafts | temporality reviews) — classic
   drafts-modal parity. Underline tabs on the head border. */
.qm-tabs {
  display: flex;
  gap: 4px;
  padding: 6px 18px 0;
  border-bottom: 1px solid var(--arq-border-subtle);
}
.qm-tab {
  border: none;
  background: transparent;
  font: inherit;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--arq-text-muted);
  padding: 8px 12px 10px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}
.qm-tab:hover { color: var(--arq-text-strong); }
.qm-tab--active { color: var(--arq-petrol-600, #0E5460); border-bottom-color: var(--arq-petrol-500, #16697A); }
.qm-body {
  flex: 1 1 auto;
  min-height: 90px;
  overflow-y: auto;
  padding: 8px;
}
.qm-list { display: flex; flex-direction: column; }
.qm-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 12px;
  border-radius: var(--arq-radius-md);
  color: inherit;
  text-decoration: none;
}
.qm-item + .qm-item { border-top: 1px solid var(--arq-border-subtle); border-radius: 0; }
.qm-item--link { cursor: pointer; transition: background var(--arq-dur-fast) var(--arq-ease); }
.qm-item--link:hover { background: var(--arq-n-50); text-decoration: none; }
.qm-item--muted .qm-item__title { color: var(--arq-text-muted); font-weight: 600; }
.qm-item__main { flex: 1; min-width: 0; }
.qm-item__title {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--arq-text-strong);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.qm-item__meta {
  display: block;
  font-size: 12px;
  color: var(--arq-text-muted);
  margin-top: 1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.qm-item__chev { flex: none; color: var(--arq-n-300); display: flex; }
.qm-item__actions { flex: none; display: flex; align-items: center; gap: 6px; }
.qm-act {
  width: 32px;
  height: 32px;
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--arq-border);
  border-radius: var(--arq-radius-sm);
  background: var(--arq-surface-card);
  color: var(--arq-text-muted);
  cursor: pointer;
  text-decoration: none;
  transition: border-color var(--arq-dur-fast) var(--arq-ease),
              background var(--arq-dur-fast) var(--arq-ease),
              color var(--arq-dur-fast) var(--arq-ease);
}
.qm-act--dl:hover { border-color: var(--arq-teal-300); background: var(--arq-teal-50); color: var(--arq-teal-600); text-decoration: none; }
.qm-act--del:hover { border-color: #E24B4A; background: #fdeceb; color: #c23a39; }

/* RF09: status badge da modal de Relatórios (Concluído / Em andamento / Falha). */
.qm-badge {
  flex: none;
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}
.qm-badge--ok   { background: #e4f4ea; color: #1b7f43; }
.qm-badge--wait { background: #fdf3d7; color: #9a7400; }
.qm-badge--fail { background: #fdeceb; color: #c23a39; }
.qm-loading { padding: 30px 16px; text-align: center; font-size: 13px; color: var(--arq-text-muted); }
.qm-foot {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 12px 16px;
  border-top: 1px solid var(--arq-border-subtle);
}
.qm-foot[hidden] { display: none; }
.qm-pg {
  height: 34px;
  padding: 0 16px;
  border: 1px solid var(--arq-border-strong);
  border-radius: var(--arq-radius-sm);
  background: var(--arq-surface-card);
  color: var(--arq-text-body);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background var(--arq-dur-fast) var(--arq-ease);
}
.qm-pg:hover:not([disabled]) { background: var(--arq-n-50); }
.qm-pg[disabled] { opacity: 0.45; cursor: default; }
.qm-pginfo { font-size: 13px; font-weight: 700; color: var(--arq-text-muted); font-variant-numeric: tabular-nums; }
html.qm-open { overflow: hidden; }
@media (max-width: 560px) {
  .qm-overlay { padding: 24px 12px; }
  .qm-dialog { max-height: calc(100vh - 48px); }
  .qm-item__meta { white-space: normal; }
}

/* 3792: per-row "Delegar revisão" action on the temporality-review tab + the
   reviewer-picker overlay it opens (classic drafts-modal parity). Reuses the qm-*
   dialog shell; only the row link, the action button and the picker internals
   need new rules. */
.qm-item__link { display: block; min-width: 0; text-decoration: none; color: inherit; }
.qm-item__link:hover .qm-item__title { text-decoration: underline; }
.qm-act--deleg:hover { border-color: var(--arq-petrol-300, #7FB0BC); background: var(--arq-petrol-50, #eef5f7); color: var(--arq-petrol-600, #0E5460); }

.deleg-overlay { z-index: 2100; }
.deleg-dialog { max-width: 460px; }
.deleg-body { padding: 16px 18px; }
.deleg-doc { font-size: 12.5px; color: var(--arq-text-muted); margin: 0 0 12px; word-break: break-word; }
.deleg-label { display: block; font-size: 13px; font-weight: 700; color: var(--arq-text-strong); margin-bottom: 6px; }
.deleg-input {
  width: 100%;
  height: 40px;
  padding: 0 12px;
  border: 1px solid var(--arq-border-strong);
  border-radius: var(--arq-radius-sm);
  background: var(--arq-surface-card);
  color: var(--arq-text-body);
  font: inherit;
  font-size: 14px;
  box-sizing: border-box;
}
.deleg-input:focus { outline: none; border-color: var(--arq-petrol-400, #3E8494); }
.deleg-results { margin-top: 10px; max-height: 260px; overflow-y: auto; display: flex; flex-direction: column; gap: 2px; }
.deleg-user {
  display: block;
  width: 100%;
  text-align: left;
  padding: 9px 12px;
  border: 1px solid transparent;
  border-radius: var(--arq-radius-sm);
  background: transparent;
  color: var(--arq-text-body);
  font: inherit;
  font-size: 14px;
  cursor: pointer;
}
.deleg-user:hover { background: var(--arq-n-50); }
.deleg-user--sel { border-color: var(--arq-petrol-300, #7FB0BC); background: var(--arq-petrol-50, #eef5f7); color: var(--arq-petrol-700, #0B3F49); font-weight: 600; }
.deleg-empty { padding: 16px 4px; text-align: center; font-size: 13px; color: var(--arq-text-muted); }
.deleg-status { margin: 12px 0 0; font-size: 13px; color: var(--arq-text-muted); }
.deleg-status--err { color: #c23a39; }
/* Preenchimento na cor do cromo: segue o fundo do menu quando ha' tema, com o texto na cor
   dos itens do menu -- mesma regra do .pi-btn--petrol em screen.css. */
.deleg-save { background: var(--arq-brand-menu-bg, var(--arq-surface-chrome, #093F49)); color: var(--arq-brand-menu-item, #fff); border-color: var(--arq-brand-menu-bg, var(--arq-surface-chrome, #093F49)); }
.deleg-save:hover:not([disabled]) { background: var(--arq-brand-menu-bg-hover, var(--arq-petrol-700, #0B3F49)); }
.deleg-save[disabled] { opacity: 0.5; cursor: default; }

.dash-toast {
  position: fixed;
  left: 50%;
  bottom: 28px;
  transform: translateX(-50%) translateY(12px);
  z-index: 2200;
  max-width: 90vw;
  padding: 11px 18px;
  border-radius: var(--arq-radius-md);
  background: var(--arq-brand-menu-bg, var(--arq-surface-chrome, #093F49));
  color: var(--arq-brand-menu-item, #fff);
  font-size: 13.5px;
  font-weight: 600;
  box-shadow: var(--arq-shadow-md);
  opacity: 0;
  transition: opacity var(--arq-dur-fast) var(--arq-ease), transform var(--arq-dur-fast) var(--arq-ease);
}
.dash-toast--in { opacity: 1; transform: translateX(-50%) translateY(0); }
.dash-toast--err { background: #c23a39; }

/* Modern-themed confirm dialog (replaces window.confirm for the delegate prompt).
   Centered, above the picker overlay; reuses the qm-dialog / qm-pg shell. */
.dash-confirm { z-index: 2300; align-items: center; }
.dash-confirm__dialog { max-width: 380px; }
.dash-confirm__body { padding: 22px 20px 8px; }
.dash-confirm__msg { margin: 0; font-size: 14.5px; line-height: 1.45; color: var(--arq-text-strong); }
.dash-confirm__foot { justify-content: flex-end; }

/* line 4, ../../src/sass/messenger.sass */
ul.messenger {
    margin: 0;
    padding: 0;
}

/* line 8, ../../src/sass/messenger.sass */

ul.messenger > li {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* line 14, ../../src/sass/messenger.sass */

ul.messenger.messenger-empty { display: none; }

/* line 17, ../../src/sass/messenger.sass */

ul.messenger .messenger-message {
    overflow: hidden;
    *zoom: 1;
}

/* line 20, ../../src/sass/messenger.sass */

ul.messenger .messenger-message.messenger-hidden { display: none; }

/* line 23, ../../src/sass/messenger.sass */

ul.messenger .messenger-message .messenger-phrase, ul.messenger .messenger-message .messenger-actions a { padding-right: 5px; }

/* line 26, ../../src/sass/messenger.sass */

ul.messenger .messenger-message .messenger-actions { float: right; }

/* line 29, ../../src/sass/messenger.sass */

ul.messenger .messenger-message .messenger-actions a {
    cursor: pointer;
    text-decoration: underline;
}

/* line 33, ../../src/sass/messenger.sass */

ul.messenger .messenger-message ul, ul.messenger .messenger-message ol { margin: 10px 18px 0; }

/* line 36, ../../src/sass/messenger.sass */

ul.messenger.messenger-fixed {
    position: fixed;
    z-index: 10001;
}

/* line 40, ../../src/sass/messenger.sass */

ul.messenger.messenger-fixed .messenger-message {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    min-width: 0;
}

/* line 45, ../../src/sass/messenger.sass */

ul.messenger.messenger-fixed .message .messenger-actions { float: left; }

/* line 48, ../../src/sass/messenger.sass */

ul.messenger.messenger-fixed.messenger-on-top { top: 20px; }

/* line 51, ../../src/sass/messenger.sass */

ul.messenger.messenger-fixed.messenger-on-bottom { bottom: 20px; }

/* line 54, ../../src/sass/messenger.sass */

ul.messenger.messenger-fixed.messenger-on-top, ul.messenger.messenger-fixed.messenger-on-bottom {
    left: 50%;
    margin-left: -400px;
    width: 800px;
}

@media (max-width: 960px) {
    /* line 54, ../../src/sass/messenger.sass */
    ul.messenger.messenger-fixed.messenger-on-top, ul.messenger.messenger-fixed.messenger-on-bottom {
        left: 10%;
        margin-left: 0px;
        width: 80%;
    }
}

/* line 64, ../../src/sass/messenger.sass */

ul.messenger.messenger-fixed.messenger-on-top.messenger-on-right, ul.messenger.messenger-fixed.messenger-on-bottom.messenger-on-right {
    left: auto;
    right: 20px;
}

/* line 68, ../../src/sass/messenger.sass */

ul.messenger.messenger-fixed.messenger-on-top.messenger-on-left, ul.messenger.messenger-fixed.messenger-on-bottom.messenger-on-left {
    left: 20px;
    margin-left: 0px;
}

/* line 72, ../../src/sass/messenger.sass */

ul.messenger.messenger-fixed.messenger-on-right, ul.messenger.messenger-fixed.messenger-on-left { width: 350px; }

/* line 75, ../../src/sass/messenger.sass */

ul.messenger.messenger-fixed.messenger-on-right .messenger-actions, ul.messenger.messenger-fixed.messenger-on-left .messenger-actions { float: left; }

/* line 78, ../../src/sass/messenger.sass */

ul.messenger .messenger-spinner { display: none; }

@media (min-width: 980px) {
    ul.messenger.messenger-fixed.messenger-on-top.messenger-on-left, ul.messenger.messenger-fixed.messenger-on-bottom.messenger-on-left {
        left: 270px;
        margin-left: 0px;
    }

    ul.messenger.messenger-fixed.messenger-on-top { top: 80px; }
}

@media (min-width: 768px) and (max-width: 1024px) {	
    ul.messenger.messenger-fixed.messenger-on-top.messenger-on-left, ul.messenger.messenger-fixed.messenger-on-bottom.messenger-on-left {
        left: 70px;
        margin-left: 0px;
    }
}

@media only screen 
and (min-device-width: 768px) 
and (max-device-width: 1024px) 
and (orientation: portrait) {
    ul.messenger.messenger-fixed.messenger-on-top.messenger-on-left, ul.messenger.messenger-fixed.messenger-on-bottom.messenger-on-left {
        left: 20px;
        margin-left: 0px;
    }	
}

@media (max-width: 480px) {
    ul.messenger.messenger-fixed.messenger-on-top.messenger-on-left, ul.messenger.messenger-fixed.messenger-on-bottom.messenger-on-left {
        left: 20px;
        margin-left: 0px;
    }
}
@-webkit-keyframes ui-spinner-rotate-right {
    /* line 64, ../../src/sass/messenger-spinner.scss */
    0% { -webkit-transform: rotate(0deg); }

    /* line 65, ../../src/sass/messenger-spinner.scss */
    25% { -webkit-transform: rotate(180deg); }

    /* line 66, ../../src/sass/messenger-spinner.scss */
    50% { -webkit-transform: rotate(180deg); }

    /* line 67, ../../src/sass/messenger-spinner.scss */
    75% { -webkit-transform: rotate(360deg); }

    /* line 68, ../../src/sass/messenger-spinner.scss */
    100% { -webkit-transform: rotate(360deg); }
}

@-webkit-keyframes ui-spinner-rotate-left {
    /* line 72, ../../src/sass/messenger-spinner.scss */
    0% { -webkit-transform: rotate(0deg); }

    /* line 73, ../../src/sass/messenger-spinner.scss */
    25% { -webkit-transform: rotate(0deg); }

    /* line 74, ../../src/sass/messenger-spinner.scss */
    50% { -webkit-transform: rotate(180deg); }

    /* line 75, ../../src/sass/messenger-spinner.scss */
    75% { -webkit-transform: rotate(180deg); }

    /* line 76, ../../src/sass/messenger-spinner.scss */
    100% { -webkit-transform: rotate(360deg); }
}

@-moz-keyframes ui-spinner-rotate-right {
    /* line 80, ../../src/sass/messenger-spinner.scss */
    0% { -moz-transform: rotate(0deg); }

    /* line 81, ../../src/sass/messenger-spinner.scss */
    25% { -moz-transform: rotate(180deg); }

    /* line 82, ../../src/sass/messenger-spinner.scss */
    50% { -moz-transform: rotate(180deg); }

    /* line 83, ../../src/sass/messenger-spinner.scss */
    75% { -moz-transform: rotate(360deg); }

    /* line 84, ../../src/sass/messenger-spinner.scss */
    100% { -moz-transform: rotate(360deg); }
}

@-moz-keyframes ui-spinner-rotate-left {
    /* line 88, ../../src/sass/messenger-spinner.scss */
    0% { -moz-transform: rotate(0deg); }

    /* line 89, ../../src/sass/messenger-spinner.scss */
    25% { -moz-transform: rotate(0deg); }

    /* line 90, ../../src/sass/messenger-spinner.scss */
    50% { -moz-transform: rotate(180deg); }

    /* line 91, ../../src/sass/messenger-spinner.scss */
    75% { -moz-transform: rotate(180deg); }

    /* line 92, ../../src/sass/messenger-spinner.scss */
    100% { -moz-transform: rotate(360deg); }
}

@keyframes ui-spinner-rotate-right {
    /* line 96, ../../src/sass/messenger-spinner.scss */
    0% { transform: rotate(0deg); }

    /* line 97, ../../src/sass/messenger-spinner.scss */
    25% { transform: rotate(180deg); }

    /* line 98, ../../src/sass/messenger-spinner.scss */
    50% { transform: rotate(180deg); }

    /* line 99, ../../src/sass/messenger-spinner.scss */
    75% { transform: rotate(360deg); }

    /* line 100, ../../src/sass/messenger-spinner.scss */
    100% { transform: rotate(360deg); }
}

@keyframes ui-spinner-rotate-left {
    /* line 104, ../../src/sass/messenger-spinner.scss */
    0% { transform: rotate(0deg); }

    /* line 105, ../../src/sass/messenger-spinner.scss */
    25% { transform: rotate(0deg); }

    /* line 106, ../../src/sass/messenger-spinner.scss */
    50% { transform: rotate(180deg); }

    /* line 107, ../../src/sass/messenger-spinner.scss */
    75% { transform: rotate(180deg); }

    /* line 108, ../../src/sass/messenger-spinner.scss */
    100% { transform: rotate(360deg); }
}

/* line 116, ../../src/sass/messenger-spinner.scss */

.messenger-spinner {
    border-radius: 100%;
    position: relative;
}

/* line 120, ../../src/sass/messenger-spinner.scss */

ul.messenger.messenger-spinner-active .messenger-spinner .messenger-spinner { display: block; }

/* line 124, ../../src/sass/messenger-spinner.scss */

.messenger-spinner .messenger-spinner-side {
    height: 100%;
    overflow: hidden;
    position: absolute;
    width: 50%;
}

/* line 130, ../../src/sass/messenger-spinner.scss */

.messenger-spinner .messenger-spinner-side .messenger-spinner-fill {
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    border-radius: 999px;
    height: 100%;
    position: absolute;
    width: 100%;
}

/* line 140, ../../src/sass/messenger-spinner.scss */

.messenger-spinner .messenger-spinner-side-left { left: 0; }

/* line 143, ../../src/sass/messenger-spinner.scss */

.messenger-spinner .messenger-spinner-side-left .messenger-spinner-fill {
    -moz-animation-name: ui-spinner-rotate-left;
    -moz-transform-origin: 0 50%;
    -ms-animation-name: ui-spinner-rotate-left;
    -ms-transform-origin: 0 50%;
    -o-animation-name: ui-spinner-rotate-left;
    -o-transform-origin: 0 50%;
    -webkit-animation-name: ui-spinner-rotate-left;
    -webkit-transform-origin: 0 50%;
    animation-name: ui-spinner-rotate-left;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    left: 100%;
    transform-origin: 0 50%;
}

/* line 152, ../../src/sass/messenger-spinner.scss */

.messenger-spinner .messenger-spinner-side-right { left: 50%; }

/* line 155, ../../src/sass/messenger-spinner.scss */

.messenger-spinner .messenger-spinner-side-right .messenger-spinner-fill {
    -moz-animation-name: ui-spinner-rotate-right;
    -moz-transform-origin: 100% 50%;
    -ms-animation-name: ui-spinner-rotate-right;
    -ms-transform-origin: 100% 50%;
    -o-animation-name: ui-spinner-rotate-right;
    -o-transform-origin: 100% 50%;
    -webkit-animation-name: ui-spinner-rotate-right;
    -webkit-transform-origin: 100% 50%;
    animation-name: ui-spinner-rotate-right;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    left: -100%;
    transform-origin: 100% 50%;
}

/* line 15, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat {
    -moz-border-radius: 4px;
    -moz-user-select: none;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    -o-user-select: none;
    -webkit-border-radius: 4px;
    -webkit-user-select: none;
    background: #22262e;
    border-radius: 4px;
    user-select: none;
}

/* line 20, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat.messenger-empty { display: none; }

/* line 23, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-message {
    -moz-border-radius: 0px;
    -moz-box-shadow: inset 0px 1px rgba(255, 255, 255, 0.13), inset 48px 0px 0px #1b1e24;
    -ms-border-radius: 0px;
    -o-border-radius: 0px;
    -webkit-border-radius: 0px;
    -webkit-box-shadow: inset 0px 1px rgba(255, 255, 255, 0.13), inset 48px 0px 0px #1b1e24;
    background: transparent;
    border: 0px;
    border-radius: 0px;
    box-shadow: inset 0px 1px rgba(255, 255, 255, 0.13), inset 48px 0px 0px #1b1e24;
    color: #f0f0f0;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 0px;
    padding: 10px 30px 13px 65px;
    position: relative;
}

/* line 35, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-message .messenger-close {
    -webkit-appearance: none;
    background: transparent;
    border: 0;
    color: #888888;
    cursor: pointer;
    display: block;
    font-size: 20px;
    font-weight: bold;
    line-height: 20px;
    opacity: 1;
    padding: 8px 10px 7px 7px;
    position: absolute;
    right: 0px;
    top: 0px;
}

/* line 51, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-message .messenger-close:hover { color: #bbbbbb; }

/* line 54, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-message .messenger-close:active { color: #777777; }

/* line 57, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-message .messenger-actions {
    float: none;
    margin-top: 10px;
}

/* line 61, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-message .messenger-actions a {
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    -webkit-border-radius: 4px;
    background: #2e2e2e;
    border-radius: 4px;
    color: #aaaaaa;
    display: inline-block;
    margin-right: 10px;
    padding: 10px;
    padding: 4px 11px 6px;
    text-decoration: none;
    text-transform: capitalize;
}

/* line 72, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-message .messenger-actions a:hover {
    background: #2e2e2e;
    color: #f0f0f0;
}

/* line 76, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-message .messenger-actions a:active {
    background: #1b1e24;
    color: #aaaaaa;
}

/* line 80, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-message .messenger-actions .messenger-phrase { display: none; }

/* line 83, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-message .messenger-message-inner:before {
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    content: " ";
    display: block;
    height: 13px;
    left: 17px;
    margin-top: -8px;
    position: absolute;
    top: 50%;
    width: 13px;
    z-index: 20;
}

/* line 95, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-message.alert-success .messenger-message-inner:before { background: #5fca4a; }

/* line 98, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-message.alert-info .messenger-message-inner:before { background: #0aa699; }

/* line 103, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-message.alert-error .messenger-message-inner:before { background: #f35958; }

/* line 32, ../../src/sass/messenger-spinner.scss */

ul.messenger-theme-flat .messenger-message.alert-error.messenger-retry-soon .messenger-spinner {
    background: transparent;
    height: 32px;
    width: 32px;
}

/* line 37, ../../src/sass/messenger-spinner.scss */

ul.messenger-theme-flat .messenger-message.alert-error.messenger-retry-soon .messenger-spinner .messenger-spinner-side .messenger-spinner-fill {
    -moz-animation-duration: 20s;
    -ms-animation-duration: 20s;
    -o-animation-duration: 20s;
    -webkit-animation-duration: 20s;
    animation-duration: 20s;
    background: #f35958;
    opacity: 1;
}

/* line 45, ../../src/sass/messenger-spinner.scss */

ul.messenger-theme-flat .messenger-message.alert-error.messenger-retry-soon .messenger-spinner:after {
    background: #1b1e24;
    border-radius: 50%;
    content: "";
    display: block;
    height: 26px;
    left: 3px;
    position: absolute;
    top: 3px;
    width: 26px;
}

/* line 32, ../../src/sass/messenger-spinner.scss */

ul.messenger-theme-flat .messenger-message.alert-error.messenger-retry-later .messenger-spinner {
    background: transparent;
    height: 32px;
    width: 32px;
}

/* line 37, ../../src/sass/messenger-spinner.scss */

ul.messenger-theme-flat .messenger-message.alert-error.messenger-retry-later .messenger-spinner .messenger-spinner-side .messenger-spinner-fill {
    -moz-animation-duration: 600s;
    -ms-animation-duration: 600s;
    -o-animation-duration: 600s;
    -webkit-animation-duration: 600s;
    animation-duration: 600s;
    background: #f35958;
    opacity: 1;
}

/* line 45, ../../src/sass/messenger-spinner.scss */

ul.messenger-theme-flat .messenger-message.alert-error.messenger-retry-later .messenger-spinner:after {
    background: #1b1e24;
    border-radius: 50%;
    content: "";
    display: block;
    height: 26px;
    left: 3px;
    position: absolute;
    top: 3px;
    width: 26px;
}

/* line 114, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-message-slot.messenger-last .messenger-message {
    -moz-border-radius: 4px 4px 0px 0px;
    -moz-box-shadow: inset 48px 0px 0px #1b1e24;
    -ms-border-radius: 4px 4px 0px 0px;
    -o-border-radius: 4px 4px 0px 0px;
    -webkit-border-radius: 4px 4px 0px 0px;
    -webkit-box-shadow: inset 48px 0px 0px #1b1e24;
    border-radius: 4px 4px 0px 0px;
    box-shadow: inset 48px 0px 0px #1b1e24;
}

/* line 118, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-message-slot.messenger-first .messenger-message {
    -moz-border-radius: 0px 0px 4px 4px;
    -moz-box-shadow: inset 0px 1px rgba(255, 255, 255, 0.13), inset 48px 0px 0px #1b1e24;
    -ms-border-radius: 0px 0px 4px 4px;
    -o-border-radius: 0px 0px 4px 4px;
    -webkit-border-radius: 0px 0px 4px 4px;
    -webkit-box-shadow: inset 0px 1px rgba(255, 255, 255, 0.13), inset 48px 0px 0px #1b1e24;
    border-radius: 0px 0px 4px 4px;
    box-shadow: inset 0px 1px rgba(255, 255, 255, 0.13), inset 48px 0px 0px #1b1e24;
}

/* line 122, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-message-slot.messenger-first.messenger-last .messenger-message {
    -moz-border-radius: 4px;
    -moz-box-shadow: inset 48px 0px 0px #1b1e24;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    -webkit-border-radius: 4px;
    -webkit-box-shadow: inset 48px 0px 0px #1b1e24;
    border-radius: 4px;
    box-shadow: inset 48px 0px 0px #1b1e24;
}

/* line 126, ../../src/sass/messenger-theme-flat.sass */

ul.messenger-theme-flat .messenger-spinner {
    display: block;
    height: 32px;
    left: 7px;
    margin-top: -18px;
    position: absolute;
    top: 50%;
    width: 32px;
    z-index: 999;
    z-index: 10;
}