/* Visitor starter challenges for the sample Office. Existing record editing remains in office.js. */
#office-try{margin:18px clamp(18px,3.3vw,62px) 0;border:1px solid #cddce9;background:#f5faff;border-radius:15px;box-shadow:0 4px 18px #1836540d;scroll-margin-top:16px}
#office-try summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:17px 22px;cursor:pointer;color:#203e5e;font-size:12px;font-weight:800;letter-spacing:.06em}
#office-try summary::-webkit-details-marker{display:none}
#office-try summary:after{content:"▾";font-size:16px}
#office-try[open] summary:after{content:"▴"}
.office-try-body{border-top:1px solid #d7e1eb;padding:17px 22px 21px}
.office-try-lede{font-size:12px;color:#4b6578;line-height:1.6;margin-bottom:15px}
.office-try-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.office-try-grid button{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:7px;min-height:112px;padding:14px;text-align:left;background:#fff;color:#203e5e;border:1px solid #bccfe0;border-radius:11px}
.office-try-grid button:hover{border-color:#3681a5;background:#eff8ff}
.office-try-grid button:focus-visible{outline:3px solid #087b93;outline-offset:2px}
.office-try-grid button .ot-icon{font-size:19px;color:#2c789f}
.office-try-grid button strong{font-size:12px}
.office-try-grid button small{font-size:10px;color:#647d8e}
#office-try-status{padding-top:12px;margin:0;color:#52728a;font-size:11px}
@media(max-width:1080px){.office-try-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){#office-try{margin-inline:14px}.office-try-grid{grid-template-columns:1fr 1fr}.office-try-grid button{padding:12px}.office-try-body{padding:13px}#office-try summary{padding:14px}}