:root{color-scheme:light;font-family:Fira Sans,Segoe UI,system-ui,sans-serif;background-color:#081326}*{box-sizing:border-box;margin:0;padding:0}body{min-height:100vh;background:linear-gradient(180deg,#0b1b34,#050b18);color:#f5f7ff}#root{min-height:100vh}.page{min-height:100vh;padding:24px;display:flex;flex-direction:column;gap:20px}.page__header{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;text-align:center}.page__title{font-size:clamp(2rem,3vw + 1rem,3rem);font-weight:600;letter-spacing:.01em;width:100%}.page__subtitle{width:100%;margin-top:6px;font-size:1.05rem;font-weight:400;opacity:.85}.page__back{background:transparent;color:#bcd0ff;border:1px solid rgba(188,208,255,.35);border-radius:999px;padding:6px 16px;font-size:.95rem;cursor:pointer;transition:transform .2s ease,border-color .2s ease,color .2s ease}.page__back:hover{transform:translateY(-1px);border-color:#bcd0ffa6;color:#fff}.layout{display:grid;grid-template-columns:minmax(0,1fr) clamp(200px,28vw,200px);align-items:start;gap:16px}.stack{display:flex;gap:12px;width:100%}.stack--main{flex:1;flex-direction:column-reverse}.stack--side{width:100%;flex-direction:column;align-self:stretch}.stack--detail{flex-direction:column-reverse;width:100%;max-width:calc(100% - clamp(200px,28vw,200px) - 16px);margin-right:auto}.layer{width:100%;background:#1b4fd6;color:#fff;padding:16px;border-radius:12px;box-shadow:0 12px 24px #050c1959;border:none;text-align:center}.layer--side{flex:1;display:flex;flex-direction:column;justify-content:center}.layer__title{font-size:24px;font-weight:700;letter-spacing:.01em;margin-bottom:8px;margin-top:-8px}.layer__description{font-size:16px;line-height:1.2;opacity:.9;text-align:center}.layer__children{margin-top:10px;display:flex;align-items:center;justify-content:center;flex-wrap:nowrap;gap:8px;font-size:.95rem;font-style:italic;color:#fff!important;-webkit-text-fill-color:#ffffff;overflow-x:auto;padding-bottom:2px}.layer__children--list{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:2px;overflow:visible}.layer__child-row{display:flex;align-items:center;gap:8px}.layer__child{color:#fff!important;-webkit-text-fill-color:#ffffff;text-decoration:none;white-space:nowrap}.layer__child:hover{text-decoration:underline}.layer__dot{color:#fff!important;-webkit-text-fill-color:#ffffff;display:inline-block;flex:0 0 auto;font-size:.85rem;line-height:1;width:.85rem;text-align:center}.layer--interactive{cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.layer--interactive:hover{transform:translateY(-2px);box-shadow:0 16px 30px #050c1966}.layer--interactive:focus-visible{outline:2px solid #bcd0ff;outline-offset:3px}.layer__peer-rows{display:flex;flex-direction:column;gap:var(--peer-gap, 16px);width:100%;margin-right:auto}.layer__peer-row{display:flex;gap:var(--peer-gap, 16px);width:100%}.layer__peer-row--centered{justify-content:center}.layer__peer-row .layer{flex:0 0 calc((100% - (var(--peer-columns, 3) - 1) * var(--peer-gap, 16px)) / var(--peer-columns, 3));width:auto}.layer__peer-rows .layer__children{flex-wrap:wrap}.layer__peer-rows .layer__child{white-space:normal}.layer--output{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:140px}@media (max-width: 900px){.layout{grid-template-columns:minmax(0,1fr)}.stack--side{width:100%}}@media (max-width: 600px){.page{padding:16px}.layer{padding:20px}}.layer__output-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;width:100%}