:root { --ink:#191a18; --ivory:#f4f0e8; --paper:#fbf9f4; --gold:#a88754; --gold-dark:#806338; --muted:#696961; --line:rgba(25,26,24,.16); --shadow:0 18px 48px rgba(70,54,29,.1); }
* { box-sizing:border-box; }
html { background:var(--ivory); }
body { min-width:320px; margin:0; color:var(--ink); background:var(--ivory); font-family:"DM Sans","Helvetica Neue",Arial,"Microsoft YaHei",sans-serif; }
a { color:inherit; text-decoration:none; }
button, input { font:inherit; }
button { color:inherit; }
.wordmark { font-size:18px; font-weight:700; letter-spacing:.2em; }
.eyebrow, .card-kicker { margin:0; color:var(--gold-dark); font-size:9px; font-weight:600; letter-spacing:.18em; line-height:1.45; text-transform:uppercase; }
.account-header { position:sticky; z-index:20; top:0; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; min-height:76px; padding:0 clamp(20px,4vw,64px); border-bottom:1px solid var(--line); background:rgba(244,240,232,.92); backdrop-filter:blur(14px); }
.account-header nav { display:flex; gap:28px; font-size:10px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; }
.header-links { display:flex; justify-content:flex-end; align-items:center; gap:22px; font-size:10px; font-weight:600; letter-spacing:.13em; text-transform:uppercase; }
.header-links span { display:inline-grid; place-items:center; min-width:16px; height:16px; margin-left:4px; border:1px solid var(--ink); border-radius:50%; font-size:8px; }
.header-links button { padding:0; border:0; background:none; cursor:pointer; }
.account-shell { display:grid; grid-template-columns:minmax(250px,27vw) minmax(0,1fr); min-height:calc(100vh - 76px); }
.account-sidebar { display:flex; flex-direction:column; min-height:calc(100vh - 76px); padding:clamp(42px,7vw,100px) clamp(24px,4vw,64px) 36px; border-right:1px solid var(--line); }
.account-sidebar h1, .content-heading h2, .feature-design h3, .section-head h3, .empty-state h2, .bag-heading h1, .auth-visual h1, .auth-card h2, .bag-item h2 { margin:10px 0 0; font-family:"Italiana",Georgia,serif; font-weight:400; line-height:.92; }
.account-sidebar h1 { font-size:clamp(54px,5.7vw,92px); letter-spacing:-.04em; }
.member-name { margin:22px 0 46px; color:var(--muted); font-size:13px; }
.account-nav { display:grid; gap:2px; }
.account-nav button { width:100%; padding:15px 0; border:0; border-bottom:1px solid var(--line); background:none; font-size:11px; letter-spacing:.08em; text-align:left; cursor:pointer; transition:padding .2s ease,color .2s ease; }
.account-nav button.is-active { padding-left:12px; color:var(--gold-dark); }
.sidebar-create { display:flex; justify-content:space-between; align-items:center; margin-top:auto; padding-top:30px; border-top:1px solid var(--line); font-size:10px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.sidebar-create span { font-size:18px; }
.account-content { min-width:0; padding:clamp(42px,6vw,94px) clamp(22px,6vw,108px); }
.content-heading { display:grid; grid-template-columns:minmax(0,1fr) minmax(220px,.48fr); gap:48px; align-items:end; margin-bottom:clamp(42px,6vw,78px); }
.content-heading h2 { font-size:clamp(48px,6vw,88px); letter-spacing:-.045em; }
.content-heading > p { max-width:390px; margin:0 0 4px; color:var(--muted); font-size:13px; line-height:1.75; }
.feature-design { display:grid; grid-template-columns:minmax(260px,.72fr) minmax(260px,1fr); gap:clamp(30px,5vw,74px); align-items:center; min-height:390px; padding:clamp(26px,4vw,58px); background:var(--paper); box-shadow:var(--shadow); }
.feature-design h3 { max-width:430px; font-size:clamp(40px,5vw,72px); }
.feature-design p:not(.eyebrow) { max-width:370px; color:var(--muted); font-size:13px; line-height:1.75; }
.feature-empty { grid-column:1/-1; padding:30px; }
.button-dark, .button-outline { display:inline-flex; align-items:center; justify-content:center; min-height:50px; padding:0 24px; border:1px solid var(--ink); font-size:10px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; cursor:pointer; transition:background .2s ease,color .2s ease; }
.button-dark { background:var(--ink); color:#fff; }
.button-dark:hover { background:transparent; color:var(--ink); }
.button-outline { background:transparent; }
.button-outline:hover { background:var(--ink); color:#fff; }
.summary-row { display:grid; grid-template-columns:repeat(3,1fr); margin:30px 0 clamp(60px,8vw,110px); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.summary-row a { min-height:110px; padding:22px; border-right:1px solid var(--line); color:var(--muted); font-size:10px; letter-spacing:.11em; text-transform:uppercase; }
.summary-row a:last-child { border-right:0; }
.summary-row span { display:block; margin-bottom:11px; color:var(--ink); font-family:"Italiana",Georgia,serif; font-size:42px; letter-spacing:-.04em; }
.account-details-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin:-48px 0 clamp(60px,8vw,110px); }
.account-detail-card { display:flex; flex-direction:column; justify-content:space-between; min-height:180px; padding:25px; border:1px solid var(--line); background:rgba(251,249,244,.5); }
.account-detail-card > div:first-child { display:flex; gap:15px; align-items:flex-start; }
.account-detail-card h3 { margin:7px 0 5px; font-family:"Italiana",Georgia,serif; font-size:30px; font-weight:400; line-height:1; }
.account-detail-card p:not(.eyebrow) { max-width:330px; margin:0; color:var(--muted); font-size:11px; line-height:1.65; }
.account-detail-card .text-button { align-self:flex-start; margin-top:22px; }
.member-avatar { display:grid; flex:0 0 auto; place-items:center; overflow:hidden; border:1px solid rgba(128,99,56,.38); border-radius:50%; background:linear-gradient(145deg,#d9ceb9,#8e7451); color:#fff; font-family:"Italiana",Georgia,serif; letter-spacing:.04em; }
.member-avatar img { width:100%; height:100%; object-fit:cover; }
.member-avatar-small { width:52px; height:52px; font-size:17px; }
.member-avatar-large { width:126px; height:126px; margin:20px 0 23px; font-size:37px; }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:20px; margin-bottom:24px; }
.section-head h3 { font-size:42px; }
.section-head > p { margin:0; color:var(--muted); font-size:12px; }
.text-button { padding:4px 0; border:0; border-bottom:1px solid currentColor; background:transparent; font-size:10px; font-weight:600; letter-spacing:.11em; text-transform:uppercase; cursor:pointer; }
.text-danger { color:#975950; }
.design-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.design-grid-full { grid-template-columns:repeat(2,minmax(0,1fr)); }
.design-card { position:relative; display:flex; flex-direction:column; min-width:0; padding:20px; border:1px solid var(--line); background:rgba(251,249,244,.58); }
.delete-design-trigger { position:absolute; z-index:4; top:14px; right:14px; display:grid; width:38px; height:38px; padding:0; place-items:center; border:1px solid rgba(25,26,24,.14); border-radius:50%; background:rgba(251,249,244,.9); color:var(--muted); cursor:pointer; box-shadow:0 5px 16px rgba(70,54,29,.08); transition:border-color .2s ease,background .2s ease,color .2s ease,transform .2s ease; }
.delete-design-trigger svg,.delete-dialog-icon svg { width:17px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.delete-design-trigger span { position:absolute; overflow:hidden; width:1px; height:1px; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; }
.delete-design-trigger:hover { border-color:#975950; background:#975950; color:#fff; transform:translateY(-1px); }
.delete-design-trigger:focus-visible { outline:2px solid var(--gold-dark); outline-offset:3px; }
.design-card-copy { padding-top:17px; }
.design-card h3 { margin:7px 0 8px; font-family:"Italiana",Georgia,serif; font-size:28px; font-weight:400; line-height:1; }
.design-card-copy > p:not(.card-kicker) { min-height:36px; margin:0; color:var(--muted); font-size:11px; line-height:1.55; }
.design-card strong { display:block; margin-top:13px; font-size:13px; }
.card-actions { display:flex; flex-wrap:wrap; align-items:center; gap:13px; margin-top:22px; }
.card-actions > button:first-child { padding:0; border:0; border-bottom:1px solid var(--ink); background:none; font-size:10px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; cursor:pointer; }
.circle-preview { position:relative; display:grid; place-items:center; width:min(100%,310px); aspect-ratio:1; margin:auto; border:1px solid rgba(25,26,24,.08); border-radius:50%; background:radial-gradient(circle at 45% 35%,rgba(255,255,255,.95),rgba(244,240,232,.55)); box-shadow:inset 0 0 0 8px rgba(255,255,255,.24),0 16px 32px rgba(82,64,30,.08); overflow:hidden; }
.circle-preview.is-compact { max-width:185px; }
.circle-preview.is-empty { color:var(--gold-dark); font-family:"Italiana",Georgia,serif; font-size:24px; letter-spacing:.12em; }
.circle-track { position:absolute; width:56%; height:56%; border:1px dashed rgba(128,99,56,.4); border-radius:50%; }
.preview-bead { position:absolute; left:50%; top:50%; width:var(--size); height:var(--size); transform:translate(-50%,-50%) rotate(var(--angle)) translateY(calc(-1 * var(--preview-orbit))) rotate(calc(-1 * var(--angle))); }
.preview-bead img { width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 3px 5px rgba(25,26,24,.2)); }
.circle-preview b { position:relative; color:var(--muted); font-family:"Italiana",Georgia,serif; font-size:clamp(16px,2.2vw,27px); font-weight:400; letter-spacing:.16em; }
.is-compact b { font-size:12px; }
.circle-preview.is-scene { overflow:visible; border:0; border-radius:0; background:transparent; box-shadow:none; isolation:isolate; }
.snapshot-plate { position:absolute; z-index:0; inset:0; border:1px solid rgba(25,26,24,.08); border-radius:50%; background:radial-gradient(circle at 45% 35%,rgba(255,255,255,.95),rgba(244,240,232,.55)); box-shadow:inset 0 0 0 8px rgba(255,255,255,.24),0 16px 32px rgba(82,64,30,.08); }
.snapshot-beads { position:absolute; z-index:1; inset:0; }
.snapshot-bead { position:absolute; z-index:1; left:var(--snapshot-x); top:var(--snapshot-y); width:var(--snapshot-width); height:var(--snapshot-height); transform:translate(-50%,-50%); filter:drop-shadow(-1px 3px 3px rgba(78,64,43,.27)) drop-shadow(-4px 8px 8px rgba(110,91,59,.13)); }
.snapshot-bead.is-pendant { z-index:2; transform:none; filter:drop-shadow(-1px 3px 3px rgba(78,64,43,.28)) drop-shadow(-4px 8px 8px rgba(110,91,59,.14)); }
.snapshot-visual { position:relative; display:block; width:100%; height:100%; transform:rotate(var(--snapshot-rotation)); transform-origin:center; }
.snapshot-bead.is-pendant .snapshot-visual { transform-origin:var(--snapshot-anchor-x) var(--snapshot-anchor-y); }
.snapshot-bead img { position:absolute; left:var(--snapshot-image-left); top:var(--snapshot-image-top); width:var(--snapshot-image-width); height:var(--snapshot-image-height); max-width:none; object-fit:contain; }
.circle-preview.is-scene > b { z-index:2; pointer-events:none; }
.design-card .circle-preview.is-scene { margin-bottom:30px; }
.circle-preview.is-preview-image { overflow:visible; border:0; border-radius:0; background:transparent; box-shadow:none; }
.circle-preview.is-preview-image img { width:100%; height:100%; object-fit:contain; }
.design-card .circle-preview.is-preview-image { margin-bottom:18px; }
.delete-design-dialog { width:min(520px,calc(100vw - 30px)); padding:0; border:0; background:transparent; color:var(--ink); }
.delete-design-dialog::backdrop { background:rgba(25,26,24,.48); backdrop-filter:blur(6px); }
.delete-design-dialog-card { position:relative; padding:clamp(32px,5vw,54px); background:var(--paper); box-shadow:0 28px 86px rgba(43,34,19,.26); }
.delete-dialog-icon { display:grid; width:42px; height:42px; margin-bottom:24px; place-items:center; border:1px solid rgba(151,89,80,.36); border-radius:50%; color:#975950; }
.delete-design-dialog h2 { max-width:360px; margin:10px 0 18px; font-family:"Italiana",Georgia,serif; font-size:clamp(42px,7vw,58px); font-weight:400; line-height:.96; }
.delete-design-dialog-card > p:not(.eyebrow) { max-width:390px; margin:0; color:var(--muted); font-size:13px; line-height:1.7; }
.delete-design-dialog-card > p strong { color:var(--ink); font-weight:600; }
.delete-dialog-actions { display:flex; justify-content:flex-end; gap:12px; margin-top:34px; }
.button-danger { display:inline-flex; min-height:50px; padding:0 24px; align-items:center; justify-content:center; border:1px solid #7e443c; background:#7e443c; color:#fff; font-size:10px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; cursor:pointer; transition:background .2s ease,color .2s ease; }
.button-danger:hover { background:transparent; color:#7e443c; }
.button-danger:focus-visible,.delete-dialog-actions .button-outline:focus-visible { outline:2px solid var(--gold-dark); outline-offset:3px; }
.empty-state { grid-column:1/-1; padding:clamp(36px,7vw,90px); border:1px dashed var(--line); text-align:center; }
.empty-state h2 { font-size:clamp(42px,5vw,66px); }
.empty-state p:not(.eyebrow) { max-width:430px; margin:18px auto 27px; color:var(--muted); font-size:13px; line-height:1.75; }
.orders-list { display:grid; gap:18px; }
.order-card { display:grid; grid-template-columns:185px minmax(200px,1fr) minmax(150px,.65fr); gap:30px; align-items:center; padding:25px; border:1px solid var(--line); background:var(--paper); }
.order-card h3 { margin:7px 0; font-family:"Italiana",Georgia,serif; font-size:33px; font-weight:400; }
.order-card p:not(.card-kicker) { margin:0; color:var(--muted); font-size:12px; }
.order-loading { min-height:220px; display:grid; place-items:center; border:1px solid var(--line); color:var(--muted); font-size:12px; }
.order-card-copy > strong { display:block; margin-top:12px; }
.order-card .order-current-state { margin-top:17px; color:var(--ink); font-size:11px; font-weight:700; letter-spacing:.04em; }
.order-card .order-latest-update { margin-top:8px; line-height:1.55; }
.order-latest-update time { font-size:9px; }
.order-card .order-link-error { margin-top:12px; color:var(--danger); line-height:1.5; }
.order-card-tracking { align-self:stretch; display:flex; min-width:0; flex-direction:column; justify-content:center; }
.order-progress { display:grid; grid-template-columns:repeat(4,1fr); margin-bottom:25px; }
.order-progress-step { position:relative; padding-top:16px; border-top:1px solid var(--line); color:#aaa59c; }
.order-progress-step span { position:absolute; top:-11px; left:0; display:grid; width:22px; height:22px; place-items:center; border:1px solid var(--line); border-radius:50%; background:var(--paper); font-size:8px; }
.order-progress-step small { display:block; padding-right:6px; font-size:8px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.order-progress-step.is-done,.order-progress-step.is-active { color:var(--ink); border-top-color:var(--gold); }
.order-progress-step.is-done span,.order-progress-step.is-active span { border-color:var(--gold); background:var(--gold); color:#fff; }
.order-progress-step.is-active span { box-shadow:0 0 0 5px rgba(168,135,84,.14); }
.order-card .order-preview-alert { margin:0 0 14px; padding:12px; border-left:2px solid var(--gold); background:var(--cream); color:var(--ink); line-height:1.45; }
.order-card .order-preview-alert span { display:block; margin-top:4px; color:var(--muted); font-size:9px; }
.order-detail-link { align-self:flex-start; min-height:42px; padding:0 17px; }
.order-detail-unavailable { color:var(--muted); font-size:9px; line-height:1.55; }
.profile-form { display:grid; gap:21px; width:min(560px,100%); padding:clamp(25px,4vw,48px); background:var(--paper); box-shadow:var(--shadow); }
.profile-form label, .auth-card label { display:grid; gap:9px; color:var(--muted); font-size:10px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
.profile-form label { position:relative; }
.profile-form label span { position:absolute; right:14px; bottom:15px; color:var(--muted); font-size:11px; text-transform:none; }
.profile-form input, .auth-card input { width:100%; height:48px; padding:0 14px; border:1px solid var(--line); border-radius:0; outline:none; background:rgba(255,255,255,.58); color:var(--ink); font-size:13px; letter-spacing:normal; text-transform:none; }
.profile-form input:focus, .auth-card input:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(168,135,84,.12); }
.form-message { min-height:18px; margin:0; color:var(--gold-dark); font-size:12px; line-height:1.5; letter-spacing:normal; text-transform:none; }
.profile-layout { display:grid; grid-template-columns:minmax(230px,.6fr) minmax(300px,1fr); gap:22px; width:min(860px,100%); align-items:stretch; }
.avatar-panel { display:flex; flex-direction:column; align-items:flex-start; padding:clamp(25px,4vw,48px); border:1px solid var(--line); background:rgba(251,249,244,.55); }
.avatar-panel > p:not(.eyebrow) { max-width:220px; margin:0 0 22px; color:var(--muted); font-size:12px; line-height:1.7; }
.avatar-panel > div:last-of-type { display:flex; flex-wrap:wrap; align-items:center; gap:15px; }
.avatar-panel small { margin-top:18px; color:var(--muted); font-size:10px; line-height:1.5; }
.addresses-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.address-card { min-height:250px; padding:25px; border:1px solid var(--line); background:rgba(251,249,244,.55); }
.address-card-top { display:flex; justify-content:space-between; gap:15px; align-items:start; }
.address-card h3 { margin:7px 0 16px; font-family:"Italiana",Georgia,serif; font-size:34px; font-weight:400; line-height:1; }
.address-card p:not(.eyebrow) { margin:0 0 10px; color:var(--muted); font-size:12px; line-height:1.7; }
.default-mark { padding:4px 7px; border:1px solid rgba(168,135,84,.45); color:var(--gold-dark); font-size:8px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
.address-actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:21px; }
.address-dialog { width:min(590px,calc(100vw - 30px)); padding:0; border:0; background:transparent; }
.address-dialog::backdrop { background:rgba(25,26,24,.42); backdrop-filter:blur(6px); }
.address-dialog-card { position:relative; display:grid; gap:21px; padding:clamp(28px,5vw,54px); background:var(--paper); box-shadow:0 28px 86px rgba(43,34,19,.23); }
.address-dialog-card h2 { margin:8px 0 3px; font-family:"Italiana",Georgia,serif; font-size:clamp(45px,7vw,66px); font-weight:400; line-height:.92; }
.dialog-close { position:absolute; top:16px; right:19px; width:34px; height:34px; padding:0; border:0; background:none; color:var(--muted); font-size:25px; cursor:pointer; }
.address-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:17px; }
.address-form-grid label { display:grid; gap:8px; color:var(--muted); font-size:9px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.address-form-grid label span { color:var(--muted); font-weight:400; letter-spacing:0; text-transform:none; }
.address-form-grid input:not([type="checkbox"]) { width:100%; height:46px; padding:0 13px; border:1px solid var(--line); background:rgba(255,255,255,.62); color:var(--ink); outline:0; font-size:13px; letter-spacing:normal; text-transform:none; }
.address-form-grid input:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(168,135,84,.12); }
.address-form-wide { grid-column:1/-1; }
.address-default-toggle { grid-column:1/-1; display:flex !important; align-items:center; gap:9px !important; color:var(--ink) !important; font-size:10px !important; letter-spacing:.06em !important; }
.address-default-toggle input { width:15px; height:15px; accent-color:var(--gold-dark); }
.bag-page { width:min(1240px,calc(100% - 48px)); margin:clamp(48px,7vw,110px) auto; }
.bag-heading { display:flex; justify-content:space-between; align-items:end; gap:25px; margin:11px 0 45px; }
.bag-heading h1 { font-size:clamp(58px,8vw,116px); letter-spacing:-.05em; }
.bag-heading a { padding-bottom:4px; border-bottom:1px solid var(--ink); font-size:10px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.bag-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(270px,.38fr); gap:clamp(28px,5vw,80px); }
.bag-items { display:grid; gap:16px; }
.bag-item { display:grid; grid-template-columns:155px minmax(0,1fr) auto; gap:28px; align-items:center; padding:20px 0; border-top:1px solid var(--line); }
.bag-item:last-child { border-bottom:1px solid var(--line); }
.bag-item h2 { font-size:35px; }
.bag-item p { color:var(--muted); font-size:12px; }
.bag-item a { border-bottom:1px solid var(--ink); font-size:10px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
.bag-price { display:grid; justify-items:end; gap:18px; }
.bag-summary { align-self:start; padding:28px; border:1px solid var(--line); background:var(--paper); box-shadow:var(--shadow); }
.bag-summary > div { display:flex; justify-content:space-between; padding:16px 0; border-bottom:1px solid var(--line); font-size:13px; }
.bag-summary > div strong { font-size:14px; }
.bag-summary > p:not(.eyebrow) { color:var(--muted); font-size:11px; line-height:1.7; }
.bag-summary .button-dark { width:100%; margin-top:10px; }
.bag-summary small { display:block; margin-top:12px; color:var(--muted); font-size:10px; text-align:center; }
.bag-empty { margin-top:30px; }
.auth-body { background:var(--paper); }
.auth-shell { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(430px,.9fr); min-height:100vh; }
.auth-visual { position:relative; display:flex; flex-direction:column; justify-content:flex-end; min-height:650px; padding:42px clamp(36px,7vw,110px); overflow:hidden; color:#fff; background:linear-gradient(90deg,rgba(25,26,24,.45),rgba(25,26,24,.08)),url('/assets/home/cirava-worktable.png') center/cover; }
.auth-visual::after { position:absolute; inset:0; background:linear-gradient(0deg,rgba(25,26,24,.58),transparent 60%); content:""; }
.wordmark-light { position:absolute; z-index:1; top:38px; left:clamp(36px,7vw,110px); color:#fff; }
.auth-visual-copy { position:relative; z-index:1; max-width:510px; }
.auth-visual .eyebrow { color:#f4f0e8; }
.auth-visual h1 { font-size:clamp(58px,7vw,108px); letter-spacing:-.05em; }
.auth-visual-copy > p:last-child { max-width:390px; margin:22px 0 0; color:rgba(255,255,255,.8); font-size:14px; line-height:1.75; }
.auth-panel { display:grid; align-content:center; padding:clamp(28px,7vw,100px); background:var(--paper); }
.back-link { align-self:start; position:absolute; top:40px; color:var(--muted); font-size:10px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.auth-card { width:min(430px,100%); margin:auto; }
.auth-card h2 { font-size:clamp(48px,5vw,68px); }
.auth-intro { margin:17px 0 32px; color:var(--muted); font-size:13px; line-height:1.7; }
.auth-switch { display:grid; grid-template-columns:1fr 1fr; margin-bottom:25px; border-bottom:1px solid var(--line); }
.auth-switch button { padding:11px 0; border:0; border-bottom:1px solid transparent; background:none; color:var(--muted); font-size:10px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; cursor:pointer; }
.auth-switch button.is-active { border-color:var(--ink); color:var(--ink); }
.auth-card form { display:grid; gap:18px; }
.auth-card [hidden] { display:none !important; }
.auth-card form .button-dark { width:100%; margin-top:4px; }
.auth-note { margin-top:24px; color:var(--muted); font-size:11px; line-height:1.7; }
.submission-list { display:grid; gap:16px; }
.submission-card { display:grid; grid-template-columns:190px minmax(0,1fr) auto; gap:28px; align-items:center; padding:22px; border:1px solid var(--line); background:var(--paper); }
.submission-visual { display:grid; width:190px; aspect-ratio:1; place-items:center; overflow:hidden; background:var(--soft); color:var(--muted); font-family:"Italiana",Georgia,serif; letter-spacing:.16em; }
.submission-visual img { width:100%; height:100%; object-fit:cover; }
.submission-card h3 { margin:7px 0; font-family:"Italiana",Georgia,serif; font-size:36px; font-weight:400; }
.submission-card p:not(.card-kicker) { max-width:650px; margin:0 0 9px; color:var(--muted); font-size:12px; line-height:1.7; }
.submission-card small { color:var(--gold-dark); font-size:10px; font-weight:600; letter-spacing:.1em; }
.submission-review-note { padding:10px 13px; border-left:2px solid var(--gold); background:rgba(168,135,84,.09); color:var(--gold-dark)!important; }
.submission-actions { display:grid; min-width:150px; justify-items:start; gap:12px; }
.submission-edit-dialog { width:min(620px,calc(100vw - 30px)); padding:0; border:0; background:transparent; }
.submission-edit-dialog::backdrop { background:rgba(25,26,24,.42); backdrop-filter:blur(6px); }
.submission-edit-dialog form { position:relative; display:grid; gap:18px; padding:clamp(30px,5vw,56px); background:var(--paper); box-shadow:0 28px 86px rgba(43,34,19,.23); }
.submission-edit-dialog h2 { margin:8px 0 5px; font-family:"Italiana",Georgia,serif; font-size:58px; font-weight:400; line-height:.92; }
.submission-edit-dialog label { display:grid; gap:8px; color:var(--muted); font-size:9px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
.submission-edit-dialog label span { font-weight:400; letter-spacing:0; text-transform:none; }
.submission-edit-dialog input,.submission-edit-dialog select,.submission-edit-dialog textarea { width:100%; min-height:46px; padding:0 13px; border:1px solid var(--line); background:rgba(255,255,255,.62); color:var(--ink); outline:0; font:13px "DM Sans","Segoe UI",sans-serif; letter-spacing:normal; text-transform:none; }
.submission-edit-dialog textarea { min-height:110px; padding-top:12px; resize:vertical; line-height:1.6; }
@media (max-width:1100px) { .order-card { grid-template-columns:150px minmax(200px,1fr); } .order-card .circle-preview { width:150px; } .order-card-tracking { grid-column:1/-1; } }
@media (max-width:900px) { .account-shell { grid-template-columns:1fr; } .account-sidebar { min-height:0; padding:38px 24px 20px; border-right:0; border-bottom:1px solid var(--line); } .account-sidebar h1 { font-size:54px; } .member-name { margin:12px 0 26px; } .account-nav { display:flex; gap:17px; overflow:auto; } .account-nav button { width:auto; flex:0 0 auto; padding:10px 0; border-bottom:1px solid transparent; } .account-nav button.is-active { padding-left:0; border-bottom-color:var(--ink); } .sidebar-create { display:none; } .design-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .account-details-grid { margin-top:-28px; } .auth-shell { grid-template-columns:1fr; } .auth-visual { min-height:38vh; padding:100px 32px 34px; } .auth-visual h1 { font-size:56px; } .auth-panel { min-height:62vh; padding:54px 28px; } }
@media (max-width:620px) { .account-header { grid-template-columns:1fr auto; min-height:62px; padding:0 19px; } .account-header nav { display:none; } .header-links { gap:14px; } .account-content { padding:42px 19px 64px; } .content-heading { grid-template-columns:1fr; gap:18px; margin-bottom:38px; } .content-heading h2 { font-size:54px; } .feature-design { grid-template-columns:1fr; min-height:auto; padding:22px; } .feature-design h3 { font-size:50px; } .summary-row { margin-bottom:58px; } .summary-row a { min-height:88px; padding:15px 9px; font-size:8px; text-align:center; } .summary-row span { font-size:33px; } .account-details-grid,.profile-layout,.addresses-grid { grid-template-columns:1fr; } .account-details-grid { margin:-35px 0 58px; } .account-detail-card { min-height:0; } .section-head h3 { font-size:38px; } .design-grid,.design-grid-full { grid-template-columns:1fr; } .design-card { padding:17px; } .delete-design-trigger { top:11px; right:11px; width:42px; height:42px; } .delete-dialog-actions { display:grid; grid-template-columns:1fr; } .delete-dialog-actions .button-outline { order:2; } .order-card { grid-template-columns:1fr; gap:20px; } .order-card .circle-preview { margin-left:0; } .submission-card { grid-template-columns:1fr; } .submission-visual { width:100%; max-width:280px; } .submission-actions { grid-auto-flow:row; } .order-card .circle-preview { margin-left:0; } .bag-page { width:min(100% - 38px,1240px); margin:45px auto; } .bag-heading { align-items:flex-start; flex-direction:column; margin-bottom:30px; } .bag-heading h1 { font-size:70px; } .bag-layout { grid-template-columns:1fr; } .bag-item { grid-template-columns:100px minmax(0,1fr); gap:16px; } .bag-item .circle-preview { max-width:100px; } .bag-price { grid-column:2; justify-items:start; } .address-form-grid { grid-template-columns:1fr; } .address-form-wide,.address-default-toggle { grid-column:auto; } .auth-visual { min-height:310px; } .auth-visual h1 { font-size:52px; } .auth-visual-copy > p:last-child { display:none; } .auth-panel { padding:52px 22px; } .back-link { top:24px; } }
