@cyberskill/design 1.0.0

package/_esm/cs.mjs

@@ -0,0 +1,137 @@
+// CyberSkill Design System — ESM entry point (GENERATED from _ds_manifest.json at v3.6.0).
+// No build step: import this module directly in a browser. It ensures React 18.3.1 (pinned,
+// skipped when window.React already exists), side-loads ../_ds_bundle.js once, resolves the
+// compiler-assigned namespace BY PREFIX (never a hardcoded suffix), and re-exports every component.
+// Styles are NOT injected — link styles.css yourself (same contract as the UMD path).
+// Regenerate when exports change — the esm-smoke gate fails on export/manifest drift.
+const g = typeof window !== "undefined" ? window : globalThis;
+async function ensureScript(src, integrity){
+  const href = new URL(src, import.meta.url).href;
+  if ([...document.scripts].some(s => s.src === href)) return;
+  await new Promise((res, rej) => { const s = document.createElement("script"); s.src = href;
+    if (integrity) { s.integrity = integrity; s.crossOrigin = "anonymous"; }
+    s.onload = res; s.onerror = () => rej(new Error("cs.js: failed to load " + href)); document.head.appendChild(s); });
+}
+if (!g.React) await ensureScript("https://unpkg.com/react@18.3.1/umd/react.development.js", "sha384-hD6/rw4ppMLGNu3tX5cjIb+uRZ7UkRJ6BPkLpg4hAu/6onKUg4lLsHAs9EBPT82L");
+if (!g.ReactDOM) await ensureScript("https://unpkg.com/react-dom@18.3.1/umd/react-dom.development.js", "sha384-u6aeetuaXnQ38mYT8rp6sbXaQe3NL9t+IBXmnYxwkUI2Hw4bsp2Wvmx4yRQF1uAm");
+const found = () => Object.keys(g).find(k => /^CyberSkillDesignSystem_/.test(k));
+if (!found()) await ensureScript("../_ds_bundle.js");
+export const CS = g[found()];
+if (!CS) throw new Error("cs.js: bundle loaded but no CyberSkillDesignSystem_* namespace found");
+export default CS;
+export const VERSION = "3.6.0";
+export const AIDisclosureBadge = CS.AIDisclosureBadge;
+export const Accordion = CS.Accordion;
+export const Alert = CS.Alert;
+export const Anchor = CS.Anchor;
+export const Avatar = CS.Avatar;
+export const AvatarGroup = CS.AvatarGroup;
+export const BackTop = CS.BackTop;
+export const Badge = CS.Badge;
+export const Breadcrumb = CS.Breadcrumb;
+export const Button = CS.Button;
+export const ButtonGroup = CS.ButtonGroup;
+export const CS_ICONS = CS.CS_ICONS;
+export const CS_LOGO_MARK_INNER = CS.CS_LOGO_MARK_INNER;
+export const CS_LOGO_VIEWBOX = CS.CS_LOGO_VIEWBOX;
+export const Calendar = CS.Calendar;
+export const Card = CS.Card;
+export const CardBody = CS.CardBody;
+export const CardFooter = CS.CardFooter;
+export const CardHeader = CS.CardHeader;
+export const Carousel = CS.Carousel;
+export const Cascader = CS.Cascader;
+export const Chart = CS.Chart;
+export const ChatMessage = CS.ChatMessage;
+export const Checkbox = CS.Checkbox;
+export const CitationList = CS.CitationList;
+export const CodeBlock = CS.CodeBlock;
+export const ColorPicker = CS.ColorPicker;
+export const Combobox = CS.Combobox;
+export const CommandPalette = CS.CommandPalette;
+export const Comment = CS.Comment;
+export const ConfidenceMeter = CS.ConfidenceMeter;
+export const ContextMenu = CS.ContextMenu;
+export const DataGrid = CS.DataGrid;
+export const DataTable = CS.DataTable;
+export const DatePicker = CS.DatePicker;
+export const DescriptionList = CS.DescriptionList;
+export const Dialog = CS.Dialog;
+export const Divider = CS.Divider;
+export const Dock = CS.Dock;
+export const Drawer = CS.Drawer;
+export const Editor = CS.Editor;
+export const EmptyState = CS.EmptyState;
+export const FileUpload = CS.FileUpload;
+export const FloatingActionButton = CS.FloatingActionButton;
+export const Form = CS.Form;
+export const FormField = CS.FormField;
+export const FormFieldArray = CS.FormFieldArray;
+export const FormWizard = CS.FormWizard;
+export const HotKeys = CS.HotKeys;
+export const HoverCard = CS.HoverCard;
+export const HumanReviewGate = CS.HumanReviewGate;
+export const Icon = CS.Icon;
+export const Image = CS.Image;
+export const InlineEdit = CS.InlineEdit;
+export const InputGroup = CS.InputGroup;
+export const InputOTP = CS.InputOTP;
+export const Kbd = CS.Kbd;
+export const Link = CS.Link;
+export const List = CS.List;
+export const ListItem = CS.ListItem;
+export const Logo = CS.Logo;
+export const LumiAvatar = CS.LumiAvatar;
+export const Masonry = CS.Masonry;
+export const Mentions = CS.Mentions;
+export const Menu = CS.Menu;
+export const MenuItem = CS.MenuItem;
+export const Menubar = CS.Menubar;
+export const NavItem = CS.NavItem;
+export const NavigationMenu = CS.NavigationMenu;
+export const NumberField = CS.NumberField;
+export const Pagination = CS.Pagination;
+export const Popconfirm = CS.Popconfirm;
+export const Popover = CS.Popover;
+export const ProgressBar = CS.ProgressBar;
+export const PromptInput = CS.PromptInput;
+export const PromptSuggestions = CS.PromptSuggestions;
+export const QRCode = CS.QRCode;
+export const Radio = CS.Radio;
+export const RadioGroup = CS.RadioGroup;
+export const Rating = CS.Rating;
+export const Result = CS.Result;
+export const SearchField = CS.SearchField;
+export const SegmentedControl = CS.SegmentedControl;
+export const Select = CS.Select;
+export const Sidebar = CS.Sidebar;
+export const Skeleton = CS.Skeleton;
+export const Slider = CS.Slider;
+export const Sortable = CS.Sortable;
+export const Spinner = CS.Spinner;
+export const Splitter = CS.Splitter;
+export const Stat = CS.Stat;
+export const StatusIndicator = CS.StatusIndicator;
+export const Steps = CS.Steps;
+export const Switch = CS.Switch;
+export const Tab = CS.Tab;
+export const Tabs = CS.Tabs;
+export const Tag = CS.Tag;
+export const TagInput = CS.TagInput;
+export const Terminal = CS.Terminal;
+export const TextField = CS.TextField;
+export const Textarea = CS.Textarea;
+export const TimePicker = CS.TimePicker;
+export const Timeline = CS.Timeline;
+export const Toast = CS.Toast;
+export const ToastStack = CS.ToastStack;
+export const Toggle = CS.Toggle;
+export const Toolbar = CS.Toolbar;
+export const Tooltip = CS.Tooltip;
+export const Tour = CS.Tour;
+export const Transfer = CS.Transfer;
+export const Tree = CS.Tree;
+export const TreeSelect = CS.TreeSelect;
+export const TreeTable = CS.TreeTable;
+export const TypingIndicator = CS.TypingIndicator;
+export const Watermark = CS.Watermark;

package/assets/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 1007 1007"><path fill="#45210e" d="M560 1008H1V1h1007v1007zM440.744 105.242c-2.171 2.068-4.4 4.08-6.506 6.21-37.728 38.172-61.962 83.487-70.882 136.488-2.36 14.022-4.41 28.733-2.753 42.67 4.427 37.255 34.307 67.296 71.232 74.22 4.888.918 9.902 1.163 15.929 1.84-1.51-2.812-2.256-4.26-3.054-5.68-5.192-9.229-7.825-19.25-7.255-29.712 2.135-39.158 21.36-67.124 56.64-83.876 9.45-4.487 19.648-8.538 30.279-6.946 24.17 3.62 44.33 15.1 59.627 34.257 15.847 19.846 23.55 42.496 19.763 67.964-1.189 8-5.036 15.605-7.828 23.867 4.201-.47 8.805-.785 13.34-1.522 37.487-6.093 69.118-38.075 72.515-75.671 1.296-14.339-.387-29.378-3.24-43.59-17.973-89.498-69.792-152.094-152.662-189.532-3.326-1.502-6.153-1.46-9.47-.029-27.778 11.987-52.908 28.031-75.675 49.042M286.677 492.678c.653 1.116 1.159 2.355 1.98 3.328 21.113 24.994 46.099 45.217 75.389 59.805 10.361 5.161 21.069 10.782 32.246 12.939 36.571 7.055 73.5 6.794 110.317 1.2 36.274-5.51 71.028-15.995 103.646-33.011 25.725-13.42 55.49-9.83 77.058 9.673 3.51 3.175 6.566 6.854 9.902 10.373 21.959-19.3 40.836-40.8 56.705-65.068-1.04-.96-1.633-1.53-2.25-2.072-35.017-30.749-74.768-53.079-119.292-66.822-2.664-.822-5.954-.861-8.652-.14-32.782 8.757-65.488 17.797-98.277 26.522-3.148.838-6.914.759-10.077-.083-32.774-8.728-65.474-17.735-98.23-26.53-2.275-.611-5.027-.785-7.233-.108-46.038 14.128-87.032 37.24-123.232 69.994M638.194 649.76c-19.324 6.256-39.153 9.19-59.45 8.876-17.423-.268-34.364-3.702-51.178-7.964-2.044-.518-4.312-.811-6.37-.501-8.386 1.263-16.682 3.298-25.102 4.128-15.212 1.5-30.578 3.957-45.718 3.112-29.19-1.63-56.25-11.347-81.231-26.638-1.137-.696-2.374-1.228-4.265-2.194 14.942 49.084 37.506 93.01 68.722 132.546 35.26 44.657 41.712 93.365 19.106 145.655-3.127 7.234-7.496 13.93-11.284 20.878 131.798-36.76 233.763-162.329 239.669-296.985a37080 37080 0 0 1-42.9 19.087m-186.697-67.538c-9.145-.422-18.353-.312-27.42-1.393-12.676-1.511-25.858-2.147-37.744-6.27-31.995-11.098-59.986-29.321-84.622-52.609-1.69-1.597-3.418-3.152-5.836-5.378.152 1.886.106 2.564.27 3.186 8.166 30.822 23.303 57.835 46.464 79.656 40.378 38.04 87.656 55.359 143.827 47.992 69.257-9.082 132.412-32.884 189.265-73.42 4.976-3.548 9.777-7.339 14.882-11.185-13.558-18.139-31.007-26.474-53.02-25.35-11.518.589-21.222 6.065-31.328 10.839-48.638 22.973-99.979 34.005-154.738 33.932m88.18-146.114 116.081-31.589-59.88-27.53c-1.215 2.034-2.127 3.603-3.08 5.148-6.202 10.062-13.872 18.71-24.13 24.816-33.875 20.166-76.379 15.432-106.33-12.076-5.955-5.47-11.225-11.688-16.936-17.693l-58.576 27.23c2.444.743 3.82 1.201 5.219 1.583 37.383 10.192 74.877 20 112.088 30.783 11.65 3.375 22.551 4.582 33.812-.142.307-.129.626-.228 1.732-.53M636.17 641.72c57.035-20.402 93.583-59.754 109.617-118.173-55.975 59.895-123.443 100.518-203.282 121.826 27.618 7.5 61.135 6.171 93.665-3.653"></path><path fill="#f4ba17" d="M441.016 105.015C463.51 84.231 488.64 68.187 516.42 56.2c3.316-1.43 6.143-1.473 9.469.029 82.87 37.438 134.689 100.034 152.661 189.532 2.854 14.212 4.537 29.251 3.241 43.59-3.397 37.596-35.028 69.578-72.515 75.67-4.535.738-9.139 1.054-13.34 1.523 2.792-8.262 6.64-15.867 7.828-23.867 3.787-25.468-3.916-48.118-19.763-67.964-15.298-19.158-35.458-30.637-59.627-34.257-10.631-1.592-20.829 2.459-30.28 6.946-35.279 16.752-54.504 44.718-56.639 83.876-.57 10.463 2.063 20.483 7.255 29.713.798 1.419 1.544 2.867 3.054 5.679-6.027-.677-11.04-.922-15.93-1.84-36.924-6.924-66.804-36.965-71.231-74.22-1.656-13.937.393-28.648 2.753-42.67 8.92-53.001 33.154-98.316 70.882-136.488 2.107-2.13 4.335-4.142 6.778-6.437m82.78 95.95c-.817-.159-1.643-.28-2.449-.48-9.382-2.335-15.607-10.045-15.332-18.973.277-8.967 6.95-16.398 16.395-18.12 6.59-1.203 12.015 1.46 16.743 5.375l7.238-6.832c-11.183-12.066-31.065-12.008-42.626-.098-11.43 11.774-10.664 31.22 1.652 41.983 12.04 10.523 31.776 9.689 40.677-1.63l-6.667-7.014.152 1.466c-4.98 1.448-9.961 2.896-15.783 4.322M286.858 492.403c36.02-32.48 77.013-55.59 123.051-69.719 2.206-.677 4.958-.503 7.232.107 32.757 8.796 65.457 17.803 98.231 26.53 3.163.843 6.929.922 10.077.084 32.79-8.725 65.495-17.765 98.277-26.522 2.698-.721 5.988-.682 8.652.14 44.524 13.743 84.275 36.073 119.292 66.822.617.542 1.21 1.113 2.25 2.072-15.869 24.267-34.746 45.768-56.705 65.068-3.336-3.52-6.391-7.198-9.902-10.373-21.569-19.504-51.333-23.094-77.058-9.673-32.618 17.016-67.372 27.501-103.646 33.012-36.817 5.593-73.746 5.854-110.317-1.201-11.177-2.157-21.885-7.778-32.246-12.939-29.29-14.588-54.276-34.81-75.388-59.805-.822-.973-1.328-2.212-1.8-3.603M638.56 649.607c14.572-6.48 28.779-12.808 42.533-18.935-5.906 134.656-107.871 260.226-239.672 296.984 3.791-6.947 8.16-13.643 11.287-20.877 22.606-52.29 16.154-100.998-19.106-145.655-31.216-39.536-53.78-83.462-68.722-132.546 1.89.966 3.128 1.498 4.265 2.194 24.98 15.29 52.04 25.009 81.23 26.638 15.14.845 30.507-1.611 45.719-3.112 8.42-.83 16.716-2.865 25.103-4.128 2.057-.31 4.325-.017 6.369.501 16.814 4.262 33.755 7.696 51.178 7.964 20.297.314 40.126-2.62 59.815-9.028"></path><path fill="#f3b917" d="M451.997 582.225c54.258.07 105.6-10.963 154.237-33.936 10.106-4.774 19.81-10.25 31.329-10.839 22.012-1.124 39.46 7.211 53.019 25.35-5.105 3.846-9.906 7.638-14.882 11.185-56.853 40.536-120.008 64.338-189.265 73.42-56.171 7.367-103.45-9.951-143.827-47.992-23.16-21.82-38.298-48.834-46.463-79.656-.165-.622-.12-1.3-.271-3.186 2.418 2.226 4.146 3.781 5.836 5.378 24.636 23.288 52.627 41.511 84.622 52.61 11.886 4.122 25.068 4.758 37.744 6.27 9.067 1.08 18.275.97 27.92 1.396"></path><path fill="#f2b817" d="M539.28 436.202c-.71.207-1.029.306-1.336.435-11.26 4.724-22.162 3.517-33.812.142-37.211-10.782-74.705-20.591-112.088-30.783-1.398-.382-2.775-.84-5.22-1.584l58.577-27.23c5.711 6.005 10.98 12.224 16.937 17.694 29.95 27.508 72.454 32.242 106.328 12.076 10.26-6.107 17.93-14.754 24.131-24.816.953-1.545 1.865-3.114 3.08-5.148l59.88 27.53c-39.523 10.756-77.802 21.172-116.477 31.684M635.79 641.836c-32.15 9.708-65.668 11.036-93.286 3.537 79.84-21.308 147.307-61.931 203.282-121.826-16.034 58.419-52.582 97.77-109.996 118.29"></path><path fill="#48240f" d="M524.217 200.975c5.401-1.437 10.382-2.885 15.362-4.333l-.152-1.466 6.667 7.013c-8.901 11.32-28.637 12.154-40.677 1.631-12.316-10.764-13.082-30.21-1.652-41.983 11.561-11.91 31.443-11.968 42.626.098l-7.238 6.832c-4.728-3.914-10.154-6.578-16.743-5.376-9.446 1.723-16.118 9.154-16.395 18.12-.275 8.93 5.95 16.64 15.332 18.973.806.2 1.632.322 2.87.49"></path></svg>

package/assets/logo-mark.svg

@@ -0,0 +1,10 @@
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="100%" viewBox="0 0 1007 1007" enable-background="new 0 0 1007 1007" xml:space="preserve">
+<path fill="#45210E" opacity="1.000000" stroke="none" d="&#xA;M560.000000,1008.000000 &#xA;&#x9;C373.333344,1008.000000 187.166672,1008.000000 1.000000,1008.000000 &#xA;&#x9;C1.000000,672.333313 1.000000,336.666656 1.000000,1.000000 &#xA;&#x9;C336.666656,1.000000 672.333313,1.000000 1008.000000,1.000000 &#xA;&#x9;C1008.000000,336.666656 1008.000000,672.333313 1008.000000,1008.000000 &#xA;&#x9;C858.833313,1008.000000 709.666687,1008.000000 560.000000,1008.000000 &#xA;M440.743774,105.242386 &#xA;&#x9;C438.572540,107.309639 436.344940,109.321198 434.238464,111.452431 &#xA;&#x9;C396.510132,149.623566 372.276398,194.939011 363.356293,247.940109 &#xA;&#x9;C360.996429,261.961884 358.946777,276.673065 360.603027,290.610352 &#xA;&#x9;C365.030243,327.864777 394.910004,357.905762 431.834900,364.830811 &#xA;&#x9;C436.723083,365.747589 441.737213,365.993011 447.763702,366.669525 &#xA;&#x9;C446.254150,363.858124 445.507843,362.409912 444.709564,360.990906 &#xA;&#x9;C439.517578,351.761383 436.885193,341.740936 437.455444,331.277863 &#xA;&#x9;C439.589569,292.120056 458.815063,264.154144 494.094208,247.402267 &#xA;&#x9;C503.544983,242.914673 513.742554,238.863556 524.373901,240.455948 &#xA;&#x9;C548.543213,244.076111 568.703491,255.555466 584.000793,274.713074 &#xA;&#x9;C599.847656,294.559021 607.550598,317.209198 603.764282,342.677429 &#xA;&#x9;C602.575073,350.677063 598.728027,358.281586 595.936157,366.544159 &#xA;&#x9;C600.137085,366.074554 604.740540,365.758667 609.275574,365.021576 &#xA;&#x9;C646.763123,358.928711 678.394348,326.946808 681.791199,289.350922 &#xA;&#x9;C683.086792,275.012085 681.404419,259.972870 678.550415,245.760666 &#xA;&#x9;C660.577881,156.262833 608.759338,93.666801 525.888672,56.228947 &#xA;&#x9;C522.563171,54.726585 519.736023,54.769550 516.419739,56.200459 &#xA;&#x9;C488.640594,68.186523 463.511292,84.231010 440.743774,105.242386 &#xA;M286.676636,492.678345 &#xA;&#x9;C287.329773,493.793732 287.835724,495.033447 288.657562,496.006378 &#xA;&#x9;C309.770172,521.000305 334.755707,541.223022 364.045837,555.811401 &#xA;&#x9;C374.407410,560.972046 385.114655,566.593323 396.291962,568.749573 &#xA;&#x9;C432.863312,575.804749 469.791931,575.543579 506.608704,569.950623 &#xA;&#x9;C542.882812,564.440125 577.636902,553.955383 610.255371,536.938660 &#xA;&#x9;C635.979919,523.518494 665.744080,527.108459 687.312561,546.611755 &#xA;&#x9;C690.823608,549.786621 693.878845,553.465637 697.214539,556.985291 &#xA;&#x9;C719.173889,537.685486 738.051208,516.184204 753.920410,491.916840 &#xA;&#x9;C752.879761,490.957520 752.286987,490.387451 751.669678,489.845367 &#xA;&#x9;C716.653381,459.096100 676.901917,436.766174 632.377991,423.023193 &#xA;&#x9;C629.713745,422.200836 626.423889,422.161865 623.725525,422.882690 &#xA;&#x9;C590.944153,431.639587 558.238403,440.679779 525.448730,449.404907 &#xA;&#x9;C522.300964,450.242554 518.534851,450.164001 515.372437,449.321808 &#xA;&#x9;C482.598022,440.593750 449.897797,431.587128 417.141144,422.791412 &#xA;&#x9;C414.867096,422.180786 412.115295,422.006958 409.909119,422.683990 &#xA;&#x9;C363.870605,436.812317 322.877258,459.923096 286.676636,492.678345 &#xA;M638.193726,649.759216 &#xA;&#x9;C618.869507,656.015442 599.040955,658.948853 578.743958,658.635498 &#xA;&#x9;C561.320618,658.366577 544.380371,654.932678 527.565796,650.671387 &#xA;&#x9;C525.521851,650.153320 523.254150,649.859985 521.196533,650.169861 &#xA;&#x9;C512.810059,651.432678 504.514069,653.468018 496.093933,654.298462 &#xA;&#x9;C480.882416,655.798584 465.515686,658.255371 450.375763,657.410278 &#xA;&#x9;C421.185272,655.780762 394.125427,646.062805 369.145020,630.771667 &#xA;&#x9;C368.008179,630.075806 366.770874,629.544006 364.879761,628.577820 &#xA;&#x9;C379.822174,677.662048 402.386169,721.588440 433.601837,761.123535 &#xA;&#x9;C468.862305,805.781311 475.313782,854.488708 452.707825,906.779114 &#xA;&#x9;C449.580719,914.012512 445.212494,920.709351 441.423889,927.657288 &#xA;&#x9;C573.221985,890.897766 675.186523,765.328125 681.092896,630.672180 &#xA;&#x9;C667.338623,636.799011 653.131897,643.127319 638.193726,649.759216 &#xA;M451.496307,582.220520 &#xA;&#x9;C442.351196,581.799133 433.142700,581.909058 424.076202,580.828186 &#xA;&#x9;C411.400055,579.317017 398.218109,578.681030 386.332123,574.558289 &#xA;&#x9;C354.337128,563.460327 326.346069,545.236816 301.709656,521.949341 &#xA;&#x9;C300.020294,520.352478 298.291534,518.797302 295.873596,516.571472 &#xA;&#x9;C296.025665,518.456909 295.980042,519.134644 296.144836,519.756653 &#xA;&#x9;C304.310333,550.579102 319.447479,577.592346 342.608459,599.413086 &#xA;&#x9;C382.985504,637.453735 430.264038,654.771729 486.434967,647.405457 &#xA;&#x9;C555.692078,638.323059 618.847046,614.520935 675.700134,573.984924 &#xA;&#x9;C680.675537,570.437500 685.476868,566.646118 690.581665,562.800293 &#xA;&#x9;C677.023743,544.661377 659.575134,536.325806 637.562927,537.450195 &#xA;&#x9;C626.043884,538.038574 616.340271,543.514893 606.234131,548.288513 &#xA;&#x9;C557.596436,571.262329 506.255249,582.294250 451.496307,582.220520 &#xA;M539.676270,436.107300 &#xA;&#x9;C577.955139,425.690460 616.233948,415.273621 655.757202,404.518158 &#xA;&#x9;C635.089294,395.015900 615.544373,386.029968 595.877441,376.987946 &#xA;&#x9;C594.662292,379.021637 593.749573,380.591156 592.797180,382.136292 &#xA;&#x9;C586.595276,392.197998 578.925293,400.845184 568.666138,406.952454 &#xA;&#x9;C534.791809,427.117798 492.288269,422.383606 462.337891,394.876129 &#xA;&#x9;C456.381653,389.405701 451.112213,383.187500 445.401093,377.182709 &#xA;&#x9;C426.206024,386.105682 406.958923,395.052887 386.824615,404.412476 &#xA;&#x9;C389.268799,405.156464 390.645874,405.614380 392.043884,405.995544 &#xA;&#x9;C429.426819,416.187622 466.920624,425.996552 504.132446,436.778748 &#xA;&#x9;C515.781982,440.154175 526.683472,441.361206 537.944458,436.636871 &#xA;&#x9;C538.251221,436.508148 538.570312,436.408813 539.676270,436.107300 &#xA;M636.169495,641.720032 &#xA;&#x9;C693.203857,621.317932 729.752136,581.965942 745.785767,523.547119 &#xA;&#x9;C689.811462,583.441650 622.343140,624.064514 542.504456,645.372620 &#xA;&#x9;C570.121521,652.872437 603.639343,651.544189 636.169495,641.720032 &#xA;z"></path>
+<path fill="#F4BA17" opacity="1.000000" stroke="none" d="&#xA;M441.015747,105.015450 &#xA;&#x9;C463.511292,84.231010 488.640594,68.186523 516.419739,56.200459 &#xA;&#x9;C519.736023,54.769550 522.563171,54.726585 525.888672,56.228947 &#xA;&#x9;C608.759338,93.666801 660.577881,156.262833 678.550415,245.760666 &#xA;&#x9;C681.404419,259.972870 683.086792,275.012085 681.791199,289.350922 &#xA;&#x9;C678.394348,326.946808 646.763123,358.928711 609.275574,365.021576 &#xA;&#x9;C604.740540,365.758667 600.137085,366.074554 595.936157,366.544159 &#xA;&#x9;C598.728027,358.281586 602.575073,350.677063 603.764282,342.677429 &#xA;&#x9;C607.550598,317.209198 599.847656,294.559021 584.000793,274.713074 &#xA;&#x9;C568.703491,255.555466 548.543213,244.076111 524.373901,240.455948 &#xA;&#x9;C513.742554,238.863556 503.544983,242.914673 494.094208,247.402267 &#xA;&#x9;C458.815063,264.154144 439.589569,292.120056 437.455444,331.277863 &#xA;&#x9;C436.885193,341.740936 439.517578,351.761383 444.709564,360.990906 &#xA;&#x9;C445.507843,362.409912 446.254150,363.858124 447.763702,366.669525 &#xA;&#x9;C441.737213,365.993011 436.723083,365.747589 431.834900,364.830811 &#xA;&#x9;C394.910004,357.905762 365.030243,327.864777 360.603027,290.610352 &#xA;&#x9;C358.946777,276.673065 360.996429,261.961884 363.356293,247.940109 &#xA;&#x9;C372.276398,194.939011 396.510132,149.623566 434.238464,111.452431 &#xA;&#x9;C436.344940,109.321198 438.572540,107.309639 441.015747,105.015450 &#xA;M523.796143,200.964203 &#xA;&#x9;C522.979370,200.806061 522.153381,200.684708 521.347168,200.484161 &#xA;&#x9;C511.964752,198.150375 505.739960,190.440384 506.015442,181.511810 &#xA;&#x9;C506.292053,172.544968 512.964478,165.113678 522.410034,163.391052 &#xA;&#x9;C528.999146,162.189362 534.425354,164.852509 539.153198,168.766846 &#xA;&#x9;C541.656067,166.404358 544.030029,164.163544 546.391113,161.934906 &#xA;&#x9;C535.207764,149.868927 515.326111,149.927109 503.764648,161.836975 &#xA;&#x9;C492.335419,173.610657 493.100830,193.056198 505.417236,203.820190 &#xA;&#x9;C517.457336,214.342712 537.192993,213.508774 546.093628,202.189407 &#xA;&#x9;C543.863281,199.842941 541.645081,197.509277 539.426880,195.175613 &#xA;&#x9;C539.477722,195.664429 539.528503,196.153259 539.579346,196.642075 &#xA;&#x9;C534.598694,198.089890 529.617981,199.537689 523.796143,200.964203 &#xA;z"></path>
+<path fill="#F4BA17" opacity="1.000000" stroke="none" d="&#xA;M286.857971,492.402985 &#xA;&#x9;C322.877258,459.923096 363.870605,436.812317 409.909119,422.683990 &#xA;&#x9;C412.115295,422.006958 414.867096,422.180786 417.141144,422.791412 &#xA;&#x9;C449.897797,431.587128 482.598022,440.593750 515.372437,449.321808 &#xA;&#x9;C518.534851,450.164001 522.300964,450.242554 525.448730,449.404907 &#xA;&#x9;C558.238403,440.679779 590.944153,431.639587 623.725525,422.882690 &#xA;&#x9;C626.423889,422.161865 629.713745,422.200836 632.377991,423.023193 &#xA;&#x9;C676.901917,436.766174 716.653381,459.096100 751.669678,489.845367 &#xA;&#x9;C752.286987,490.387451 752.879761,490.957520 753.920410,491.916840 &#xA;&#x9;C738.051208,516.184204 719.173889,537.685486 697.214539,556.985291 &#xA;&#x9;C693.878845,553.465637 690.823608,549.786621 687.312561,546.611755 &#xA;&#x9;C665.744080,527.108459 635.979919,523.518494 610.255371,536.938660 &#xA;&#x9;C577.636902,553.955383 542.882812,564.440125 506.608704,569.950623 &#xA;&#x9;C469.791931,575.543579 432.863312,575.804749 396.291962,568.749573 &#xA;&#x9;C385.114655,566.593323 374.407410,560.972046 364.045837,555.811401 &#xA;&#x9;C334.755707,541.223022 309.770172,521.000305 288.657562,496.006378 &#xA;&#x9;C287.835724,495.033447 287.329773,493.793732 286.857971,492.402985 &#xA;z"></path>
+<path fill="#F4BA17" opacity="1.000000" stroke="none" d="&#xA;M638.559448,649.607422 &#xA;&#x9;C653.131897,643.127319 667.338623,636.799011 681.092896,630.672180 &#xA;&#x9;C675.186523,765.328125 573.221985,890.897766 441.421356,927.655945 &#xA;&#x9;C445.212494,920.709351 449.580719,914.012512 452.707825,906.779114 &#xA;&#x9;C475.313782,854.488708 468.862305,805.781311 433.601837,761.123535 &#xA;&#x9;C402.386169,721.588440 379.822174,677.662048 364.879761,628.577820 &#xA;&#x9;C366.770874,629.544006 368.008179,630.075806 369.145020,630.771667 &#xA;&#x9;C394.125427,646.062805 421.185272,655.780762 450.375763,657.410278 &#xA;&#x9;C465.515686,658.255371 480.882416,655.798584 496.093933,654.298462 &#xA;&#x9;C504.514069,653.468018 512.810059,651.432678 521.196533,650.169861 &#xA;&#x9;C523.254150,649.859985 525.521851,650.153320 527.565796,650.671387 &#xA;&#x9;C544.380371,654.932678 561.320618,658.366577 578.743958,658.635498 &#xA;&#x9;C599.040955,658.948853 618.869507,656.015442 638.559448,649.607422 &#xA;z"></path>
+<path fill="#F3B917" opacity="1.000000" stroke="none" d="&#xA;M451.996887,582.225220 &#xA;&#x9;C506.255249,582.294250 557.596436,571.262329 606.234131,548.288513 &#xA;&#x9;C616.340271,543.514893 626.043884,538.038574 637.562927,537.450195 &#xA;&#x9;C659.575134,536.325806 677.023743,544.661377 690.581665,562.800293 &#xA;&#x9;C685.476868,566.646118 680.675537,570.437500 675.700134,573.984924 &#xA;&#x9;C618.847046,614.520935 555.692078,638.323059 486.434967,647.405457 &#xA;&#x9;C430.264038,654.771729 382.985504,637.453735 342.608459,599.413086 &#xA;&#x9;C319.447479,577.592346 304.310333,550.579102 296.144836,519.756653 &#xA;&#x9;C295.980042,519.134644 296.025665,518.456909 295.873596,516.571472 &#xA;&#x9;C298.291534,518.797302 300.020294,520.352478 301.709656,521.949341 &#xA;&#x9;C326.346069,545.236816 354.337128,563.460327 386.332123,574.558289 &#xA;&#x9;C398.218109,578.681030 411.400055,579.317017 424.076202,580.828186 &#xA;&#x9;C433.142700,581.909058 442.351196,581.799133 451.996887,582.225220 &#xA;z"></path>
+<path fill="#F2B817" opacity="1.000000" stroke="none" d="&#xA;M539.279968,436.201538 &#xA;&#x9;C538.570312,436.408813 538.251221,436.508148 537.944458,436.636871 &#xA;&#x9;C526.683472,441.361206 515.781982,440.154175 504.132446,436.778748 &#xA;&#x9;C466.920624,425.996552 429.426819,416.187622 392.043884,405.995544 &#xA;&#x9;C390.645874,405.614380 389.268799,405.156464 386.824615,404.412476 &#xA;&#x9;C406.958923,395.052887 426.206024,386.105682 445.401093,377.182709 &#xA;&#x9;C451.112213,383.187500 456.381653,389.405701 462.337891,394.876129 &#xA;&#x9;C492.288269,422.383606 534.791809,427.117798 568.666138,406.952454 &#xA;&#x9;C578.925293,400.845184 586.595276,392.197998 592.797180,382.136292 &#xA;&#x9;C593.749573,380.591156 594.662292,379.021637 595.877441,376.987946 &#xA;&#x9;C615.544373,386.029968 635.089294,395.015900 655.757202,404.518158 &#xA;&#x9;C616.233948,415.273621 577.955139,425.690460 539.279968,436.201538 &#xA;z"></path>
+<path fill="#F2B817" opacity="1.000000" stroke="none" d="&#xA;M635.789856,641.836487 &#xA;&#x9;C603.639343,651.544189 570.121521,652.872437 542.504456,645.372620 &#xA;&#x9;C622.343140,624.064514 689.811462,583.441650 745.785767,523.547119 &#xA;&#x9;C729.752136,581.965942 693.203857,621.317932 635.789856,641.836487 &#xA;z"></path>
+<path fill="#48240F" opacity="1.000000" stroke="none" d="&#xA;M524.216736,200.974854 &#xA;&#x9;C529.617981,199.537689 534.598694,198.089890 539.579346,196.642075 &#xA;&#x9;C539.528503,196.153259 539.477722,195.664429 539.426880,195.175613 &#xA;&#x9;C541.645081,197.509277 543.863281,199.842941 546.093628,202.189407 &#xA;&#x9;C537.192993,213.508774 517.457336,214.342712 505.417236,203.820190 &#xA;&#x9;C493.100830,193.056198 492.335419,173.610657 503.764648,161.836975 &#xA;&#x9;C515.326111,149.927109 535.207764,149.868927 546.391113,161.934906 &#xA;&#x9;C544.030029,164.163544 541.656067,166.404358 539.153198,168.766846 &#xA;&#x9;C534.425354,164.852509 528.999146,162.189362 522.410034,163.391052 &#xA;&#x9;C512.964478,165.113678 506.292053,172.544968 506.015442,181.511810 &#xA;&#x9;C505.739960,190.440384 511.964752,198.150375 521.347168,200.484161 &#xA;&#x9;C522.153381,200.684708 522.979370,200.806061 524.216736,200.974854 &#xA;z"></path>
+</svg>

package/base/a11y.css

@@ -0,0 +1,57 @@
+/* CyberSkill — accessibility layer. Loaded after the component base styles so its
+ * touch-target sizes win, and before the responsive layer. Two concerns:
+ *   1. Touch ergonomics — guarantee a 44px hit target on COARSE pointers (finger),
+ *      while desktop mouse density is preserved. `pointer: coarse` is more correct
+ *      than a width breakpoint: a 1280px touch laptop still needs 44px targets.
+ *      (Button already carries its own coarse block in components.css.)
+ *   2. Reduced motion — honour the OS "reduce motion" setting globally, so every
+ *      animation/transition across components and templates calms down at once.
+ * Focus rings are NOT here — they are already systematic (global :focus-visible in
+ * reset.css + per-component 3px ochre rings in components/forms/navigation/controls). */
+
+/* ---- 1. Touch targets: 44px minimum on coarse pointers ---- */
+@media (pointer: coarse) {
+  /* Primary navigation & action targets → full 44px */
+  .cs-tab { min-height: 44px; }
+  .cs-pagination button { block-size: 44px; min-inline-size: 44px; }
+  .cs-menu__item { min-height: 44px; }
+  .cs-stepper button { min-block-size: 44px; }
+  .cs-stepper input { min-height: 44px; }
+  .cs-breadcrumb a { display: inline-flex; align-items: center; min-height: 40px; }
+
+  /* Compact toggles sit in a padded track — 40px inner clears 44px outer */
+  .cs-segmented button { min-height: 40px; }
+
+  /* Selection controls: enlarge the native box; the label extends the target */
+  .cs-check input, .cs-radio input { inline-size: 24px; block-size: 24px; }
+  .cs-check, .cs-radio { min-height: 44px; align-items: center; }
+  .cs-switch { min-height: 44px; }
+
+  /* Icon-only affordances inside a larger row */
+  .cs-search__clear { min-inline-size: 32px; min-block-size: 32px; }
+  .cs-ai-disclosure__badge { min-height: 32px; }
+
+  /* Slider: native <input type=range> thumb size is browser-controlled (no custom
+   * ::-webkit-slider-thumb here) so an exact 44px hit region can't be guaranteed —
+   * widen the track's rendered band to give the thumb more room to land. */
+  .cs-slider { block-size: 32px !important; }
+}
+
+/* ---- 2. Reduced motion: honour the user's OS setting everywhere ---- */
+@media (prefers-reduced-motion: reduce) {
+  *, *::before, *::after {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+    scroll-behavior: auto !important;
+  }
+}
+
+/* ---- 3. High contrast: honour prefers-contrast: more by strengthening the
+ * warm hairline border and muted text (both are intentionally soft by default).
+ * Only activates on user request; anchors (Umber/Ochre) and focus rings are
+ * already high-contrast and untouched. ---- */
+@media (prefers-contrast: more) {
+  :root { --cs-color-border-default: #9a8060; --cs-color-text-muted: #5a4638; }
+  [data-theme="dark"] { --cs-color-border-default: #7a6450; --cs-color-text-muted: #d8c9b6; }
+}

package/base/ai.css

@@ -0,0 +1,67 @@
+/* CyberSkill — AI-native surfaces (.cs-*). The brand is AI-native: Lumi (the
+ * golden genie) converses, then hands clear wishes to a human. These pair with
+ * AIDisclosureBadge + HumanReviewGate (base/components.css). */
+
+/* PromptInput */
+.cs-prompt { border: 1px solid var(--cs-color-border-default); border-radius: var(--cs-radius-lg); background: var(--cs-color-surface-panel); padding: 10px 12px; display: grid; gap: 8px; }
+.cs-prompt:focus-within { border-color: var(--cs-color-brand-ochre); box-shadow: 0 0 0 3px color-mix(in oklab, var(--cs-color-brand-ochre) 32%, transparent); }
+.cs-prompt__field { border: 0; background: transparent; resize: none; font: inherit; font-family: var(--cs-font-family-ui); color: var(--cs-color-text-primary); min-height: 44px; outline: 0; inline-size: 100%; line-height: var(--cs-font-lineHeight-body); }
+.cs-prompt__field::placeholder { color: var(--cs-color-text-muted); }
+.cs-prompt__bar { display: flex; align-items: center; gap: 10px; }
+.cs-prompt__hint { display: inline-flex; align-items: center; gap: 6px; margin-inline-end: auto; font-size: var(--cs-font-size-xs); color: var(--cs-color-text-muted); }
+.cs-prompt__hint svg { color: var(--cs-color-brand-ochre); }
+
+/* ChatMessage */
+.cs-chat { display: grid; gap: 14px; }
+.cs-chat-msg { display: flex; gap: 10px; align-items: flex-start; }
+.cs-chat-msg--user { flex-direction: row-reverse; }
+.cs-chat-msg__avatar { flex: none; inline-size: 32px; block-size: 32px; border-radius: 50%; display: grid; place-items: center; overflow: hidden; }
+.cs-chat-msg--lumi .cs-chat-msg__avatar { background: var(--cs-color-brand-ochre); color: var(--cs-color-brand-umber); }
+.cs-chat-msg--user .cs-chat-msg__avatar { background: var(--cs-color-brand-umber); color: #fff; font-weight: 700; font-size: 13px; font-family: var(--cs-font-family-ui); }
+.cs-chat-msg__avatar img { inline-size: 100%; block-size: 100%; object-fit: cover; }
+.cs-chat-msg__col { display: grid; gap: 3px; max-inline-size: 80%; }
+.cs-chat-msg--user .cs-chat-msg__col { justify-items: end; }
+.cs-chat-msg__name { font-size: var(--cs-font-size-xs); font-weight: 700; color: var(--cs-color-text-muted); }
+.cs-chat-msg__bubble { padding: 10px 14px; border-radius: 14px; font-size: var(--cs-font-size-sm); line-height: var(--cs-font-lineHeight-body); }
+.cs-chat-msg--lumi .cs-chat-msg__bubble { background: var(--cs-color-surface-raised); border: 1px solid var(--cs-color-border-default); border-end-start-radius: 4px; color: var(--cs-color-text-primary); }
+.cs-chat-msg--user .cs-chat-msg__bubble { background: var(--cs-color-brand-umber); color: #fff; border-end-end-radius: 4px; }
+
+/* ConfidenceMeter */
+.cs-confidence { display: grid; gap: 6px; font-family: var(--cs-font-family-ui); }
+.cs-confidence__head { display: flex; align-items: baseline; justify-content: space-between; font-size: var(--cs-font-size-xs); color: var(--cs-color-text-muted); text-transform: uppercase; letter-spacing: var(--cs-letter-spacing-caps); }
+.cs-confidence__level { font-weight: 700; letter-spacing: 0; text-transform: none; font-size: var(--cs-font-size-sm); }
+.cs-confidence__track { display: flex; gap: 3px; }
+.cs-confidence__seg { block-size: 8px; flex: 1; border-radius: 2px; background: var(--cs-color-surface-raised); }
+
+/* ---- AI-native wave 2 — Lumi's conversational surfaces (merged from ai2.css) ---- */
+
+/* PromptSuggestions (wish chips) */
+.cs-suggest { display: flex; flex-wrap: wrap; gap: 8px; }
+.cs-suggest button { border: 1px solid var(--cs-color-border-default); background: var(--cs-color-surface-panel); border-radius: var(--cs-radius-full); padding: 8px 14px; font: inherit; font-family: var(--cs-font-family-ui); font-weight: 600; font-size: var(--cs-font-size-sm); color: var(--cs-color-text-accent); cursor: pointer; display: inline-flex; align-items: center; gap: 7px; }
+.cs-suggest button:hover { border-color: var(--cs-color-brand-ochre); background: color-mix(in oklab, var(--cs-color-brand-ochre) 8%, var(--cs-color-surface-panel)); }
+.cs-suggest button svg { color: var(--cs-color-brand-ochre); }
+
+/* TypingIndicator */
+.cs-typing { display: inline-flex; align-items: center; gap: 5px; padding: 12px 16px; background: var(--cs-color-surface-raised); border: 1px solid var(--cs-color-border-default); border-radius: 14px; border-end-start-radius: 4px; }
+.cs-typing span { inline-size: 7px; block-size: 7px; border-radius: 50%; background: var(--cs-color-text-muted); animation: cs-typing 1.2s var(--cs-ease-standard) infinite; }
+.cs-typing span:nth-child(2) { animation-delay: 0.18s; }
+.cs-typing span:nth-child(3) { animation-delay: 0.36s; }
+@keyframes cs-typing { 0%, 60%, 100% { transform: translateY(0); opacity: 0.5; } 30% { transform: translateY(-4px); opacity: 1; } }
+@media (prefers-reduced-motion: reduce) { .cs-typing span { animation: none; opacity: 0.7; } }
+
+/* CitationList */
+.cs-citations { display: grid; gap: 8px; }
+.cs-citations__label { font-size: var(--cs-font-size-xs); text-transform: uppercase; letter-spacing: var(--cs-letter-spacing-caps); color: var(--cs-color-text-muted); }
+.cs-citation { display: flex; align-items: flex-start; gap: 9px; font-size: var(--cs-font-size-sm); color: var(--cs-color-text-primary); text-decoration: none; }
+a.cs-citation:hover .cs-citation__text { color: var(--cs-color-text-accent); }
+.cs-citation__num { flex: none; inline-size: 20px; block-size: 20px; border-radius: 6px; background: color-mix(in oklab, var(--cs-color-semantic-info) 14%, var(--cs-color-surface-panel)); color: var(--cs-color-semantic-info); font-family: var(--cs-font-family-mono); font-size: 11px; font-weight: 700; display: grid; place-items: center; }
+.cs-citation__text { line-height: 1.4; }
+.cs-citation__src { color: var(--cs-color-text-muted); font-size: var(--cs-font-size-xs); }
+
+/* LumiAvatar */
+.cs-lumi { display: inline-grid; place-items: center; overflow: hidden; border-radius: 50%; background: radial-gradient(circle at 50% 30%, #ffd873, var(--cs-color-brand-ochre)); color: var(--cs-color-brand-umber); flex: none; }
+.cs-lumi img { inline-size: 100%; block-size: 100%; object-fit: cover; }
+.cs-lumi--sm { inline-size: 32px; block-size: 32px; }
+.cs-lumi--md { inline-size: 44px; block-size: 44px; }
+.cs-lumi--lg { inline-size: 64px; block-size: 64px; }
+.cs-lumi--ring { box-shadow: 0 0 0 3px color-mix(in oklab, var(--cs-color-brand-ochre) 34%, transparent); }

package/base/collections.css

@@ -0,0 +1,53 @@
+/* CyberSkill — collections + content wave 2 (.cs-*). */
+
+/* List */
+.cs-list { display: grid; gap: 2px; }
+.cs-list__item { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: var(--cs-radius-md); color: var(--cs-color-text-primary); text-align: start; }
+.cs-list__item--button { border: 0; background: transparent; font: inherit; inline-size: 100%; cursor: pointer; }
+.cs-list__item--button:hover { background: var(--cs-color-surface-raised); }
+.cs-list__lead { flex: none; color: var(--cs-color-text-accent); display: grid; place-items: center; }
+.cs-list__main { flex: 1; min-inline-size: 0; display: grid; gap: 1px; }
+.cs-list__title { font-weight: 600; font-size: var(--cs-font-size-sm); }
+.cs-list__sub { font-size: var(--cs-font-size-xs); color: var(--cs-color-text-muted); }
+.cs-list__trail { flex: none; color: var(--cs-color-text-muted); font-size: var(--cs-font-size-sm); }
+
+/* DescriptionList */
+.cs-dl { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 14px 24px; margin: 0; }
+.cs-dl dt { font-size: var(--cs-font-size-xs); text-transform: uppercase; letter-spacing: var(--cs-letter-spacing-caps); color: var(--cs-color-text-muted); }
+.cs-dl dd { margin: 2px 0 0; font-size: var(--cs-font-size-sm); color: var(--cs-color-text-primary); }
+
+/* Timeline */
+.cs-timeline { display: grid; }
+.cs-timeline__item { display: grid; grid-template-columns: 26px 1fr; gap: 14px; padding-block-end: 20px; position: relative; }
+.cs-timeline__item:not(:last-child)::before { content: ""; position: absolute; inset-block: 26px 0; inset-inline-start: 12px; inline-size: 2px; background: var(--cs-color-border-default); }
+.cs-timeline__marker { inline-size: 26px; block-size: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--cs-color-semantic-success); color: #fff; font-size: 12px; font-weight: 700; z-index: 1; }
+.cs-timeline__item--now .cs-timeline__marker { background: var(--cs-color-brand-ochre); color: var(--cs-color-brand-umber); }
+.cs-timeline__item--todo .cs-timeline__marker { background: var(--cs-color-surface-raised); color: var(--cs-color-text-muted); border: 1px solid var(--cs-color-border-default); }
+.cs-timeline__title { font-weight: 700; margin: 2px 0 2px; }
+.cs-timeline__meta { font-size: var(--cs-font-size-xs); color: var(--cs-color-text-muted); font-family: var(--cs-font-family-mono); }
+.cs-timeline__body { font-size: var(--cs-font-size-sm); color: var(--cs-color-text-muted); margin-block-start: 4px; }
+
+/* Accordion */
+.cs-accordion { border: 1px solid var(--cs-color-border-default); border-radius: var(--cs-radius-lg); overflow: hidden; background: var(--cs-color-surface-panel); }
+.cs-accordion__item + .cs-accordion__item { border-block-start: 1px solid var(--cs-color-border-default); }
+.cs-accordion__trigger { inline-size: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 18px; border: 0; background: transparent; font: inherit; font-family: var(--cs-font-family-ui); font-weight: 600; color: var(--cs-color-text-primary); cursor: pointer; text-align: start; }
+.cs-accordion__trigger:hover { background: var(--cs-color-surface-raised); }
+.cs-accordion__chevron { flex: none; color: var(--cs-color-text-muted); transition: transform var(--cs-duration-fast) var(--cs-ease-standard); }
+.cs-accordion__trigger[aria-expanded="true"] .cs-accordion__chevron { transform: rotate(180deg); }
+.cs-accordion__panel { padding: 0 18px 16px; color: var(--cs-color-text-muted); font-size: var(--cs-font-size-sm); line-height: var(--cs-font-lineHeight-body); }
+
+/* CodeBlock */
+.cs-code { position: relative; background: #2b1e14; color: #f5ead9; border-radius: var(--cs-radius-lg); overflow: hidden; border: 1px solid #4a3a2c; }
+.cs-code__bar { display: flex; align-items: center; justify-content: space-between; padding: 8px 14px; border-block-end: 1px solid #4a3a2c; font-family: var(--cs-font-family-mono); font-size: var(--cs-font-size-xs); color: #c9b7a3; }
+.cs-code__copy { border: 0; background: transparent; color: #c9b7a3; cursor: pointer; font: inherit; font-family: var(--cs-font-family-ui); font-weight: 600; }
+.cs-code__copy:hover { color: var(--cs-color-brand-ochre); }
+.cs-code pre { margin: 0; padding: 14px 16px; overflow: auto; font-family: var(--cs-font-family-mono); font-size: 13px; line-height: 1.6; }
+.cs-code code { font-family: inherit; }
+
+/* EmptyState */
+.cs-empty { text-align: center; padding: 48px 24px; display: grid; gap: 8px; justify-items: center; }
+.cs-empty__icon { inline-size: 56px; block-size: 56px; border-radius: 50%; display: grid; place-items: center; background: color-mix(in oklab, var(--cs-color-brand-ochre) 24%, var(--cs-color-surface-panel)); color: var(--cs-color-brand-umber); margin-block-end: 6px; }
+[data-theme="dark"] .cs-empty__icon { color: var(--cs-color-brand-ochre); }
+.cs-empty__title { font-size: var(--cs-text-h4); font-weight: 700; }
+.cs-empty__body { color: var(--cs-color-text-muted); max-inline-size: 380px; }
+.cs-empty__actions { margin-block-start: 12px; display: flex; gap: 10px; }

package/base/components.css

@@ -0,0 +1,212 @@
+/* CyberSkill — base component styles (.cs-*).
+ * Ported verbatim from @cyberskill/react base styles, with the button variants
+ * (tertiary, danger-ghost) and xs size that the TypeScript contract declares
+ * added in the same token vocabulary. Light default; dark/system opt-in. */
+
+/* ---- Button ---- */
+.cs-button {
+  align-items: center;
+  background: var(--cs-component-button-primary-bg, #45210e);
+  border: 1px solid transparent;
+  border-radius: var(--cs-component-button-radius, var(--cs-radius-md, 8px));
+  color: var(--cs-component-button-primary-fg, #ffffff);
+  cursor: pointer;
+  display: inline-flex;
+  font: inherit;
+  font-weight: 700;
+  gap: var(--cs-component-button-gap, 0.5rem);
+  justify-content: center;
+  line-height: 1.2;
+  min-height: var(--cs-component-button-md-minHeight, 44px);
+  min-width: var(--cs-component-button-md-minHeight, 44px);
+  padding-block: var(--cs-component-button-md-paddingY, 12px);
+  padding-inline: var(--cs-component-button-md-paddingX, 20px);
+  transition: background var(--cs-duration-fast, 120ms) var(--cs-ease-standard, ease),
+    border-color var(--cs-duration-fast, 120ms) var(--cs-ease-standard, ease),
+    filter var(--cs-duration-fast, 120ms) var(--cs-ease-standard, ease);
+}
+.cs-button:hover { filter: brightness(1.08); }
+.cs-button:active { transform: translateY(0.5px); }
+
+.cs-button:focus-visible,
+.cs-field__control:focus-visible,
+.cs-ai-disclosure__badge:focus-visible {
+  outline: 3px solid var(--cs-color-accent-ochre, #f4ba17);
+  outline-offset: 2px;
+}
+
+.cs-button--secondary {
+  background: var(--cs-color-surface-panel, #ffffff);
+  border-color: var(--cs-color-brand-umber, #45210e);
+  color: var(--cs-color-brand-umber, #45210e);
+}
+.cs-button--secondary:hover { background: var(--cs-color-surface-raised, #fbf4e9); filter: none; }
+
+.cs-button--tertiary {
+  background: var(--cs-color-surface-raised, #fbf4e9);
+  border-color: transparent;
+  color: var(--cs-color-brand-umber, #45210e);
+}
+.cs-button--tertiary:hover { filter: none; border-color: var(--cs-color-border-default, #e7d9c6); }
+
+.cs-button--ghost {
+  background: transparent;
+  color: var(--cs-color-brand-umber, #45210e);
+}
+.cs-button--ghost:hover { background: var(--cs-color-surface-raised, #fbf4e9); filter: none; }
+
+/* Dark theme: umber text/border on the low-emphasis buttons is invisible on dark surfaces —
+   remap so secondary reads as an ochre outline and tertiary/ghost use the light body colour. */
+[data-theme="dark"] .cs-button--secondary { color: var(--cs-color-brand-ochre); border-color: var(--cs-color-brand-ochre); }
+[data-theme="dark"] .cs-button--tertiary { color: var(--cs-color-text-primary); }
+[data-theme="dark"] .cs-button--ghost { color: var(--cs-color-text-primary); }
+
+.cs-button--danger {
+  background: var(--cs-color-semantic-danger, #b42318);
+  color: var(--cs-color-text-inverse, #ffffff);
+}
+
+.cs-button--danger-ghost {
+  background: transparent;
+  color: var(--cs-color-semantic-danger, #b42318);
+}
+.cs-button--danger-ghost:hover { background: color-mix(in oklab, var(--cs-color-semantic-danger, #b42318) 10%, transparent); filter: none; }
+
+.cs-button--xs {
+  min-height: var(--cs-component-button-xs-minHeight, 28px);
+  min-width: var(--cs-component-button-xs-minWidth, 28px);
+  padding-block: var(--cs-component-button-xs-paddingY, 4px);
+  padding-inline: var(--cs-component-button-xs-paddingX, 10px);
+  font-size: var(--cs-font-size-sm, 0.875rem);
+}
+.cs-button--sm {
+  min-height: var(--cs-component-button-sm-minHeight, 36px);
+  min-width: var(--cs-component-button-sm-minHeight, 36px);
+  padding-block: var(--cs-component-button-sm-paddingY, 8px);
+  padding-inline: var(--cs-component-button-sm-paddingX, 14px);
+}
+.cs-button--lg {
+  min-height: var(--cs-component-button-lg-minHeight, 52px);
+  padding-block: var(--cs-component-button-lg-paddingY, 16px);
+  padding-inline: var(--cs-component-button-lg-paddingX, 28px);
+}
+.cs-button--full { inline-size: 100%; }
+
+.cs-button.is-disabled,
+.cs-button.is-loading,
+.cs-field.is-disabled { opacity: 0.58; cursor: not-allowed; }
+
+.cs-button__spinner {
+  inline-size: 1em; block-size: 1em; border-radius: 999px;
+  border: 2px solid currentColor; border-right-color: transparent;
+  animation: cs-spin 0.6s linear infinite;
+}
+@keyframes cs-spin { to { transform: rotate(360deg); } }
+@media (prefers-reduced-motion: reduce) { .cs-button__spinner { animation-duration: 1.4s; } }
+
+/* Touch ergonomics: bump small sizes on coarse pointers (tokenized). */
+@media (pointer: coarse) {
+  .cs-button { min-height: var(--cs-component-button-md-minHeight-coarse, var(--cs-component-button-md-minHeight, 44px)); }
+  .cs-button--sm { min-height: var(--cs-component-button-sm-minHeight-coarse, 40px); }
+  .cs-button--xs { min-height: var(--cs-component-button-xs-minHeight-coarse, 36px); }
+}
+
+/* ---- TextField ---- */
+.cs-field { color: var(--cs-color-text-primary, #45210e); display: grid; gap: 0.375rem; }
+.cs-field__label { font-weight: 700; }
+.cs-field__description { color: var(--cs-color-text-muted, #6e5a4c); font-size: 0.875rem; }
+.cs-field__control {
+  border: 1px solid var(--cs-component-textfield-border-default, #bfa58f);
+  border-radius: var(--cs-radius-md, 8px);
+  background: var(--cs-color-surface-panel, #fff);
+  color: var(--cs-color-text-primary, #45210e);
+  font: inherit;
+  min-height: var(--cs-component-textfield-minHeight, 44px);
+  padding-block: var(--cs-component-textfield-paddingY, 10px);
+  padding-inline: var(--cs-component-textfield-paddingX, 12px);
+}
+.cs-field__control::placeholder { color: var(--cs-color-text-muted, #6e5a4c); opacity: 0.7; }
+.cs-field.is-invalid .cs-field__control { border-color: var(--cs-color-semantic-danger, #b42318); }
+.cs-field__error { color: var(--cs-color-semantic-danger, #b42318); font-size: 0.875rem; }
+
+/* ---- Dialog ---- */
+.cs-dialog-layer { inset: 0; position: fixed; z-index: 1000; }
+.cs-dialog__overlay { background: rgba(31, 19, 11, 0.42); inset: 0; position: absolute; }
+.cs-dialog {
+  background: var(--cs-color-surface-panel, #ffffff);
+  border-radius: var(--cs-radius-md, 8px);
+  box-shadow: var(--cs-shadow-xl, 0 24px 80px rgba(31, 19, 11, 0.26));
+  color: var(--cs-color-text-primary, #45210e);
+  left: 50%;
+  max-inline-size: min(42rem, calc(100vw - 2rem));
+  padding: var(--cs-space-6, 24px);
+  position: absolute;
+  top: 12vh;
+  transform: translateX(-50%);
+  width: 100%;
+}
+.cs-dialog__header,
+.cs-dialog__actions,
+.cs-review-gate__actions {
+  align-items: center; display: flex; flex-wrap: wrap; gap: 0.75rem; justify-content: space-between;
+}
+.cs-dialog__actions { justify-content: flex-end; }
+.cs-dialog__title { font-size: 1.25rem; line-height: 1.35; margin: 0; }
+.cs-dialog__body { margin-block: 1rem; }
+@media (max-width: 640px) {
+  .cs-dialog { max-inline-size: calc(100vw - 1rem); top: 4vh; padding: var(--cs-space-4, 16px); }
+  .cs-dialog__actions .cs-button, .cs-review-gate__actions .cs-button { flex: 1 1 auto; }
+}
+
+/* ---- DataTable ---- */
+.cs-table-wrap { overflow: auto; }
+.cs-table { border-collapse: collapse; color: var(--cs-color-text-primary, #45210e); inline-size: 100%; }
+.cs-table th, .cs-table td {
+  border-block-end: 1px solid rgba(69, 33, 14, 0.18);
+  padding: 0.625rem 0.75rem; text-align: start;
+}
+.cs-table thead th {
+  font-size: var(--cs-font-size-xs, 0.75rem); text-transform: uppercase;
+  letter-spacing: var(--cs-letter-spacing-caps, 0.08em); color: var(--cs-color-text-muted, #6e5a4c);
+}
+.cs-table caption { font-weight: 700; margin-block-end: 0.5rem; text-align: start; }
+.cs-table__empty { color: var(--cs-color-text-muted, #6e5a4c); }
+
+/* ---- AIDisclosureBadge ---- */
+.cs-ai-disclosure { display: inline-block; position: relative; }
+.cs-ai-disclosure__badge {
+  background: var(--cs-color-semantic-info, #1d4ed8); border: 0; border-radius: 999px;
+  color: #ffffff; font: inherit; font-size: 0.875rem; font-weight: 700;
+  padding: 0.25rem 0.625rem; cursor: pointer;
+}
+.cs-ai-disclosure__panel {
+  background: var(--cs-color-surface-panel, #ffffff);
+  border: 1px solid rgba(69, 33, 14, 0.18); border-radius: var(--cs-radius-md, 8px);
+  box-shadow: var(--cs-shadow-md, 0 12px 30px rgba(31, 19, 11, 0.18));
+  display: grid; gap: 0.375rem; inset-block-start: calc(100% + 0.375rem); inset-inline-start: 0;
+  min-inline-size: 18rem; padding: 0.75rem; position: absolute; z-index: 20;
+}
+.cs-ai-disclosure__sources { color: var(--cs-color-text-muted, #6e5a4c); font-size: 0.8125rem; }
+
+/* ---- HumanReviewGate ---- */
+.cs-review-gate {
+  border: 1px solid var(--cs-color-semantic-warning, #92400e);
+  border-radius: var(--cs-radius-md, 8px); color: var(--cs-color-text-primary, #45210e);
+  display: grid; gap: 0.75rem; padding: var(--cs-space-4, 16px);
+  background: color-mix(in oklab, var(--cs-color-semantic-warning, #92400e) 5%, var(--cs-color-surface-panel, #fff));
+}
+.cs-review-gate__risk {
+  color: var(--cs-color-semantic-warning, #92400e); font-weight: 700;
+  text-transform: uppercase; letter-spacing: 0.04em; font-size: 0.8125rem;
+}
+.cs-review-gate__summary { margin: 0; }
+.cs-review-gate__reviewer { margin: 0; color: var(--cs-color-text-muted, #6e5a4c); font-size: 0.875rem; }
+
+/* ---- Logo ---- */
+.cs-logo { block-size: auto; display: inline-block; vertical-align: middle; }
+
+/* ---- UI font binding: components consume the brand UI-font token ---- */
+.cs-button, .cs-field, .cs-field__control, .cs-dialog, .cs-table,
+.cs-ai-disclosure, .cs-review-gate, .cs-logo {
+  font-family: var(--cs-font-family-ui, ui-sans-serif, system-ui);
+}