/**
 * Photon Grid base styles — container resize handles.
 *
 * Registered near the end of the cascade: handles sit above every panel and
 * overlay the grid draws, so their positioning rules should win any
 * same-specificity tie.
 *
 * Colours, radii and spacing all resolve through `--pg-*` tokens, so the
 * affordance follows light/dark and every variant. The only literals are the
 * handle's own hit geometry, which is driven by `--pg-resize-handle-size`
 * (written by `GridResizeController` from `GridResizeConfig.handleSize`).
 */
export declare const gridResizeCss = "/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 Container resize handles \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n/* Each handle is an invisible hit strip along one edge or corner of the grid\n   wrapper. The visible affordance is the corner grip below \u2014 edges rely on the\n   cursor change alone, which is the convention users already know from window\n   and panel chrome. */\n.pg-resize-handle {\n  position: absolute;\n  z-index: 20;\n  touch-action: none;\n  /* No background: the strip is a hit area, not a painted element. Giving it\n     one would draw a line inside the grid's border on all four sides. */\n  background: transparent;\n}\n\n/* \u2500\u2500 Edges \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   Inset by the handle size at both ends so an edge strip never covers the\n   corner strips, which must win the hit test where they overlap. */\n.pg-resize-handle--top,\n.pg-resize-handle--bottom {\n  left: var(--pg-resize-handle-size, 6px);\n  right: var(--pg-resize-handle-size, 6px);\n  height: var(--pg-resize-handle-size, 6px);\n  cursor: ns-resize;\n}\n.pg-resize-handle--top { top: 0; }\n.pg-resize-handle--bottom { bottom: 0; }\n\n.pg-resize-handle--left,\n.pg-resize-handle--right {\n  top: var(--pg-resize-handle-size, 6px);\n  bottom: var(--pg-resize-handle-size, 6px);\n  width: var(--pg-resize-handle-size, 6px);\n  cursor: ew-resize;\n}\n.pg-resize-handle--left { left: 0; }\n.pg-resize-handle--right { right: 0; }\n\n/* \u2500\u2500 Corners \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   Twice the edge size so a corner is comfortably reachable, and a higher\n   z-index so it beats the two edges it overlaps. */\n.pg-resize-handle--topLeft,\n.pg-resize-handle--topRight,\n.pg-resize-handle--bottomLeft,\n.pg-resize-handle--bottomRight {\n  width: calc(var(--pg-resize-handle-size, 6px) * 2);\n  height: calc(var(--pg-resize-handle-size, 6px) * 2);\n  z-index: 21;\n}\n.pg-resize-handle--topLeft     { top: 0; left: 0; cursor: nwse-resize; }\n.pg-resize-handle--topRight    { top: 0; right: 0; cursor: nesw-resize; }\n.pg-resize-handle--bottomLeft  { bottom: 0; left: 0; cursor: nesw-resize; }\n.pg-resize-handle--bottomRight { bottom: 0; right: 0; cursor: nwse-resize; }\n\n/* \u2500\u2500 Bottom-right grip \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   The one handle that gets a visible mark, mirroring the native <textarea>\n   affordance users already recognise as \"this resizes\". Two stacked diagonal\n   strokes drawn with a gradient rather than glyphs, so it needs no icon and no\n   extra element. */\n.pg-resize-handle--bottomRight::after {\n  content: \"\";\n  position: absolute;\n  right: 2px;\n  bottom: 2px;\n  width: 8px;\n  height: 8px;\n  opacity: 0.55;\n  background:\n    linear-gradient(\n      135deg,\n      transparent 0 45%,\n      var(--pg-colors-text-secondary, #64748b) 45% 60%,\n      transparent 60% 100%\n    ),\n    linear-gradient(\n      135deg,\n      transparent 0 70%,\n      var(--pg-colors-text-secondary, #64748b) 70% 85%,\n      transparent 85% 100%\n    );\n  pointer-events: none;\n  transition: opacity var(--pg-motion-duration-fast, 120ms) ease;\n}\n.pg-grid--resizable .pg-resize-handle--bottomRight:hover::after {\n  opacity: 1;\n}\n\n/* \u2500\u2500 Hover / active feedback \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   An edge lights up only while the pointer is on it, so the grid's chrome is\n   unchanged at rest. Drawn as an inset shadow rather than a border so it costs\n   no layout and cannot shift the grid's contents by a pixel. */\n.pg-resize-handle:hover {\n  box-shadow: inset 0 0 0 1px var(--pg-colors-accent, #2563eb);\n}\n\n/* \u2500\u2500 While dragging \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   The grid's contents stop taking the pointer for the duration, so a drag that\n   crosses the body never selects cell text, starts a cell-range selection, or\n   triggers a hover highlight. The handles themselves keep their events \u2014 they\n   are what the gesture is on. */\n.pg-grid--resizing {\n  user-select: none;\n}\n.pg-grid--resizing > *:not(.pg-resize-handle) {\n  pointer-events: none;\n}\n\n";
//# sourceMappingURL=grid-resize.css.d.ts.map