.ovc{--ovc-edge:#5a2f52;--ovc-picture:88px;--ovc-radius:18px;box-sizing:border-box;grid-template-columns:var(--ovc-picture) minmax(0, 1fr);border:1px solid var(--ovc-edge);border-radius:var(--ovc-radius);align-items:center;gap:12px;block-size:162px;inline-size:100%;max-inline-size:640px;margin-block:0 16px;padding:14px;display:grid;position:relative;overflow:hidden}@media (width<=399px){.ovc{--ovc-picture:72px;gap:10px;padding:12px}}@media (width>=640px){.ovc{--ovc-picture:104px;gap:16px;block-size:170px;padding:16px}}.ovc-picture{inline-size:var(--ovc-picture);block-size:var(--ovc-picture);place-items:center;display:grid;position:relative}.ovc-picture--skeleton{background:#ffffff0f;border-radius:50%}.ovc-body{flex-direction:column;align-items:flex-start;gap:4px;min-inline-size:0;display:flex}.ovc--skeleton{background:#ffffff08;border-color:#ffffff12}.ovc-bone{background:#ffffff0f;border-radius:6px;display:block}.ovc-bone--label{block-size:12px;inline-size:84px}.ovc-bone--headline{block-size:20px;inline-size:80%;margin-block:4px}.ovc-bone--line{block-size:12px;inline-size:100%}.ovc-bone--short{inline-size:60%}@media (prefers-reduced-motion:no-preference){.ovc--skeleton{animation:2s cubic-bezier(.4,0,.6,1) infinite ovc-pulse}}@keyframes ovc-pulse{50%{opacity:.5}}.ovc-themes,.ovc-bone--action{display:none}@media (width>=1024px){.ovc{max-inline-size:none}.ovc--written{--ovc-picture:136px;grid-template-columns:var(--ovc-picture) minmax(0, 1fr) min(440px, 40%);gap:32px;block-size:200px;padding-block:18px;padding-inline:28px}.ovc--locked,.ovc--invitation,.ovc--writing{--ovc-picture:56px;gap:20px;block-size:88px;padding-block:0;padding-inline:16px 20px}.ovc--written .ovc-body{gap:4px}.ovc--written .ovc-themes{border-inline-start:1px solid #ffffff14;flex-direction:column;justify-content:center;align-self:stretch;gap:10px;min-inline-size:0;padding-inline-start:28px;display:flex}.ovc-themes__list{grid-template-columns:fit-content(68%) minmax(56px,1fr);gap:8px 14px;margin:0;padding:0;list-style:none;display:grid}.ovc-theme{grid-column:1/-1;grid-template-columns:minmax(0,40%) minmax(56px,1fr);grid-template-columns:subgrid;align-items:center;column-gap:14px;min-block-size:18px;display:grid}.ovc--locked .ovc-body,.ovc--invitation .ovc-body,.ovc--writing .ovc-body{flex-direction:row;align-items:center;gap:20px}.ovc--written .ovc-bone--action,.ovc--writing .ovc-bone--action{border-radius:999px;block-size:32px;inline-size:132px;display:block}.ovc--written .ovc-bone--action{margin-block-start:6px}.ovc-bone--theme{block-size:12px;max-inline-size:100%}.ovc-bone--bar{block-size:6px}.ovc--locked .ovc-bone--headline,.ovc--invitation .ovc-bone--headline,.ovc--writing .ovc-bone--headline{flex:none;inline-size:26%;margin-block:0}.ovc--locked .ovc-bone--line,.ovc--invitation .ovc-bone--line,.ovc--writing .ovc-bone--line{flex:auto;inline-size:auto}.ovc--locked .ovc-bone--short,.ovc--invitation .ovc-bone--short,.ovc--writing .ovc-bone--short{display:none}.ovc--writing .ovc-bone--action{flex:none}.ovc--locked .ovc-bone--action,.ovc--invitation .ovc-bone--action{border-radius:999px;flex:none;block-size:44px;inline-size:168px;display:block}}
