#achievement-gallery{inset:0;margin:auto;width:min(1440px,94vw);max-width:none;max-height:92dvh;padding:0;border:1px solid #b8a78385;border-radius:23px;background:var(--surface);color:var(--surface-ink);box-shadow:inset 0 0 0 6px #b8a78312,0 35px 120px #18291f45;overflow:hidden}
#achievement-gallery::backdrop{background:#20312755;backdrop-filter:blur(5px)}
#achievement-gallery[open]{display:flex;flex-direction:column}
#achievement-gallery [hidden]{display:none!important}
.ag-header{position:static;pointer-events:auto;display:flex;align-items:center;padding:32px 42px 20px;gap:24px;flex-shrink:0}
.ag-header:after{content:'';height:1px;flex:1;background:linear-gradient(90deg,#b49a68,transparent);order:1}
.ag-header>div{order:0}.ag-header>div>span{font:10px Georgia;letter-spacing:4px;color:var(--surface-gold)}
#achievement-gallery h2{font:38px/1.4 Georgia,'Microsoft JhengHei',serif;letter-spacing:5px;margin:8px 0}
.ag-close{order:2;flex-shrink:0;width:44px;height:44px;border:1px solid var(--surface-gold);border-radius:50%;font:29px Georgia;background:none}
.ag-exhibition{min-height:0;display:flex;flex-direction:column}
.ag-track{display:flex;gap:28px;padding:16px 42px 24px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain;touch-action:pan-x;cursor:grab;min-height:0}
.ag-track::-webkit-scrollbar{display:none}.ag-track.dragging{cursor:grabbing;user-select:none}
.ag-track:focus-visible{outline:2px solid #8c9d7a80;outline-offset:-4px;border-radius:5px}
.ag-item{flex:0 0 clamp(260px,30vw,420px);width:clamp(260px,30vw,420px);border:0;background:none;padding:0;display:flex;flex-direction:column;align-items:center;color:inherit;cursor:inherit}
.ag-frame{display:block;width:100%;padding:10px;background:linear-gradient(135deg,#dfc395,#a68558 45%,#dbc397 48%,#967650);box-shadow:inset 0 0 0 2px #65503970,inset 0 0 0 5px #ead9b960,0 7px 12px #3d2d2029;border:1px solid #9d825b}
.ag-frame-1{background:linear-gradient(135deg,#6e6655,#baa477 45%,#554f43 49%,#a18f6a)}
.ag-frame-2{background:linear-gradient(135deg,#6d5341,#a88768 45%,#4e3d31 49%,#82664e)}
.ag-mat{display:flex;align-items:center;justify-content:center;padding:clamp(12px,1.7vw,26px);background:#f6f1e6;box-shadow:inset 0 2px 6px #3d2d2033}
.ag-mat img{display:block;width:100%;height:clamp(150px,30dvh,340px);object-fit:contain;border-radius:0;box-shadow:0 0 0 1px #9d8e7333}
.ag-year{display:block;font:18px Georgia;letter-spacing:3px;color:var(--surface-gold);margin-top:22px}
.ag-year:after{content:'';display:block;width:22px;height:1px;background:var(--surface-gold);margin:10px auto}
.ag-caption{font:17px/1.65 Georgia,'Microsoft JhengHei',serif;max-width:95%;text-wrap:balance}.ag-view{font-size:10px;letter-spacing:1px;margin-top:10px;opacity:.65}
.ag-item:hover .ag-frame{filter:brightness(1.04)}.ag-item:focus-visible{outline-offset:5px;outline:2px solid var(--surface-gold);border-radius:2px}
.ag-footer{display:flex;align-items:center;gap:20px;padding:12px 42px 30px;font-size:11px;flex-shrink:0}
.ag-progress{flex:1;min-width:40px;accent-color:#45624f;cursor:pointer}.ag-count{white-space:nowrap;font:13px Georgia;letter-spacing:1px}
.ag-footer button{border:1px solid var(--surface-gold);background:none;border-radius:50%;width:38px;height:38px;flex-shrink:0;font-size:18px}.ag-footer button:disabled{opacity:.25;cursor:default}
.ag-detail{padding:0 42px 36px;overflow:auto}.ag-back{border:0;border-bottom:1px solid var(--surface-gold);background:none;padding:10px 0;margin-bottom:24px;font-size:12px}
.ag-detail-layout{display:grid;grid-template-columns:1.4fr 1fr;gap:42px;align-items:center}.ag-detail img{height:min(48dvh,500px)}.ag-detail-copy .ag-year:after{margin-left:0}.ag-detail-copy h3{font:27px/1.6 Georgia,'Microsoft JhengHei',serif;text-wrap:balance}.ag-detail-copy p{font-size:14px;line-height:2;white-space:pre-line;color:var(--surface-soft)}
@media(max-width:700px){.ag-header{padding:24px 22px 8px}#achievement-gallery{width:96vw;max-height:92dvh;border-radius:18px}#achievement-gallery h2{font-size:27px}.ag-header>div>span{font-size:8px}.ag-track{padding:15px 22px 22px;gap:22px}.ag-item{flex-basis:76vw;width:76vw}.ag-mat img{height:27dvh}.ag-caption{font-size:15px}.ag-footer{padding:5px 22px 22px;gap:10px;flex-wrap:wrap}.ag-hint{width:100%;font-size:10px}.ag-year{margin-top:16px}.ag-detail{padding:0 22px 24px}.ag-detail-layout{grid-template-columns:1fr;gap:5px}.ag-detail img{height:30dvh}.ag-detail-copy h3{font-size:21px}.ag-close{width:36px;height:36px}}
@media(max-height:560px) and (min-width:701px){.ag-header{padding:12px 30px 0}#achievement-gallery h2{font-size:25px}.ag-track{padding-top:5px;padding-bottom:10px}.ag-year{margin-top:9px;font-size:13px}.ag-year:after{margin:5px auto}.ag-caption{font-size:13px}.ag-view{display:none}.ag-footer{padding-bottom:12px}}

/* A framed folio, with one quiet gallery mascot and shared geometric controls. */
#achievement-gallery{inset:70px 0 12px;max-height:calc(100dvh - 95px);padding:7px;overflow:visible;border-radius:28px;border:1px solid #b5a584;background:linear-gradient(145deg,#f3e8cb,#bbae89 48%,#e4d9bd 65%,#c2b28e);box-shadow:0 32px 100px #14291f40,inset 0 1px 1px #fff8}
.ag-shell{display:flex;flex-direction:column;min-height:0;max-height:calc(100dvh - 111px);overflow:hidden;border:1px solid #b9ad8b8c;border-radius:20px;background:var(--surface);box-shadow:inset 0 0 0 4px #b5a58414}
.ag-cat{position:absolute;width:185px;height:auto;top:-61px;left:calc(50% - 92px);z-index:2;pointer-events:none;filter:drop-shadow(0 3px 2px #483c2420);transform-origin:50% 85%;animation:gallery-cat-breathe 5s ease-in-out infinite}
@keyframes gallery-cat-breathe{50%{transform:scaleY(1.025)}}
#achievement-gallery .ag-header{padding:25px 34px 18px;gap:26px}
#achievement-gallery h2{font:normal 34px/1.3 Georgia,'Times New Roman',serif;letter-spacing:.3px;margin:0}
.ag-header:after{order:1;background:linear-gradient(90deg,#b8a37475,transparent)}
.ag-tools{order:2!important;display:flex;align-items:center;gap:10px;margin-left:auto}
#achievement-gallery .ag-icon,.ag-footer button{display:grid;place-items:center;padding:0;margin:0;width:42px;height:42px;border:1px solid #a7997660;border-radius:50%;background:linear-gradient(145deg,#ffffff85,#b6ad8610);color:var(--surface-ink);box-shadow:0 2px 4px #4d40200a,inset 0 1px 0 #fff8;line-height:0;transition:background .2s,transform .2s,box-shadow .2s}
.ag-icon svg,.ag-footer button svg{display:block;width:19px;height:19px;flex-shrink:0}
#achievement-gallery .ag-icon:hover,.ag-footer button:hover:not(:disabled){background:#b4bf9b26;transform:translateY(-1px);box-shadow:0 3px 8px #35432714}
.ag-track{padding-top:12px}.ag-frame{transition:transform .3s,box-shadow .3s}.ag-item:hover .ag-frame{transform:translateY(-3px);box-shadow:inset 0 0 0 2px #65503970,inset 0 0 0 5px #ead9b960,0 11px 20px #3d2d2026}
.ag-footer{border-top:1px solid var(--surface-line);margin:0 34px;padding:20px 0 24px;gap:18px;color:var(--surface-soft)}
.ag-progress{appearance:none;-webkit-appearance:none;height:5px;border:0;border-radius:9px;background:linear-gradient(to right,#65795b 0 var(--ag-progress,0%),#c9bfaa55 var(--ag-progress,0%) 100%);box-shadow:inset 0 1px 1px #65563b20}
.ag-progress::-webkit-slider-thumb{appearance:none;width:28px;height:11px;border-radius:8px;border:2px solid var(--surface);background:#5b7253;box-shadow:0 1px 5px #3b4a3540;cursor:ew-resize}
.ag-progress::-moz-range-thumb{width:24px;height:7px;border-radius:8px;border:2px solid var(--surface);background:#5b7253;box-shadow:0 1px 5px #3b4a3540;cursor:ew-resize}
.ag-progress:focus-visible{outline:2px solid var(--surface-gold);outline-offset:8px}
.ag-count{font-variant-numeric:tabular-nums;letter-spacing:1.5px;font-size:12px}
.ag-detail{padding:8px 34px 30px}.ag-detail-layout{gap:38px;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:center}
.ag-detail .ag-frame{padding:12px}.ag-detail img{height:min(46dvh,480px)}
.ag-detail-copy{padding:12px 8px 20px 0}.ag-detail-copy .ag-year{font-size:15px;margin-top:0;letter-spacing:3px}.ag-detail-copy h3{font-size:clamp(21px,2.2vw,31px);font-weight:400;line-height:1.55;margin:20px 0}.ag-detail-copy p{padding-top:22px;border-top:1px solid var(--surface-line);line-height:2.15;max-width:38ch}
#achievement-gallery[data-view=detail] .ag-detail{animation:gallery-story-in .4s cubic-bezier(.16,1,.3,1)}
@keyframes gallery-story-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:700px){#achievement-gallery{inset:65px 0 12px;padding:5px;border-radius:23px;max-height:calc(100dvh - 90px)}.ag-shell{border-radius:17px;max-height:calc(100dvh - 102px)}.ag-cat{width:140px;top:-46px;left:calc(50% - 70px)}#achievement-gallery .ag-header{padding:20px 18px 14px;gap:10px}#achievement-gallery h2{font-size:27px}.ag-header:after{display:none}.ag-tools{gap:7px}#achievement-gallery .ag-icon{width:36px;height:36px}.ag-track{padding:12px 18px 20px}.ag-mat img{height:24dvh}.ag-year{margin-top:12px}.ag-footer{margin:0 18px;padding:15px 0 18px;gap:12px}.ag-footer button{width:36px;height:36px}.ag-detail{padding:2px 18px 18px}.ag-detail-layout{grid-template-columns:1fr;gap:10px}.ag-detail img{height:28dvh}.ag-detail-copy{padding:8px 0}.ag-detail-copy h3{margin:12px 0;font-size:22px}.ag-detail-copy p{padding-top:14px;font-size:13px}.ag-detail-copy .ag-year:after{display:none}}
@media(max-height:560px) and (min-width:701px){#achievement-gallery{inset:35px 0 8px;max-height:calc(100dvh - 50px)}.ag-shell{max-height:calc(100dvh - 66px)}.ag-cat{width:110px;top:-35px;left:calc(50% - 55px)}#achievement-gallery .ag-header{padding:12px 26px}#achievement-gallery h2{font-size:25px}.ag-footer{padding:10px 0}.ag-mat img{height:23dvh;min-height:90px}.ag-detail img{height:48dvh}}
@media(prefers-reduced-motion:reduce){.ag-cat,#achievement-gallery[data-view=detail] .ag-detail{animation:none}.ag-frame,.ag-icon,.ag-footer button{transition:none}}