/* 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'
(550,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-sidebar-w'
(550,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-chrome'
(551,54): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark'
(560,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(561,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(561,44): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(567,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(568,60): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(570,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(570,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(570,74): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(570,94): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(576,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(579,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(580,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(583,157): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(584,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(588,16): run-time error CSS1039: Token not allowed after unary operator: '-arq-topbar-h'
(588,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(589,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(592,34): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-300'
(593,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(594,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(596,111): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(596,174): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(597,117): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(598,144): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(598,198): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(599,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(603,44): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(603,96): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(605,71): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(610,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(611,39): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(614,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(614,85): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(615,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(617,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(623,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(623,60): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-pill'
(623,96): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(624,52): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(626,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(628,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(629,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(630,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-300'
(656,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-300'
(658,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-200'
(659,103): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-300'
(663,29): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(663,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(663,106): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(663,140): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(664,79): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(664,112): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(667,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(668,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(670,39): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(670,71): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(670,107): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-xs'
(673,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(673,88): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(674,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(676,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(676,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(676,81): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(676,101): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(676,129): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(676,149): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(678,39): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(678,73): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-300'
(680,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(681,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-focus'
(681,54): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(683,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(683,80): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-strip'
(685,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(686,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(686,48): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(689,49): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(692,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(692,85): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(695,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(699,117): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(702,93): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(703,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(703,57): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(704,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(704,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(704,81): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(704,101): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(706,39): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(707,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(707,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-select-ring'
(709,62): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(709,96): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(710,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(710,120): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(713,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(714,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(715,124): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(715,159): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(716,117): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(717,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(725,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(725,90): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-300'
(726,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(727,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(727,64): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-700'
(727,99): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-200'
(728,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(729,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(729,65): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-700'
(729,101): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-200'
(730,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-600'
(731,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(731,90): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-300'
(732,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(733,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(733,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(733,98): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(734,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(735,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(735,64): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(735,99): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-200'
(736,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-500'
(737,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(737,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-600'
(737,93): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(738,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-500'
(741,140): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(741,167): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(741,202): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(742,148): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(744,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(747,81): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(748,171): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(748,209): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(749,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(749,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(754,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(754,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(755,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(759,74): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(760,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-200'
(762,141): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(767,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(769,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(774,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(774,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(774,97): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(776,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(776,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(776,81): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(776,101): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(778,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-300'
(779,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-strip'
(779,87): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(780,125): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(781,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(782,62): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(783,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(786,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-xl'
(786,102): run-time error CSS1039: Token not allowed after unary operator: '-arq-ai-panel'
(786,130): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark'
(786,167): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-md'
(790,92): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(790,181): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(791,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(793,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(797,95): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(800,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(802,176): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(804,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(808,139): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(809,54): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(812,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(816,97): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(817,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(820,140): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(820,289): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(820,309): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(820,337): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(820,357): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(820,384): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(820,404): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(824,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(824,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(825,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-500'
(826,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(826,60): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(827,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-500'
(828,36): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(829,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(830,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(830,76): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(830,109): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(831,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(832,55): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(833,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(836,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(836,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(843,30): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(843,73): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(843,107): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(843,141): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(843,211): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(843,231): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(844,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-focus'
(844,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-md'
(845,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-strip'
(847,78): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(847,112): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(847,139): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(849,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(850,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(851,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(851,76): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(851,96): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(853,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(854,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-slow'
(854,73): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(859,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(859,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-700'
(860,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(860,67): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-text'
(861,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(861,60): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-700'
(862,34): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(862,58): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-600'
(863,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(863,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(864,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(864,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-700'
(869,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(869,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-700'
(870,49): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(871,36): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(871,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-700'
(872,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(873,36): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(873,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-text'
(874,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(877,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(877,81): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(878,105): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(879,124): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(880,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(884,113): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(885,118): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(885,153): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(885,188): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(888,70): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(888,111): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(889,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(889,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(891,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(892,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-focus'
(894,122): run-time error CSS1062: Expected semicolon or closing curly-brace, found '='
(895,62): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(896,57): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(896,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(897,48): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(898,110): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(898,144): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(898,178): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(899,73): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(901,166): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(901,222): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(902,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(903,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(903,117): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(903,149): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(903,190): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(906,92): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(908,81): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(910,127): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(910,168): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(910,202): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(911,32): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(911,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(911,87): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(912,80): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-300'
(912,170): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(912,190): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(913,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(914,159): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-xs'
(914,203): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(914,223): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease-out'
(917,81): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(917,122): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(917,173): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(917,223): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(917,243): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(917,271): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(917,291): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(918,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-300'
(919,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(919,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-select-ring'
(920,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(921,85): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(922,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(923,122): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(924,67): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(925,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(928,32): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(928,67): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(928,101): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(929,114): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(930,106): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(932,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(933,86): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(934,108): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(934,142): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(934,174): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-text'
(934,256): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-strip'
(938,123): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-pill'
(938,165): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(938,196): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(938,263): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(939,98): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(940,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(940,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(941,44): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-400'
(945,114): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(945,199): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(946,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(946,109): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(947,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(951,71): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-400'
(951,109): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(951,158): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(952,85): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(952,110): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(952,148): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(952,225): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(953,120): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(954,71): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(956,74): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(957,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(958,108): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(961,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(961,120): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(961,156): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(961,190): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(964,80): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(964,114): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(964,157): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-strip'
(965,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(966,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-text'
(967,48): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(970,86): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-xl'
(970,138): run-time error CSS1039: Token not allowed after unary operator: '-arq-ai-panel'
(970,166): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark'
(970,203): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-md'
(974,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(974,173): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(976,55): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(978,117): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(981,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(981,111): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-slow'
(981,131): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(985,114): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(986,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(989,122): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(994,121): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1000,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(1003,171): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1004,44): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1005,115): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1006,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1010,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(1010,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1014,121): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1014,153): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1018,152): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(1022,70): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1023,32): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1027,184): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1029,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1031,82): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1032,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1035,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1035,113): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1039,44): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(1039,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-700'
(1040,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(1040,78): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1042,55): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1044,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1044,98): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1044,133): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1045,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(1047,119): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1047,153): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(1047,185): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1047,226): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-strip'
(1048,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1052,30): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1052,70): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-xl'
(1052,104): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-xl'
(1053,69): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1056,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1057,101): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1058,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1059,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(1060,120): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(1060,161): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1061,118): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1062,49): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1066,100): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1066,134): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-900'
(1066,182): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-lg'
(1066,263): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(1066,283): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease-out'
(1067,32): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1070,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(1070,75): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1070,96): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(1070,162): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(1077,126): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-pill'
(1077,162): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-900'
(1077,276): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-lg'
(1078,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1079,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-900'
(1079,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(1079,118): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-xl'
(1081,101): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1084,151): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(1086,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1086,65): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1087,54): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-200'
(1088,39): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1093,155): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-pill'
(1093,240): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1094,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1095,184): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(1095,209): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-600'
(1096,34): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(1096,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1097,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1097,70): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1098,30): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(1099,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(1099,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1100,30): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1101,62): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1108,169): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1108,216): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(1108,273): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(1109,82): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1115,55): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1116,27): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1116,70): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1116,104): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(1116,138): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(1117,113): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1119,80): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(1119,107): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(1122,29): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1123,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1124,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1125,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1134,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-slow'
(1134,60): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1138,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(1146,71): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(1152,55): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1154,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1155,56): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1160,48): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1163,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1164,169): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1166,85): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1166,167): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(1169,44): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(1169,64): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1172,118): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1175,118): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1176,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1177,55): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1177,90): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1177,133): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1179,145): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(1179,170): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1179,304): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1182,119): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-pill'
(1183,36): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(1183,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-700'
(1184,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1185,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1185,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-600'
(1185,97): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1191,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1192,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1192,127): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1192,161): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(1192,195): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(1193,127): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1193,175): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1194,118): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1195,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-400'
(1198,58): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-xl'
(1198,110): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1198,145): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-md'
(1201,100): run-time error CSS1039: Token not allowed after unary operator: '-arq-gradient'
(1201,189): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1203,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-on-dark-muted'
(1205,120): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1210,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1210,74): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1210,108): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(1210,142): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(1211,117): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1214,115): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1214,200): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1215,67): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1217,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1218,141): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1219,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-700'
(1224,32): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(1224,86): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(1225,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1229,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1231,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-900'
(1232,79): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-300'
(1233,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1233,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1234,75): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1235,36): run-time error CSS1039: Token not allowed after unary operator: '-arq-green'
(1235,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1236,76): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1239,190): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(1255,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(1255,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1271,29): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1313,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-focus'
(1338,22): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1339,28): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1340,25): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(1341,22): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-lg'
(1348,35): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1351,52): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1354,17): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1366,17): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1371,45): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1385,36): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(1385,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1446,129): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1446,160): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1446,230): run-time error CSS1039: Token not allowed after unary operator: '-arq-text'
(1447,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1447,72): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1449,56): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1449,106): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1450,111): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1450,154): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1450,188): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-xl'
(1451,187): run-time error CSS1039: Token not allowed after unary operator: '-arq-text'
(1452,66): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-50'
(1452,104): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1453,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1454,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1454,68): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1459,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1476,203): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1476,246): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1476,272): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1476,307): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(1477,38): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1477,88): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1481,134): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1481,186): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1481,250): run-time error CSS1039: Token not allowed after unary operator: '-arq-text'
(1482,39): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1482,74): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-50'
(1485,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1486,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1488,54): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1533,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-canvas'
(1551,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1552,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1553,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-xl'
(1554,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(1564,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1569,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1575,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1580,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(1591,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1592,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal'
(1593,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-deepest'
(1599,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(1599,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1601,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-500'
(1604,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1605,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(1606,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(1608,49): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1622,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1624,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1632,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1635,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(1637,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1652,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1653,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1654,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(1655,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(1659,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(1659,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1660,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(1660,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1661,30): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-base'
(1661,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1664,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-md'
(1665,22): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-300'
(1678,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1682,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(1683,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(1687,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(1687,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1688,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1688,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1689,60): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(1689,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(1690,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(1690,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-700'
(1691,62): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1691,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1692,59): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(1692,91): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-700'
(1699,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1705,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1712,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1713,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1714,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-lg'
(1715,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-sm'
(1723,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1728,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1732,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1736,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-700'
(1737,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1738,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1739,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-pill'
(1751,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1755,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(1755,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1757,52): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1758,36): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1763,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(1767,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(1768,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-500'
(1775,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1782,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1788,52): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-300'
(1796,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1797,29): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1853,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(1860,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-slow'
(1860,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(1887,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(1888,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(1889,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1892,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1893,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1901,22): run-time error CSS1039: Token not allowed after unary operator: '-p-ok'
(1902,20): run-time error CSS1039: Token not allowed after unary operator: '-p-ok'
(1902,32): run-time error CSS1039: Token not allowed after unary operator: '-p-near'
(1903,20): run-time error CSS1039: Token not allowed after unary operator: '-p-near'
(1911,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1926,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1934,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(1943,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(1952,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1957,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(1957,78): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1963,56): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(1963,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(1964,56): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-50'
(1964,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-green-700'
(1965,56): run-time error CSS1039: Token not allowed after unary operator: '-arq-attention-bg'
(1965,88): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(1966,56): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(1966,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-600'
(1977,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(1978,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(1979,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(1980,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-xs'
(1986,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(1994,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2009,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(2010,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(2011,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(2012,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(2015,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2015,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2016,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2016,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2018,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-400'
(2018,75): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-25'
(2023,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(2027,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2028,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-petrol-600'
(2033,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2040,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2042,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-300'
(2054,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2054,64): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(2054,86): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2056,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2061,62): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(2062,43): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2062,64): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-100'
(2062,86): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2064,37): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2115,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(2116,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(2117,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-xl'
(2118,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-shadow-md'
(2126,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(2134,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(2144,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(2146,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2148,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2148,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2148,74): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2148,94): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2150,36): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2150,60): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(2163,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-md'
(2167,50): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(2168,63): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2168,83): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2169,41): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2170,47): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2176,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-strong'
(2184,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2190,42): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-300'
(2199,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border'
(2200,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(2201,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(2202,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2205,33): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2205,53): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2206,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2206,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2207,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2207,46): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2209,40): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-300'
(2209,73): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-50'
(2209,100): run-time error CSS1039: Token not allowed after unary operator: '-arq-teal-600'
(2211,84): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
(2218,30): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-subtle'
(2224,26): run-time error CSS1039: Token not allowed after unary operator: '-arq-border-strong'
(2225,23): run-time error CSS1039: Token not allowed after unary operator: '-arq-radius-sm'
(2226,20): run-time error CSS1039: Token not allowed after unary operator: '-arq-surface-card'
(2227,15): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-body'
(2231,31): run-time error CSS1039: Token not allowed after unary operator: '-arq-dur-fast'
(2231,51): run-time error CSS1039: Token not allowed after unary operator: '-arq-ease'
(2233,49): run-time error CSS1039: Token not allowed after unary operator: '-arq-n-50'
(2235,61): run-time error CSS1039: Token not allowed after unary operator: '-arq-text-muted'
 */
/* 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; }

.pi-sidebar {
  width: var(--arq-sidebar-w); flex: none; background: var(--arq-surface-chrome);
  display: flex; flex-direction: column; color: 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; }
.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-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-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: rgba(255,255,255,0.06); color: #fff; }
.pi-nav__item--active { background: rgba(73,209,107,0.14); color: #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 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: #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; }
.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-petrol-700); color: #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); }
.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-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; }
.pi-btn--primary { background: var(--arq-teal); color: 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); }
.pi-btn--petrol { background: var(--arq-petrol-700); color: #fff; }
.pi-btn--petrol:hover { background: 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; }
.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; }
select.pi-control { appearance: none; background-image: url(/Content/modern/smart-publish/data:image/svg+xml,%3Csvg xmlns='http:/www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%234E5C59' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E); background-repeat: no-repeat; background-position: right 12px center; padding-right: 36px; }
.pi-field--missing .pi-control { border-left: 3px solid var(--arq-teal); }
.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-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); }
.pi-radiocard__t { font-size: 14px; font-weight: 600; color: var(--arq-text-strong); }
.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 ===================== */
.pi-drawer { position: relative; height: 100%; max-height: 100%; border-radius: var(--arq-radius-xl); overflow: hidden; background: 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; }
.pi-drawer__head { position: relative; padding: 16px 16px 14px; border-bottom: 1px solid rgba(255,255,255,0.12); }
.pi-drawer__brand { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.pi-drawer__mark { width: 30px; height: 30px; border-radius: 8px; 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: rgba(255,255,255,0.14); color: #fff; }
.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; }
.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-petrol-700); color: #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 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; }
.pi-nav__sub { text-align: left; background: transparent; border: none; color: 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: rgba(255,255,255,0.06); color: #fff; }
.pi-nav__divider { height: 1px; background: 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: #fff; }
.pi-sidebar__foot { padding: 12px 16px; border-top: 1px solid rgba(255,255,255,0.10); font-size: 11.5px; color: 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); }
.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-petrol-700); color: #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) ----- */
.pi-home__spot { position: relative; border-radius: var(--arq-radius-xl); overflow: hidden; background: 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-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); }

/* ----- 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; }

/*
 * 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. */
.pi-main .page-content { 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; }

.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; }
.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) */
.pi-workarea { grid-template-columns: minmax(0, 1fr) 302px auto; }
.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 */
.pi-drawer [data-action="accept-all"] { width: calc(100% - 28px); margin-left: 14px; margin-right: 14px; }
/* 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; }
/* ============================================================================
   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;
}
/* 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; }
.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; }
.dash-pending-card > .dash-card__body { padding-right: 128px; }
.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; }
}
@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); }
.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; }
.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; }
}