/* PORTAL-555 — public portal: available game first, development as optional previews. */
.services.development542.development553.development555{
 position:relative;max-width:1040px;margin:88px auto 40px;padding:30px;
 background:#f3f5f9;border:1px solid #dce2eb;border-radius:24px;box-shadow:none;
}
.development555::before{
 content:"";position:absolute;top:-45px;left:0;right:0;height:1px;background:#dce2eb;
}
.development555 .development-label542{
 background:#e7ebf2;border:0;color:#566174;font-size:11px;letter-spacing:.06em;
 margin-bottom:10px;padding:7px 12px;
}
.services.development555>h2{color:#3c485c;font-size:30px;line-height:1.2;margin:0 0 8px}
.services.development555>.intro{color:#657084;font-size:15px;margin:0 auto 24px;max-width:640px}
.development-list555{display:grid;gap:12px}
.development-item555{
 border:1px solid #dce2eb;border-radius:16px;background:#fff;overflow:hidden;
}
.development-item555>summary{
 display:grid;grid-template-columns:96px minmax(0,1fr) 220px max-content;
 align-items:center;gap:20px;padding:18px 20px;cursor:pointer;list-style:none;
}
.development-item555>summary::-webkit-details-marker{display:none}
.development-item555>summary:hover{background:#fafbfe}
.development-item555>summary:focus-visible{outline:3px solid #315b9a;outline-offset:-4px;border-radius:14px}
.development-thumb555{width:96px;height:64px;object-fit:contain;border-radius:8px}
.development-preview555-name{
 display:block;font-family:Fredoka,sans-serif;font-size:23px;font-weight:600;
 line-height:1.15;color:#34435d;
}
.development-preview555-name em{font-style:normal}
.development-progress553{display:block;min-width:0;color:#697386}
.development-progress553-heading{
 display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;line-height:1.2;
}
.development-progress553-label{font-size:12px;font-weight:600}
.development-progress553-heading strong{
 font-family:Fredoka,sans-serif;font-size:22px;white-space:nowrap;font-weight:600;color:#66547f;
}
.development-progress553-track{
 display:block;height:7px;background:#e7e3ee;border-radius:999px;overflow:hidden;
}
.development-progress553-track>span{
 display:block;height:100%;border-radius:inherit;background:#8b77a7;
}
.development-toggle555{display:flex;align-items:center;justify-content:flex-end;gap:10px;color:#58677f}
.development-toggle555-label{font-size:12px;font-weight:700}
.development-toggle555-symbol{position:relative;width:16px;height:16px;flex-shrink:0}
.development-toggle555-symbol::before,.development-toggle555-symbol::after{
 content:"";position:absolute;background:currentColor;border-radius:1px;
}
.development-toggle555-symbol::before{width:12px;height:2px;left:2px;top:7px}
.development-toggle555-symbol::after{width:2px;height:12px;left:7px;top:2px}
.development-item555[open] .development-toggle555-symbol::after{display:none}
.development-item555[open]>summary{border-bottom:1px solid #e0e5ec;background:#fafbfe}
.development-detail555{padding:20px;background:#f8f9fc}
.development555 .development-detail555 .service{margin:0;box-shadow:none}
.development555 .development-detail555 .turbo{margin:0}
.development-item555:not([data-development="turbo"]) .service{max-width:640px;margin-inline:auto}
@media(max-width:1100px){
 .development-item555>summary{grid-template-columns:80px minmax(0,1fr) 180px max-content;gap:16px}
 .development-thumb555{width:80px;height:56px}
 .development-preview555-name{font-size:21px}
}
@media(max-width:700px){
 .services.development542.development553.development555{margin-top:64px;padding:24px 16px;border-radius:20px}
 .development555::before{top:-33px}
 .services.development555>h2{font-size:27px}
 .services.development555>.intro{font-size:14px;margin-bottom:20px}
 .development-item555>summary{
  grid-template-columns:64px minmax(0,1fr) auto;gap:12px;padding:16px;
 }
 .development-thumb555{width:64px;height:46px;grid-row:1}
 .development-preview555-name{font-size:20px;grid-column:2;grid-row:1}
 .development-progress553{grid-column:1/3;grid-row:2}
 .development-toggle555{grid-column:3;grid-row:1/3;align-self:center}
 .development-toggle555-label{display:none}
 .development-detail555{padding:10px}
 .development-progress553-heading strong{font-size:20px}
}
