.btn{font-family:var(--font-mono);font-size:var(--fs-sm);font-weight:var(--fw-medium);padding:8px 16px;border-radius:var(--r);border:1px solid var(--border);background:var(--surface);color:var(--ink);cursor:pointer;transition:all var(--dur-fast) var(--ease);text-decoration:none;display:inline-flex;align-items:center;gap:6px;}.btn:hover{background:var(--surface-2,var(--surface));transform:translateY(-1px);}.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:var(--fw-medium);}.btn-primary:hover{filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 4px 12px var(--accent-soft);}.input{font-family:var(--font-mono);font-size:var(--fs-sm);padding:8px 12px;border:1px solid var(--border);border-radius:var(--r);background:var(--surface);color:var(--ink);outline:none;transition:all var(--dur-fast) var(--ease);width:100%;}.input::placeholder{color:var(--mut);}.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring);background:var(--bg);}[data-skin="creative"] .input:focus{box-shadow:0 0 0 3px var(--accent-ring),0 0 16px var(--accent-soft);}[data-skin="utility"] .input:focus{box-shadow:0 0 0 3px var(--accent-ring);}.chip{font-family:var(--font-mono);font-size:var(--fs-xs);padding:4px 10px;border-radius:var(--r-pill);border:1px solid var(--border);background:var(--surface);color:var(--ink2);cursor:pointer;transition:all var(--dur-fast) var(--ease);display:inline-flex;align-items:center;gap:4px;}.chip:hover{border-color:var(--accent);color:var(--accent);}.chip.on{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:var(--fw-medium);}.badge{font-family:var(--font-mono);font-size:10px;padding:2px 8px;border-radius:var(--r-pill);background:var(--accent-soft);color:var(--accent);border:1px solid color-mix(in srgb,var(--accent) 36%,transparent);font-weight:var(--fw-medium);letter-spacing:0.04em;display:inline-flex;align-items:center;gap:4px;}.badge::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;box-shadow:0 0 6px currentColor;}.badge.ok{background:color-mix(in srgb,var(--ok) 14%,transparent);color:var(--ok);border-color:color-mix(in srgb,var(--ok) 36%,transparent);}.badge.warn{background:color-mix(in srgb,var(--warn) 14%,transparent);color:var(--warn);border-color:color-mix(in srgb,var(--warn) 36%,transparent);}.badge.soon{background:color-mix(in srgb,var(--mut) 14%,transparent);color:var(--mut);border-color:color-mix(in srgb,var(--mut) 30%,transparent);}.badge.soon::before{box-shadow:none;}.card-base{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-card);padding:var(--sp-4);transition:all var(--dur) var(--ease);}.card-base:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.1);}[data-skin="reading"] .card-base:hover{border-color:var(--accent);box-shadow:0 4px 16px var(--accent-soft);}.hds-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-4);border:1px solid transparent;border-radius:var(--r);font:inherit;font-size:var(--fs-sm);font-weight:var(--fw-medium);line-height:1;cursor:pointer;white-space:nowrap;transition:background var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease),opacity var(--dur-fast) var(--ease);}.hds-btn:active{transform:translateY(1px);}.hds-btn--primary{background:var(--accent-btn);color:var(--accent-on);box-shadow:var(--shadow-sm);}.hds-btn--primary:hover{filter:brightness(1.1);}.hds-btn--secondary{background:var(--surface);color:var(--ink);border-color:var(--line-strong);}.hds-btn--secondary:hover{background:var(--surface-strong);}.hds-btn--ghost{background:transparent;color:var(--accent);border-color:color-mix(in srgb,var(--accent) 40%,transparent);}.hds-btn--ghost:hover{background:var(--accent-soft);}.hds-btn--danger{background:var(--danger-btn);color:var(--accent-on);}.hds-btn--danger:hover{filter:brightness(1.08);}.hds-btn--success{background:var(--success-btn);color:var(--accent-on);}.hds-btn--success:hover{filter:brightness(1.08);}.hds-btn--icon{padding:var(--sp-2);aspect-ratio:1;}.hds-btn--sm{padding:var(--sp-1) var(--sp-3);font-size:var(--fs-xs);}.hds-btn--lg{padding:var(--sp-3) var(--sp-6);font-size:var(--fs-base);}.hds-btn:disabled,.hds-btn.is-disabled{opacity:0.5;pointer-events:none;}.hds-btn.is-loading{color:transparent !important;pointer-events:none;position:relative;}.hds-btn.is-loading::after{content:"";position:absolute;width:1em;height:1em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;color:#fff;animation:hds-spin 0.6s linear infinite;}.hds-btn--secondary.is-loading::after,.hds-btn--ghost.is-loading::after{color:var(--ink);}@keyframes hds-spin{to{transform:rotate(360deg);}}.hds-btn-group{display:inline-flex;}.hds-btn-group .hds-btn{border-radius:0;margin-left:-1px;}.hds-btn-group .hds-btn:first-child{border-radius:var(--r) 0 0 var(--r);margin-left:0;}.hds-btn-group .hds-btn:last-child{border-radius:0 var(--r) var(--r) 0;}.hds-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 6px;border-radius:var(--r-pill);background:var(--c-red);color:#fff;font-size:11px;font-weight:var(--fw-bold);line-height:1;}.hds-badge--dot{min-width:8px;width:8px;height:8px;padding:0;}.hds-chip{--hds-chip-c:var(--accent-tag);display:inline-flex;align-items:center;gap:var(--sp-1);padding:4px 10px;border-radius:var(--r-pill);background:var(--accent-fill);border:1px solid var(--accent-line);color:var(--ink);font-size:var(--fs-xs);font-weight:var(--fw-medium);}.hds-chip__close{cursor:pointer;opacity:0.6;}.hds-chip__close:hover{opacity:1;}.hds-avatar{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:var(--accent-tag);color:var(--accent-on);font-weight:var(--fw-bold);font-size:var(--fs-sm);overflow:hidden;flex-shrink:0;}.hds-avatar img{width:100%;height:100%;object-fit:cover;}.hds-avatar--sq{border-radius:var(--r);}.hds-avatar--sm{width:28px;height:28px;font-size:var(--fs-xs);}.hds-avatar--lg{width:56px;height:56px;font-size:var(--fs-md);}.hds-avatar-group{display:inline-flex;}.hds-avatar-group .hds-avatar{margin-left:-10px;border:2px solid var(--bg);}.hds-avatar-group .hds-avatar:first-child{margin-left:0;}.hds-kbd{display:inline-block;padding:2px 7px;min-width:1.6em;text-align:center;border:1px solid var(--border);border-bottom-width:2px;border-radius:var(--r-sm);background:var(--surface);font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--ink);}.hds-divider{border:none;border-top:1px solid var(--border);margin:var(--sp-6) 0;}.hds-divider--text{display:flex;align-items:center;gap:var(--sp-3);color:var(--ink2);font-size:var(--fs-xs);}.hds-divider--text::before,.hds-divider--text::after{content:"";flex:1;height:1px;background:var(--border);}.hds-progress{height:8px;border-radius:var(--r-pill);background:var(--surface-2,var(--surface));overflow:hidden;}.hds-progress__bar{height:100%;background:var(--accent);border-radius:inherit;transition:width var(--dur) var(--ease);}.hds-skeleton{border-radius:var(--r-sm);background:var(--surface-2,var(--surface));position:relative;overflow:hidden;}.hds-skeleton::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.1),transparent);transform:translateX(-100%);animation:hds-shimmer 1.4s infinite;}.hds-skeleton--text{height:0.8em;margin:0.3em 0;}.hds-skeleton--title{height:1.4em;width:50%;}@keyframes hds-shimmer{to{transform:translateX(100%);}}.hds-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-card);box-shadow:0 2px 8px rgba(0,0,0,0.08);padding:var(--sp-5);}.hds-card__title{font-size:var(--fs-md);font-weight:var(--fw-bold);margin:0 0 var(--sp-2);}.hds-card__body{color:var(--ink2);font-size:var(--fs-sm);}.hds-stat{display:flex;flex-direction:column;gap:var(--sp-1);}.hds-stat__value{font-size:var(--fs-2xl);font-weight:var(--fw-bold);line-height:1;font-family:var(--font-mono);}.hds-stat__label{font-size:var(--fs-xs);color:var(--ink2);text-transform:uppercase;letter-spacing:0.08em;}.hds-stat__trend{font-size:var(--fs-xs);font-weight:var(--fw-medium);}.hds-stat__trend--up{color:var(--ok,var(--c-green));}.hds-stat__trend--down{color:var(--err,var(--c-red));}.hds-empty{text-align:center;padding:var(--sp-12) var(--sp-4);color:var(--ink2);}.hds-empty__icon{font-size:var(--fs-3xl);opacity:0.5;margin-bottom:var(--sp-3);}.hds-empty__title{font-size:var(--fs-md);color:var(--ink);margin-bottom:var(--sp-2);}.hds-navbar{display:flex;align-items:center;gap:var(--sp-5);padding:var(--sp-3) var(--sp-5);background:var(--glass-bg);-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));border-bottom:1px solid var(--line-strong);}.hds-navbar__brand{display:flex;align-items:center;gap:var(--sp-2);font-weight:var(--fw-bold);}.hds-navbar__links{display:flex;gap:var(--sp-4);margin-left:auto;}.hds-navbar__link{color:var(--ink2);font-size:var(--fs-sm);text-decoration:none;transition:color var(--dur-fast);}.hds-navbar__link:hover{color:var(--ink);}.hds-navbar__link.is-active{color:var(--accent);font-weight:var(--fw-medium);}.hds-breadcrumb{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-sm);color:var(--ink2);}.hds-breadcrumb a{color:var(--ink2);text-decoration:none;}.hds-breadcrumb a:hover{color:var(--accent);}.hds-breadcrumb__sep{opacity:0.5;}.hds-tabs{display:flex;gap:var(--sp-1);border-bottom:1px solid var(--border);}.hds-tabs__tab{padding:var(--sp-2) var(--sp-4);border:none;background:none;cursor:pointer;color:var(--ink2);font:inherit;font-size:var(--fs-sm);border-bottom:2px solid transparent;margin-bottom:-1px;transition:color var(--dur-fast);}.hds-tabs__tab:hover{color:var(--ink);}.hds-tabs__tab.is-active{color:var(--accent);border-bottom-color:var(--accent);font-weight:var(--fw-medium);}.hds-tabs__panel{padding:var(--sp-4) 0;}.hds-tabs__panel[hidden]{display:none;}.hds-pagination{display:flex;gap:var(--sp-1);}.hds-pagination__item{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:0 var(--sp-2);border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);font-size:var(--fs-sm);cursor:pointer;text-decoration:none;transition:all var(--dur-fast);}.hds-pagination__item:hover{border-color:var(--accent);color:var(--accent);}.hds-pagination__item.is-active{background:var(--accent);color:#fff;border-color:var(--accent);}.hds-table{width:100%;border-collapse:collapse;font-size:var(--fs-sm);}.hds-table th,.hds-table td{padding:var(--sp-3) var(--sp-4);text-align:left;border-bottom:1px solid var(--border);}.hds-table th{color:var(--ink2);font-weight:var(--fw-medium);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:0.05em;}.hds-table--zebra tbody tr:nth-child(even){background:var(--surface);}.hds-table--hover tbody tr{transition:background var(--dur-fast);}.hds-table--hover tbody tr:hover{background:var(--surface-2,var(--surface));}.hds-table--compact th,.hds-table--compact td{padding:var(--sp-2) var(--sp-3);}.hds-list{list-style:none;margin:0;padding:0;}.hds-list__item{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--border);}.hds-list__item:last-child{border-bottom:none;}.hds-input,.hds-textarea,.hds-select{width:100%;padding:var(--sp-2) var(--sp-3);border:1px solid var(--line-strong);border-radius:var(--r);background:var(--bg-elev);color:var(--ink);font:inherit;font-size:var(--fs-sm);transition:border-color var(--dur-fast),box-shadow var(--dur-fast);}.hds-input.is-error,.hds-textarea.is-error,.hds-select.is-error{border-color:var(--c-danger-line);}.hds-input:focus,.hds-textarea:focus,.hds-select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);}.hds-input::placeholder,.hds-textarea::placeholder{color:var(--mut);}.hds-textarea{resize:vertical;min-height:80px;}.hds-label{display:block;margin-bottom:var(--sp-2);font-size:var(--fs-sm);font-weight:var(--fw-medium);}.hds-field{margin-bottom:var(--sp-4);}.hds-switch{position:relative;display:inline-block;width:42px;height:24px;}.hds-switch input{opacity:0;width:0;height:0;}.hds-switch__track{position:absolute;inset:0;border-radius:var(--r-pill);background:var(--line);border:1px solid var(--line-strong);cursor:pointer;transition:background var(--dur),border-color var(--dur);}.hds-switch__track::before{content:"";position:absolute;left:2px;top:2px;width:18px;height:18px;border-radius:50%;background:var(--mut);transition:transform var(--dur) var(--ease),background var(--dur);}.hds-switch input:checked + .hds-switch__track{background:var(--accent-btn);border-color:var(--accent-btn);}.hds-switch input:checked + .hds-switch__track::before{transform:translateX(18px);background:var(--accent-on);}.hds-alert{display:flex;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border:1px solid var(--line);border-left-width:3px;border-radius:var(--r);background:var(--_al-fill,var(--surface));color:var(--ink);font-size:var(--fs-sm);}.hds-alert--info{--_al-fill:var(--c-info-fill);border-left-color:var(--c-info-line);}.hds-alert--success{--_al-fill:var(--c-success-fill);border-left-color:var(--c-success-line);}.hds-alert--warning{--_al-fill:var(--c-warning-fill);border-left-color:var(--c-warning-line);}.hds-alert--danger{--_al-fill:var(--c-danger-fill);border-left-color:var(--c-danger-line);}.hds-tag{--hds-tag-c:var(--accent-tag);--hds-tag-line:var(--accent-line);display:inline-block;box-sizing:border-box;font-family:var(--font-mono);font-size:14px;font-weight:var(--fw-medium);line-height:1.3;padding:6px 15px;border-radius:var(--r-pill);background:var(--hds-tag-c);color:#fff;-webkit-text-stroke:0.4px rgba(0,0,0,0.35);box-shadow:inset 0 -1.5px 0 color-mix(in srgb,var(--hds-tag-c) 72%,black),0 2px 5px rgba(20,35,55,0.18);}.hds-tag--outline{-webkit-text-stroke:0;text-shadow:0 1px 2px rgba(0,0,0,0.28);border:1.5px solid var(--hds-tag-line);box-shadow:none;}.hds-tag--sm{font-size:10px;font-weight:var(--fw-bold);padding:2px 8px;}.hds-tag--orange{--hds-tag-c:var(--c-orange);--hds-tag-line:var(--c-orange-line);}.hds-tag--yellow{--hds-tag-c:var(--c-yellow);--hds-tag-line:var(--c-yellow-line);}.hds-tag--lime{--hds-tag-c:var(--c-lime);--hds-tag-line:var(--c-lime-line);}.hds-tag--green{--hds-tag-c:var(--c-green);--hds-tag-line:var(--c-green-line);}.hds-tag--mint{--hds-tag-c:var(--c-mint);--hds-tag-line:var(--c-mint-line);}.hds-tag--cyan{--hds-tag-c:var(--c-cyan);--hds-tag-line:var(--c-cyan-line);}.hds-tag--blue{--hds-tag-c:var(--c-blue);--hds-tag-line:var(--c-blue-line);}.hds-tag--periwinkle{--hds-tag-c:var(--c-periwinkle);--hds-tag-line:var(--c-periwinkle-line);}.hds-tag--purple{--hds-tag-c:var(--c-purple);--hds-tag-line:var(--c-purple-line);}.hds-tag--pink{--hds-tag-c:var(--c-pink);--hds-tag-line:var(--c-pink-line);}.hds-tag--red{--hds-tag-c:var(--c-red);--hds-tag-line:var(--c-red-line);}[data-skin="dark"] .hds-tag,[data-skin="creative"] .hds-tag{background:transparent;color:var(--hds-tag-c);-webkit-text-stroke:0;text-shadow:none;border:1.5px solid color-mix(in srgb,var(--hds-tag-c) 85%,var(--bg));box-shadow:0 1px 2px rgba(0,0,0,0.35);}[data-skin="dark"] .hds-card,[data-skin="creative"] .hds-card,[data-skin="dark"] .card-base,[data-skin="creative"] .card-base{border-color:var(--line-strong);}[data-skin="dark"] .hds-alert,[data-skin="creative"] .hds-alert{background:transparent;}[data-skin="dark"] .hds-alert--info,[data-skin="creative"] .hds-alert--info{color:var(--c-info);border-left-color:var(--c-info);}[data-skin="dark"] .hds-alert--success,[data-skin="creative"] .hds-alert--success{color:var(--c-success);border-left-color:var(--c-success);}[data-skin="dark"] .hds-alert--warning,[data-skin="creative"] .hds-alert--warning{color:var(--c-warning);border-left-color:var(--c-warning);}[data-skin="dark"] .hds-alert--danger,[data-skin="creative"] .hds-alert--danger{color:var(--c-danger);border-left-color:var(--c-danger);}[data-skin="dark"] .hds-chip,[data-skin="creative"] .hds-chip{border-radius:var(--r-sm);background:transparent;border:1.5px solid color-mix(in srgb,var(--hds-chip-c) 85%,var(--bg));color:var(--hds-chip-c);}@media (prefers-reduced-motion:reduce){.hds-skeleton::after,.hds-btn.is-loading::after{animation:none;}}