.folder-instruction{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-top:-10px}.folder-instruction>span{font-size:10px;color:#6b86a5;letter-spacing:.1em}.folder-instruction p{font-size:11px;color:#6c819a;margin:0}.touch-hint{display:none}
.folder-deck{display:flex;perspective:1500px;isolation:isolate;padding:62px 12px 48px;margin:0 -12px 0;align-items:flex-start;min-height:550px}
.folder-card{position:relative;display:block;width:calc((100% + 112px)/5);flex:0 0 calc((100% + 112px)/5);margin-left:-28px;transform-origin:50% 85%;transform:translateY(var(--folder-rest)) rotate(var(--folder-angle));transition:transform .48s cubic-bezier(.2,.8,.2,1),filter .35s;z-index:calc(var(--folder-index) + 1);filter:drop-shadow(-6px 14px 12px #14416f1d);color:white;outline-offset:8px}
.folder-card:first-child{margin-left:0}.folder-tab{position:relative;width:80%;height:52px;border-radius:14px 23px 0 0;display:flex;align-items:center;gap:9px;padding:0 17px;background:linear-gradient(120deg,#459edf,#1e74b8);box-shadow:inset 0 1px #ffffff55;font-size:16px;font-weight:550}.folder-tab:after{content:'';width:22px;height:24px;position:absolute;right:-14px;bottom:0;background:#277fc0;clip-path:polygon(0 0,100% 100%,0 100%)}.folder-tab>.ui-icon{width:19px;height:19px}.folder-tab>small{font-weight:400;font-size:9px;margin-left:auto;opacity:.7}
.folder-surface{position:relative;padding:15px 16px 18px;border-radius:0 15px 16px 16px;background:radial-gradient(ellipse at 15% 0%,#3d91ce80,transparent 70%),linear-gradient(150deg,#217dbe,#164c88 82%);box-shadow:inset 0 1px 0 #ffffff50,inset -1px 0 0 #0e386b66,inset 0 -4px 0 #123b6d;height:390px;overflow:hidden}
.folder-surface:before{content:'';position:absolute;inset:3px 5px auto;height:4px;border-radius:6px;background:#fff5;pointer-events:none}.folder-photo{position:relative;height:144px;overflow:hidden;border-radius:9px;margin-bottom:19px;border:1px solid #d4eeff77;background:#e7f2fc}.folder-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .65s var(--ease)}.folder-photo>span{position:absolute;bottom:7px;left:8px;padding:3px 6px;background:#ffffffdd;border-radius:4px;color:#486c8e;font-size:7px}.folder-copy .tiny{color:#c0e5ff;font-size:8px;letter-spacing:.1em}.folder-copy h3{font-size:21px;line-height:1.5;color:white;letter-spacing:-.03em;margin:12px 0 10px;text-wrap:balance}.folder-copy>p{font-size:12px;color:#cae2f6;line-height:1.85;margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.folder-action{position:absolute;bottom:24px;left:16px;right:20px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #ffffff35;padding-top:12px;font-size:11px;color:#e9f6ff}.folder-action .ui-icon{width:16px;height:16px;transition:transform .3s}.folder-edge{position:absolute;height:2px;background:#8ac6ee55;bottom:7px;left:12px;right:12px;border-radius:4px;box-shadow:0 -3px #8ac6ee22;pointer-events:none}
.folder-card:nth-child(2) .folder-surface{background:linear-gradient(145deg,#2487ca,#175390 85%)}.folder-card:nth-child(3) .folder-surface{background:linear-gradient(145deg,#2386c9,#154c8b 85%)}.folder-card:nth-child(4) .folder-surface{background:linear-gradient(145deg,#298bd0,#195897 85%)}.folder-card:nth-child(5) .folder-surface{background:linear-gradient(145deg,#3693d3,#1b609e 85%)}
.folder-deck.has-selection .folder-card:not(.is-selected){filter:drop-shadow(-5px 10px 10px #123d6920) saturate(.8) brightness(.92)}.folder-card.is-selected{z-index:20;transform:translateY(-28px) rotate(-1deg) rotateX(var(--pointer-x,0deg)) rotateY(var(--pointer-y,0deg)) scale(1.045);filter:drop-shadow(0 30px 23px #103f7642)}.folder-card.is-selected .folder-photo img{transform:scale(1.055)}.folder-card.is-selected .folder-action{color:#fff;border-top-color:#9fdfffaa}.folder-card.is-selected .folder-action .ui-icon{transform:translate(2px,-2px)}.folder-card:focus-visible{outline:3px solid #048ccc}
@media(max-width:1100px) and (min-width:801px){.folder-deck{padding-inline:6px;margin-inline:-6px}.folder-card{flex-basis:calc((100% + 136px)/5);width:calc((100% + 136px)/5);margin-left:-34px}.folder-tab{padding-inline:12px;font-size:15px;gap:6px;width:84%}.folder-tab .ui-icon{width:17px}.folder-surface{padding-inline:13px;height:380px}.folder-photo{height:125px}.folder-copy h3{font-size:19px}.folder-copy>p{font-size:11px}.folder-action{left:13px;right:14px}.folder-tab>small{display:none}}
@media(max-width:800px){.folder-instruction{display:block;margin-top:0}.folder-instruction p{margin-top:10px;font-size:10px}.touch-hint{display:inline}.folder-deck{margin-inline:-20px;padding:42px 25px 45px;overflow-x:auto;overflow-y:hidden;perspective:none;scroll-snap-type:x mandatory;scroll-padding-inline:25px;min-height:0;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#a9c8e7 transparent}.folder-card{width:290px;flex:0 0 290px;margin-left:-14px;scroll-snap-align:center;transform:translateY(8px) rotate(calc(var(--folder-angle) * .45));filter:drop-shadow(0 10px 12px #17457122)}.folder-card:first-child{margin-left:0}.folder-tab{font-size:18px;height:52px}.folder-surface{height:390px;padding:16px 18px}.folder-photo{height:150px}.folder-copy h3{font-size:22px}.folder-copy>p{font-size:12px}.folder-action{left:18px;right:18px}.folder-card.is-selected{transform:translateY(-10px) rotate(-.6deg) scale(1.015);filter:drop-shadow(0 20px 14px #124b8135)}.folder-deck.has-selection .folder-card:not(.is-selected){filter:drop-shadow(0 10px 10px #17457122) saturate(.85) brightness(.95)}}
@media(prefers-reduced-motion:reduce){.folder-card,.folder-photo img,.folder-action .ui-icon{transition:none!important}.folder-card.is-selected{transform:translateY(var(--folder-rest)) rotate(var(--folder-angle))}.folder-card.is-selected .folder-photo img{transform:none}}