@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;600;700&display=swap');

:root{font-family:'DM Sans','Noto Sans SC',sans-serif;color:#25231f;background:#f6f3ed;font-synthesis:none;scroll-behavior:smooth}
[hidden]{display:none!important}
.card-media video{aspect-ratio:16/9;object-fit:cover}
.visual-frame{border:0;cursor:pointer}.visual-frame:hover{filter:saturate(1.08)}.intro-visual.single-art .visual-back{display:none}
*{box-sizing:border-box}body{margin:0;min-width:320px}button,a{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}img,video{display:block;max-width:100%}button:focus-visible,a:focus-visible,[role=button]:focus-visible{outline:3px solid #c5783f;outline-offset:4px}body:has(dialog[open]){overflow:hidden}
.site-shell{overflow:hidden}.site-header{height:93px;padding:0 clamp(20px,5.8vw,100px);display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e3ded4;background:rgba(246,243,237,.92);backdrop-filter:blur(18px);position:relative;z-index:5}.brand{display:flex;align-items:center;gap:13px;font-weight:700;font-size:21px;letter-spacing:.07em;white-space:nowrap}.brand-symbol{display:grid;place-items:center;width:42px;height:42px;background:#e8ac61;border-radius:50%;font-size:28px;font-weight:400;line-height:1}.brand small{display:block;font-size:9px;font-weight:700;letter-spacing:.21em;margin-top:5px;color:#827d73}.header-actions{display:flex;align-items:center;gap:28px}.header-count{font-size:12px;color:#6f6a61;letter-spacing:.08em}.upload-button{background:#25231f;border:1px solid #25231f;color:#fff;border-radius:100px;padding:12px 21px;font-size:13px;font-weight:600;display:flex;align-items:center;gap:7px;transition:transform .2s,background .2s}.upload-button:hover{background:#aa643c;transform:translateY(-2px)}.upload-button span{font-size:23px;font-weight:400;line-height:14px}
.intro{min-height:570px;display:grid;grid-template-columns:1.03fr .97fr;align-items:center;max-width:1700px;margin:0 auto;padding:35px clamp(20px,5.8vw,100px) 55px;position:relative}.intro-copy{position:relative;z-index:2;padding:30px 0 50px}.kicker,.section-index,.dialog-kicker{color:#ad7448;font-size:11px;font-weight:700;letter-spacing:.22em}.kicker{display:flex;align-items:center;gap:13px}.kicker-line{height:1px;width:27px;background:#ad7448}.intro h1{font-size:clamp(43px,5.1vw,84px);line-height:1.35;letter-spacing:-.07em;font-weight:500;margin:32px 0 18px}.intro h1 em{font-style:normal;color:#b66f43}.intro-description{font-size:16px;line-height:1.9;color:#665e55;max-width:460px}.explore-link{display:inline-flex;align-items:center;gap:38px;border-bottom:1px solid #aa643c;padding:13px 1px 14px;font-size:13px;font-weight:700;margin-top:25px;transition:gap .2s}.explore-link:hover{gap:50px}.explore-link span{color:#aa643c;font-size:20px}.intro-visual{height:475px;position:relative;margin-left:15px}.intro-visual:before{content:'';position:absolute;inset:32px 22px 22px 8%;border-radius:50% 44% 45% 50%;background:#ede2d0;transform:rotate(-11deg)}.visual-frame{position:absolute;padding:10px;background:#fff;box-shadow:0 30px 75px rgba(66,48,29,.18);overflow:hidden}.visual-frame img{width:100%;height:100%;object-fit:cover}.visual-back{width:49%;height:60%;right:3%;top:3%;transform:rotate(8deg)}.visual-front{width:57%;height:75%;left:7%;bottom:1%;transform:rotate(-7deg)}.orbit-label{position:absolute;right:-4%;bottom:16%;background:#e8ac61;border-radius:100px;padding:15px 20px;font-size:12px;font-weight:700;letter-spacing:.08em;transform:rotate(8deg);box-shadow:0 8px 18px rgba(111,73,33,.08)}.scribble-star{position:absolute;top:2%;left:8%;color:#cc824e;font-size:62px;transform:rotate(23deg)}
.works-section{background:#eeeae2;padding:88px clamp(20px,5.8vw,100px) 120px;min-height:60vh}.section-heading{max-width:1500px;margin:0 auto 30px;display:flex;justify-content:space-between;align-items:end;gap:24px}.section-index{margin:0 0 11px}.section-heading h2{font-size:clamp(37px,4.5vw,68px);letter-spacing:-.06em;font-weight:500;line-height:1.2;margin:0}.title-dot{color:#dd9c56}.section-aside{display:flex;align-items:end;gap:18px;color:#746e64;padding-bottom:7px}.section-aside span{font-family:Georgia,serif;font-size:36px;line-height:1;color:#ba7648}.section-aside p{max-width:140px;font-size:12px;line-height:1.6;margin:0}.sample-notice{max-width:1500px;margin:0 auto 32px;border-left:2px solid #d69b63;padding:8px 13px;color:#766d61;font-size:12px;line-height:1.6}.gallery{max-width:1500px;margin:0 auto;columns:3;column-gap:26px}.work-card{display:inline-block;width:100%;break-inside:avoid;margin:0 0 33px;vertical-align:top;opacity:0;transform:translateY(24px);transition:opacity .55s,transform .55s}.work-card.is-visible{opacity:1;transform:translateY(0)}.card-button{display:block;width:100%;padding:0;text-align:left;border:0;background:none;color:inherit}.card-media{position:relative;overflow:hidden;background:#ddd3c6;box-shadow:0 10px 25px rgba(76,64,50,.05)}.card-media img,.card-media video{width:100%;height:auto;display:block;transition:transform .6s cubic-bezier(.2,.7,.2,1)}.card-button:hover .card-media img,.card-button:hover .card-media video{transform:scale(1.035)}.card-media:after{content:'';position:absolute;inset:0;border:1px solid rgba(255,255,255,.36);pointer-events:none}.video-badge,.sample-badge{position:absolute;z-index:1;top:15px;padding:7px 10px;background:rgba(35,33,29,.79);color:white;border-radius:30px;backdrop-filter:blur(8px);font-size:11px;font-weight:700;letter-spacing:.08em}.video-badge{left:15px}.sample-badge{right:15px;background:rgba(246,243,237,.9);color:#665b4f}.play-icon{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:58px;height:58px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.87);background:rgba(25,25,23,.27);border-radius:50%;color:white;font-size:20px;padding-left:4px;transition:transform .2s}.card-button:hover .play-icon{transform:translate(-50%,-50%) scale(1.1)}.card-caption{padding:16px 2px 0;display:flex;justify-content:space-between;gap:10px;align-items:baseline}.card-caption strong{font-size:16px;font-weight:600;letter-spacing:.02em;line-height:1.45}.card-caption span{color:#8e8579;font-size:11px;white-space:nowrap}.load-sentinel{height:1px}.gallery-end{text-align:center;margin:50px auto 0}.gallery-end span{font-size:29px;color:#cd8e50}.gallery-end p{font-size:15px;color:#756b60}.gallery-end button{background:transparent;border:0;border-bottom:1px solid #ae673b;padding:9px 0;color:#ae673b;font-weight:700;font-size:13px}.gallery-end button:hover{color:#6c3f28}
.footer{min-height:130px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:28px clamp(20px,5.8vw,100px);font-size:13px;font-weight:700}.footer i{font-size:19px;color:#c5804e;font-style:normal;margin:0 3px}.footer small{font-size:11px;font-weight:400;color:#837a70}.footer a{border-bottom:1px solid #b78661;padding-bottom:5px}.footer a:hover{color:#b16d3e}
dialog{max-width:none;max-height:none}dialog::backdrop{background:rgba(24,22,18,.65);backdrop-filter:blur(8px)}.upload-dialog{width:min(530px,calc(100vw - 26px));border:0;border-radius:19px;padding:26px 32px 32px;background:#f8f5ef;box-shadow:0 25px 80px rgba(0,0,0,.28);color:#28241e}.dialog-head{display:flex;align-items:center;justify-content:space-between}.close-button,.viewer-close{width:38px;height:38px;border:0;border-radius:50%;background:#eae4d9;font-size:27px;line-height:1;color:#2f2b25}.close-button:hover{background:#ddd1bd}.upload-dialog h2{font-size:29px;font-weight:600;letter-spacing:-.04em;margin:20px 0 8px}.upload-dialog>p{font-size:13px;color:#766d60;line-height:1.7}.drop-zone{margin-top:25px;min-height:210px;border:1.5px dashed #baaa95;border-radius:13px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;background:#f0eae0;text-align:center;padding:26px;cursor:pointer;transition:background .2s,border-color .2s}.drop-zone:hover,.drop-zone.dragging{background:#f7e8d2;border-color:#a9693f}.drop-icon{height:49px;width:49px;background:#e6ac67;display:grid;place-items:center;border-radius:50%;font-size:29px}.drop-zone strong{font-size:16px}.drop-zone small{font-size:11px;color:#7e7365;line-height:1.6}.upload-dialog .storage-note{border-top:1px solid #e6dfd3;padding-top:15px;margin:23px 0 0;font-size:11px}
.viewer{position:fixed;inset:0;width:100vw;height:100vh;border:0;padding:55px 85px 45px;background:#1d1c1a;color:#f7f3ec;overflow:hidden}.viewer[open]{display:flex;align-items:center;justify-content:center}.viewer::backdrop{background:#111}.viewer-close{position:absolute;top:24px;right:27px;background:#393734;color:white;z-index:3}.viewer-close:hover{background:#6b6257}.viewer-content{width:min(100%,1400px);height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.viewer-media{width:100%;height:calc(100% - 92px);display:flex;align-items:center;justify-content:center;min-height:0}.viewer-media img,.viewer-media video{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;box-shadow:0 20px 65px rgba(0,0,0,.28)}.viewer-media video{width:min(100%,1100px);background:#000}.viewer-details{height:92px;width:100%;display:flex;align-items:center;gap:20px}.viewer-details>span{font-size:11px;font-weight:700;letter-spacing:.12em;color:#e7ad69}.viewer-details h2{font-size:20px;font-weight:500;margin:0 0 3px}.viewer-details p{color:#aaa59c;font-size:11px;margin:0}.delete-work{margin-left:auto;background:none;border:0;color:#aaa59c;font-size:12px;text-decoration:underline;text-underline-offset:3px}.delete-work:hover{color:#f5d3b8}.viewer-arrow{position:absolute;top:48%;transform:translateY(-50%);width:44px;height:44px;display:grid;place-items:center;border:1px solid #77716a;border-radius:50%;background:#2b2a28;color:white;font-size:32px;line-height:1}.viewer-arrow:hover{background:#b17043;border-color:#b17043}.viewer-prev{left:23px}.viewer-next{right:23px}.toast{position:fixed;z-index:30;left:50%;bottom:28px;transform:translate(-50%,15px);opacity:0;pointer-events:none;background:#292722;color:white;padding:13px 19px;border-radius:50px;font-size:13px;box-shadow:0 10px 35px rgba(0,0,0,.2);transition:opacity .2s,transform .2s;white-space:nowrap}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1000px){.intro{min-height:510px}.intro-visual{height:390px}.orbit-label{right:0}.gallery{columns:2}.section-aside p{display:none}}
@media(max-width:650px){.site-header{height:72px;padding:0 18px}.brand{font-size:17px;gap:9px}.brand-symbol{width:34px;height:34px;font-size:23px}.brand small{font-size:7px}.header-count{display:none}.upload-button{font-size:11px;padding:10px 13px}.intro{display:block;min-height:0;padding:30px 20px 42px}.intro-copy{padding:5px 0 0}.kicker{font-size:9px}.intro h1{font-size:clamp(37px,9vw,55px);margin:20px 0 11px}.intro-description{font-size:14px;margin:0;max-width:330px}.explore-link{margin-top:9px;font-size:12px}.intro-visual{height:350px;margin:18px auto 0;max-width:450px}.visual-back{height:57%;top:2%;right:1%}.visual-front{height:70%;left:6%;bottom:2%}.orbit-label{font-size:10px;padding:10px 13px;right:0;bottom:10%}.works-section{padding:52px 19px 75px}.section-heading{margin-bottom:18px}.section-heading h2{font-size:44px}.section-aside span{font-size:24px}.sample-notice{font-size:11px;margin-bottom:23px}.gallery{columns:2;column-gap:12px}.work-card{margin-bottom:21px}.card-caption{display:block;padding:9px 1px 0}.card-caption strong{display:block;font-size:13px}.card-caption span{display:block;font-size:10px;margin-top:3px}.video-badge,.sample-badge{top:7px;font-size:8px;padding:5px 7px}.video-badge{left:7px}.sample-badge{right:7px}.play-icon{width:38px;height:38px;font-size:15px}.footer{display:flex;flex-wrap:wrap;padding:30px 20px;gap:15px}.footer small{width:100%;order:3}.upload-dialog{padding:22px}.viewer{padding:66px 15px 25px}.viewer-media{height:calc(100% - 115px)}.viewer-details{height:115px;gap:10px;flex-wrap:wrap;align-content:center}.viewer-details h2{font-size:16px}.viewer-details>span{font-size:10px}.delete-work{width:100%;text-align:left;margin:0;padding:0}.viewer-arrow{width:34px;height:34px;top:44%;font-size:24px;background:rgba(25,25,25,.8)}.viewer-prev{left:7px}.viewer-next{right:7px}.viewer-close{top:14px;right:14px}}
@media(max-width:420px){.gallery{columns:1}.intro-visual{height:310px}.visual-frame{padding:7px}.section-heading h2{font-size:39px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
.voice-badge{position:absolute;z-index:1;right:15px;bottom:15px;padding:7px 10px;background:rgba(246,243,237,.94);color:#584c3c;border-radius:30px;font-size:11px;font-weight:700}
.viewer-media{height:calc(100% - 150px)}.viewer-tools{width:100%;min-height:58px;display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap}.viewer-tools button{border:1px solid #766c5d;border-radius:100px;background:#312e29;color:#f7f3ec;font-size:12px;padding:9px 14px}.viewer-tools button:hover{background:#a9633c;border-color:#a9633c}.viewer-tools audio{height:34px;max-width:260px}.viewer-tools #stop-record{background:#af583a}.viewer-tools #remove-voice{border:0;background:none;text-decoration:underline;color:#bfb6aa}
.login-dialog{width:min(420px,calc(100vw - 26px))}.login-dialog form{display:grid;gap:12px;margin-top:20px}.login-dialog label{font-size:12px;color:#766d60}.login-dialog input{width:100%;border:1px solid #cdbda9;border-radius:9px;background:#fff;padding:12px;font:inherit}.login-dialog form button{background:#25231f;color:white;border:0;border-radius:50px;padding:12px}.login-dialog #login-error{color:#b54d34;min-height:20px}
@media(max-width:650px){.viewer-media{height:calc(100% - 175px)}.viewer-details{height:90px}.viewer-tools{min-height:85px;gap:6px}.viewer-tools button{font-size:11px;padding:7px 10px}.viewer-tools audio{width:100%;max-width:220px;height:28px}.voice-badge{right:7px;bottom:7px;font-size:8px;padding:5px 7px}}
